The 3D/AR Viewer tool lets you show your products in 3D and AR wherever you want, be it a web page, a store, an internal catalog, or even an email to your customers.
This is a comprehensive guide on how to use the tool.
Summary
1. Tool intro
This tool empowers your customers to view your products in 3D and Augmented Reality. In particular, after uploading and setting the 3D model as you need, you can then:
- generate a button that end-users use to launch the viewer and you can place it where you need it.
- get a code that you can copy and paste where you need it to directly show the 3D/AR viewer as an iFrame.
- get a link that opens a white-label window with your 3D product that you can use for assets where you can't add any button or code.
2. How it works
2.1 Adding a product in 3D
- Go to your Zakeke 3D/AR Viewer back-office > Add product > Fill the dialog to create a new product (only the name is required -- the image is optional and it's only used for internal reference).
-
Upload your 3D model for the product that you have just created. Accepted formats are obj, glb, gltf and Babylon.
IMPORTANT
We suggest using a glb format as it already includes all materials/textures and you won't need to set them separately from the upload of the model as they will be automatically imported when you upload the model.
2.2 Adjusting the model and settings of the 3D scene
Once the 3D model has been uploaded, you'll see a page as the one here below.
This is where you can adjust your 3D model and set the 3D scene. In particular, this is the section where you:
- create the materials for your 3D model
- upload and manage textures, if any
- configure the lights
- manage the setting
Almost all the functionalities that you see here are the same as the ones in the Scene Editor from the 3D Product Configurator
IMPORTANT
Please note that if you upload a model in glb format you don't need to set any material or upload any texture because they're already included in the model and automatically imported when you upload the model.
2.3 Share and Embed the 3D/AR Viewer
Once a product has been saved, you are able to generate a link, an iframe, or a button to share or embed your 3D/AR Viewer on your website or other assets.
Link
In the link section, you find the link that you can copy and paste wherever you want. From that link, your customers will be able to open the 3D/AR Viewer.
You also find a QR Code that works the same way as the link.
Iframe
In the Iframe section, you can generate an iframe for your 3D/AR Viewer by setting your custom size for it. You can copy the HTML code and paste it on your own assets to directly show the 3D/AR Viewer with no need for any button or link to open it.
Button
In this section, you can generate a button that you can place on your pages or other assets to let your customers launch the 3D/AR Viewer from that button as a call-to-action.
Zakeke gives you all the tools to create the button as you prefer with your custom texts and colors.
Below the button preview, there is the HTML Selector.
If you need to place the button in a specific position in your HTML page you can do it simply by writing the future container of your button's ID or Class name in the HTML selector Textarea.
In this way, when you'll copy and paste the button link, it will place itself exactly in the container you need it into.
Otherwise, if you don't have a specific container where you want your button, you can leave the HTML selector empty and the button will be placed in the part of your Html where you paste it.
Checkboxes
These three checkboxes will let you decide what icons will be shown in the 3D product view.
Discover more in this video: