Follow the instructions below to add a 3D product model to your online store. If you require any assistance or clarification with these instructions please contact James or get in contact via our contact page.
Step 1: Install the Spiff 3D Product Customiser app
- Search for our app in the Shopify App Store or click here for the link which will take you to our listing inside the store.
- Open the sign-up page
- Enter your myshopify.com store domain
- Click Install.
- Review the details, then click Install app.
- You can access the Spiff app on the Apps page of your Shopify admin.
- Follow the installation steps to fully install the app. You can find them here [link]
To use the 3D product visualisation benefits of the Spiff app, you’ll need to first obtain a 3D model file of your product/s.
Step 2: Request a 3D model of your product
- Before customers can view your products in 3D or AR, you need to source a 3D model of your product. 3D models are virtual representations of an object or surface in three dimensions. They let you view the object from any angle.
- You can get 3D models of your products through the Shopify Partner Program at extra cost or by requesting one from us directly.
- If you haven’t already discussed this with one of our staff before you installed the app, you’ll need to request one of our staff to make one for you. Simply fill out the form attached here
- From here you can connect and talk via live chat. Alternatively, email email@example.com with your request. All communication via these two methods is logged and recorded in our system, so we cannot miss it.
When taking photos of your product, please follow these guidelines:
- Make sure that your product is well lit.
- Make sure that your whole product is in focus.
- If possible, don’t use a cellphone camera. For large products like furniture, use a camera with a 50 mm lens. For small to medium size products, use a 70 mm or 100 mm lens.
- Take extra photos of any unique details or textures.
- Give the photo files clear titles like blue vase – top, or blue vase – left and store them in a clearly labelled folder.
- Product dimensions
- To create accurate 3D models, the Shopify Expert needs detailed measurements of your product.
When providing measurements, follow these guidelines.
- Describe each dimension of your product in clear, simple terms.
- Provide the measurements in mm.
- Include a diagram to show which dimensions the measurements correspond to.
- If you have technical drawings or CAD files associated with your product, include those as well.
Example of getting 3D models made
- Sally provides Spiff or the Shopify expert with six high-quality photos taken with a camera with a 70mm lens:
Product photo angles
Sally gives the expert a measurement diagram with corresponding product dimensions in millimeters:
- The height of the vase (1) is ____mm
- The top of the vase to the bottom of the neck (2) is ____mm
- The bottom of the neck to the bottom of the vase (3) is ____mm
- The diameter of the mouth of the vase (4) is ____mm
- The width of the lip of the mouth (5) is ____mm
- The diameter of the bottom of the neck (6) is ____mm
- There are 8 hexagonal faces on the vase
- The height of the hexagonal faces (8) are ____mm
- The width of the hexagonal faces (9) are ____mm
- The diameter of the widest part of the vase (10) is ____mm
- The diameter of the bottom of the vase (11) is ____mm
- The diameter of the foam feet are ____mm
- The 3D modeler uses these photos and dimensions to create a 3D model of the blue vase. The expert sends Sally a .glb (3D) and perhaps a .usdz (AR) file for her to add to the Spiff app’s assets area.
Step 3: Check the quality of the model
- When you receive your 3D model, you should check that you’re happy with its quality. You can view the model via the Spiff app once, you’ve attached the file to the product that it relates to within your Shopify store.
- Note: the more detailed and complex your model is, the higher the bandwidth which is needed to render the product via a desktop or mobile browser. If the detail is too high, or complex for the users’ browser or device to handle, they may experience latency issues or a sub par user experience while on your store.
- Check the model from all angles. While reviewing your model, consider the following questions:
- Does the model’s shape match the product reference photos that you provided to Spiff or to the Shopify expert?
- Are all parts of the model proportional to the rest?
- If you’re able to preview the model in augmented reality, then does the scale of the model look correct compared to the rest of the scene?
- Does the model look like it’s made from the same materials as the product?
- Do the model’s materials look stretched, blurry, or distorted?
- Are there details like scuffs or scratches to make the model’s materials seem more realistic?
- If parts of the product are transparent, reflective, or give off light, then do they look right?
- Do the edges all look realistic? Are any of them too sharp and need to be softened?
- If there are any decorative details, such as a logo or some text, then are they easy to see?
- Are there any gaps or holes where there shouldn’t be any?
- If you’ve hired a Shopify Expert to build your model, they should build the 3D model according to certain standards. To learn more about those standards so you can better review a model, see Creating 3D models for merchants.
- If you think that the quality of the model isn’t good enough, then contact the relevant person and explain what is wrong with it.
Step 4: Add a 3D model to the Spiff app
- When you have the Spiff app installed and have sourced a 3D model, you need to add the model to the Spiff App
- From your Shopify admin, click Apps.
- Click Spiff
- Click Add 3D Model.
- In the Title field, enter a title for the 3D model.
- In the Linked Product field, select the product and variant that this 3D model is associated with, then click Select product.
- Click Upload File and select the .usdz file provided by the Shopify Expert.
- Click Save.
- Repeat the upload process for the .gltf or .glb file that your Shopify Expert provided. Make sure you link it to the same product so that you have both 3D model file types associated with the product.
- If you upload a .gltf file, you’re prompted to add additional files in the Linked Files section. Click Upload File to upload the linked texture resources provided by your expert.