Related Experiment Video
Updated: Aug 5, 2025

04:15
Author Spotlight: Enhancing Engineering Education via WebVR-Based Online Laboratories
Published on: February 23, 2024
1.1K
Environment-Aware Rendering and Interaction in Web-Based Augmented Reality
José Ferrão1, Paulo Dias1,2, Beatriz Sousa Santos1,2
1Department of Electronics, Telecommunications, and Informatics (DETI), University of Aveiro, 3810-193 Aveiro, Portugal.
Journal of Imaging
|March 28, 2023
Summary
This novel framework accelerates device-agnostic augmented reality (AR) application development using WebXR. It enables realistic rendering, occlusion, and physics interactions for a fluid user experience across various devices.
Area of Science:
- Computer Science
- Human-Computer Interaction
- Computer Graphics
Background:
- Augmented Reality (AR) development often requires hardware-specific configurations.
- Web-based AR solutions aim for broader device compatibility.
- Realistic rendering and interaction are key challenges in AR.
Purpose of the Study:
- To present a novel, device-agnostic framework for web-based AR.
- To accelerate the development of AR applications for the web.
- To enable realistic rendering and physics-based interactions in AR.
Main Methods:
- Utilized WebXR and three.js for a web-based AR framework.
- Integrated deep neural networks for depth estimation from monocular cameras.
- Employed physically based rendering (PBR) for consistent scene illumination.
- Optimized a pipeline for fluid user experience on mid-range devices.
Main Results:
- Achieved realistic rendering of 3D elements with geometry occlusion.
- Enabled virtual object shadows on real surfaces and physics interactions.
- Demonstrated compatibility across a wide range of devices and configurations.
- Evaluated performance and visual features against state-of-the-art alternatives.
Conclusions:
- The proposed framework successfully accelerates device-agnostic AR development.
- The solution provides realistic rendering and interaction capabilities for web-based AR.
- The open-source library offers a versatile tool for integrating advanced AR features into web projects.

