The assets required to render the 360’ model will require two different types of asset files. The following specifications are required for 2D and 360.
2D Flat Images for Decoration Surface
- 2D flat images for each decoration surface (as .png or .jpeg).
- 2D flat images will be used to configure Artifi Views (for each decoration location) which are to be mapped with the 3D model layers where customization is required.
- Need Unique 2D images for each variant view separately having a uniform name and format.
360 Model to Display Customization
- 3D model (as exported .gltf).
- Need all the variant model folders in a single folder and the name of the folder should have a uniform name.
- Each model image's name should be unique even if the variant model has a similar type of asset in it.
- The name of the variant view name and the model layer name should match so that it becomes easy to set up the product in admin.
- The Layer Images in the folder, the layer name in GLTF, and the name of the layers in the spreadsheet should match exactly (It is case sensitive).
- The layer's name in the 360 models should not contain any space
360 Model Specification
- To integrate the 360’ model in Artifi a .gltf file is required.
- Artifi requires that each decoration surface to be created in the Artifi Views will need a separate layer in the .gltf file.
- The .gltf file to be used for the Artifi 360’ model is required to be created such that each decoration surface will need to be created as a separate layer in the .gltf file. Each separate layer for the decoration surfaces will be mapped 1:1 with the Artifi Views to be created on the Artifi Product.
- Each decoration surface should have two layers as explained below.
- 1st Layer (Top Layer for User Uploaded Graphics: Foreground): This layer will be the top layer where shoppers can upload an image/logo. This layer name should match exactly with the views that need to be created in Artifi. The Main Layer and the sublayer of one side decoration surface should be the same. An example is given in the screenshot below with the names Front and Left highlighted in yellow.
- 2nd Layer (Background): This layer is used to change the background of the decoration surface. For each decoration, a surface background layer should be created and the name of the material in the background layer should be the same across all the decoration surfaces. An example screenshot is given below for the front and left backgrounds. This is for the variant color or texture of the variant.
- If the background layer is not added in the model, and if the shopper uploads a smaller size graphics/logo the area that is not covered by the uploaded image will look empty and the inside area will be visible as shown in the below screenshot.
- The layer naming convention in the .gltf file will need to be “customer-friendly” (how we want to show it to the shopper). The Artifi Views will need to be created matching how each layer is named in the .gltf file.
Materials should be added to all the mesh. Customization works on the basis of the material so, the material is mandatory in all the layers.
Invalid 3D Model Setup
- Artifi does not support a .gltf file which is created with only a single layer representing all (>1) decoration surfaces.
- While creating the 360 Model, the origin point and the 3D cursor should be in the center of the 360 Model. Below is the screenshot with invalid and valid representations of the 3D cursor:
Invalid 3D Cursor
Valid 3D Cursor
- Below is an example of a single-layer file that will not work for customizing all views.
- Add a graphic to review that all the created decoration surfaces are not showing the graphics upside down. The below screenshot shows that the graphics are upside down.
- If the graphics are looking upside down, rotate the decoration surface layer from the UV Editing tab so that the uploaded graphics do not look upside down. Below is the correct example.
- Review all the decoration surface area by adding graphics to it. On adding the graphics it should not be stretched. The below screenshot shows that the graphic is being stretched.
- If the graphics are looking stretched, scale the decoration area properly from the UV Editing tab so that the uploaded graphics do not look stretched. Below is the correct example screenshot.
- One side decoration surface should be in a single mesh. If multiple meshes are required at the time of creation, they should be merged in a single mesh rather than keeping it in different layers. If the layers are not merged it would look like the below screenshot.
Export a GLTF File
Below are the steps to export the gltf file in a blender.
- Go to File >> Export and click on the “glTF 2.0 (.glb/.gltf)” as shown below.
- Click on the format dropdown and select glTF Separate (.glTF + .bin + textures).
- Leave the Texture and Copyright options blank and export the file by clicking on the Export glTF 2.0 and the file will be exported.