This mini-guide details the quickest and easiest way you can get started with web-based AR using the Model Viewer API
The first thing you want to do is model and correctly export whatever it is you want to place in AR. You will then need to convert or export your model as a GLB or GLTF, which are the two most common forms of models used for AR. USDZ is an iOS-specific filetype, but new research suggests converting to USDZ is no longer needed if you use something called Model Viewer.
Model Viewer is an engine built by Google that takes GLB files and allows them to be placed in AR using a mobile device's camera. Some older devices may not support AR, but any device that does is capable of running modelviewer due to the fact that it runs in your web browser.
1. To get started with using Model Viewer, you'll need to create an HTML page where the Model Viewer engine will live. This is the webpage that will be responsible for placing your model in AR. Then you'll want to navigate to the Model Viewer link above to copy and paste the component into your HTML page.
2. Once you've copied and pasted the code that imports the Model Viewer engine, make sure to correctly format your 3D model by converting it through Blender, or exporting it directly from Maya by using the Babylon exporter.
3.Once your model is formated correctly, import it into the web development program of your choice, try using Glitch, which is great for first time coders and integrates well with Model Viewer.
4. You'll then need to replace the "src" attribute with the url or location of your model.
5. Once that's done, all you need to do is navigate to the webapge on your mobile device, and you should see something like the preview below, which will then allow you to place the model in AR. If you are using an iOS device, make sure you open the webage on the Safari web browser.
