Google announced support for 3D Models and AR experiences on Search this Google I/O 2019. This enables immersive and intuitive 3D based experiences directly on Search for users. With this capability, 3D content owners will now be able to showcase their amazing content to billions of users around the world.
glTF files for Google Search
In order for Google Search to surface your 3D Models, you will need to convert your 3D Models to glTF and host the glTF file on your website. Google Search will index these and start showing these models to users when they search.
With this feature, another large platform is now supporting glTF formatted files (Superformat!).
<model-viewer> for glTF display
Google had introduced <model-viewer> web component to add 3D models to websites. They have now introduced an additional attribute ar to indicate that this object can be visualised in AR mode. Also, you can also specify an ios-src attribute with a USDZ formatted model to view the model using AR Quick Look feature on iOS devices.
With these features, model-viewer web component makes it easy to add 3D Models to your websites and enable AR modes on Android, iOS and Magic Leap devices.
<model-viewer> preview in Point105-AR
We have added a View in model-viewer feature in our service starting today and as users you can preview how your models look directly on our service. Try it out at https://app.point105ar.com.
Code to add 3D Models
In order to add the model-viewer web component to your website, you need to first import the scripts for the component.
<script type="module" src="https://unpkg.com/@email@example.com/dist/model-viewer.js"></script> <script nomodule src="https://unpkg.com/@firstname.lastname@example.org/dist/model-viewer-legacy.js"></script>
To display the 3D Model, use the following HTML code.
<model-viewer alt="3D Model" src="model.glb" ios-src="model.usdz" magic-leap ar>
There are additional attributes such as auto-rotate and camera-controls that allow you make the objects dynamic and interactive.