Adding 3D and Augmented Reality boards to your website.

It is possible to download 3D files and with some basic coding knowledge, add them to your website. View a working example

How to add 3D to your website

Download a 3D file

  1. First you need to download a 3D file. Go to the main boards page, click on the edit button of the board that you want to download, choose export and then download pack. This will download a zip file that includes the 3D file.
  2. Unzip the downloaded package, then open the 3d sub-folder.
  3. There will be two glb files for each skin. Either file will work, although the compressed version will load quicker. You will need to upload this file to your website.

Add Google's Model Viewer component to your website

3D files can be displayed by adding Google's model viewer component to your website. Full details of how to add the component are available here.

Augmented Reality

Augmented reality functionality can be added using some extra code that will display a button if a users device is compatible. See here for details.

Augmented reality is only available on IOS from version 13 and Android from this list.
Firefox browser is not currently supported.
If a users device is compatible, this icon will be displayed.

Still Stuck ?