As digital content creators, we are constantly looking for better ways to interact with our audience and advance digital experiences forward. Often, our ideas are hindered by software or hardware limitations that just aren’t available yet. “I can’t wait for the day when…” gets thrown around regularly. We aim to create seamless, intuitive experiences that don’t require an in-depth knowledge of technology to create the greatest adoption and positive customer experience. Well, the future is now for 3D online experiences. With the arrival of Google’s Model Viewer, we can now easily embed 3D objects onto web pages and interact with them through modern browsers without any special software or applications. Furthermore, mobile devices now have built-in capabilities to open 3D and Augmented Reality experiences through their integrated cameras.
The Scylla Group have been eagerly awaiting this convergence of hardware and software to be able to bring more immersive experiences to fruition. In fact, we most recently integrated 3D model viewing and AR product placement to the Rubbermaid Commercial Products product catalog. Site visitors can interact with products in full 3D using nothing more than their existing browser and their fingers! We think this is a great opportunity for showcasing product features and bridging the gap between online and brick-and-mortar shopping experiences.
Since this technology is relatively new, we thought it would be helpful to explain some of the technical aspects that are involved with creating these 3D and AR experiences online.
So, what is Model Viewer?
Model Viewer is an open source web component developed by Google and maintained through GitHub. Model Viewer aims at putting 3D content on the web easily with a few lines of HTML code. This was first introduced with Chrome 72 in July 2019 and enables users to view 3D in the browser and mobile devices. This technology has now expanded to offering full Augmented Reality experiences on your phones, and your desktop. In essence, your phone browser is using your phone AR capabilities.
What is a Web Component?
A Web Component is HTML, JavaScript, and CSS that has been bundled into a package that is able to insert itself into the DOM; allowing it to be used as if it were a native HTML tag. When inserted, the component makes use of the Shadow DOM, which can be visualized as a separate HTML document that is nested within a parent HTML document. This shadow DOM has all the necessary references to the JS and CSS that allows it to work without any involvement from the developer. These are great for making reusable and shippable components that work natively without external libraries
What is Scene Viewer?
Scene Viewer is a native application that is written by Google and ships with Android, the iOS counterpart is called Quick Look. These ship outside of the browser (so it doesn’t matter what browser is being used) and on their respective devices as part of the operating system.
What is WebXR?
WebXR, as the name implies, is an AR software that exists within browsers which allows the user to remain on the site while viewing an AR experience as opposed to having to launch a separate application.
Want to build an AR project?
Shoot us an email or call us and let's discuss your idea during a FREE consultation.
Related Articles
