Getting Started

You will be able to upload any existing 3D model along with associated textures using this option for which you want to create an experience. You will get an option to upload 3D models post clicking on this option. The supported file formats include GLB, USDZ, PNG, and JPG. Additionally, this section covers the configuration options available for creating an engaging 3D/AR experience. All of the files can be uploaded together as a group. 

This will upload the selected files (Note: Both GLB and USDZ files must be uploaded without textures embedded) and bring up the panel that helps you to configure your 3D/AR experience. It has the following options:

• Product Information
• Color Variants
• Interaction
• Dimensions

Product Information:

Click on Product Information to add relevant information about the product such as the name, SKU, category, dimensions, etc. The following details must be provided under the Product Information section for each product. 

• Product Name: The product name is a unique identifier assigned to distinguish one product from another and is typically displayed in catalogs, online stores, and other product listings. For example, "XYZ Smartphone 2000" or "ABC Premium Laptop."
• SKU id: The SKU (Stock Keeping Unit) ID is a unique alphanumeric code assigned to each product to track inventory and sales. It can include numbers, letters, or a combination of both. For example, "SKU12345" or "ABC001."
• Product Category: This field refers to the classification or the grouping which the specific product belongs to based on its characteristics, features, or intended use. E.g. consumer electronics, furniture, toys, home decor, etc.
• Product Sub-category: This field refers to a further more specific classification of the product within a broader category. E.g. furniture category may include sofas, table, chair, bed, etc. as sub categories.
• Length, Width, and Height: These dimensions refer to the physical size or measurements of a product. They are typically specified in linear units such as inches, centimeters, or meters. Length represents the longest dimension, width represents the shorter dimension perpendicular to the length, and height represents the vertical dimension. 
• Units of measurement: Units of measurement determine the scale or size representation of the dimensions. Common units include inches (in), centimeters (cm), meters (m), millimeters (mm) and feet (ft). It is important to use consistent units throughout to avoid confusion. 
• Primary Dimension:  The primary dimension is the most important or significant dimension among the length, width, and height. It is usually the larger dimension that defines the primary aspect or orientation of the product.

Color Variants: 

Click on Color Variants to see the following fields. This option is used to configure the different color variants of a product.

Color 1:

• Color Name: The color name refers to the specific shade or hue assigned to a product. For example, "Ruby Red," or "Navy Blue."
• Color SKU id: The color SKU ID is a unique identifier assigned to a specific color variant of a product. It helps differentiate products that have the same model or style but come in different colors. 

Note: A png or jpeg file with a resolution of ‘300X300’ must be uploaded as the color icon. This icon will appear in the final web experience. The upload option is available next to the label ‘Color1’.

Click on ‘Add Material’ to see the following options.

• Select material: This drop down is used to choose the uploaded material in glb to configure. For example, “Ceramic_mat”.
• Select node: This option allows you to select the geometry node to configure. For example, “Vase_geo”.
• Select map type: This option is used to select a texture map that must be configured. For example, “BaseMap”, “Normal”, “Roughness”, etc.
• Select map file name: This option is used to select the uploaded texture maps in jpeg or png format. For example, “ceramic_mat_BaseColor.png”.

Then click on ‘Add Map’ to assign the texture map. Along similar lines, add the other texture maps such as normal, roughness, metalness etc. by choosing the map type and the corresponding map file name and then clicking on the ‘Add Map’ option. 

If multiple materials are uploaded, you can repeat the process of adding additional materials by clicking on ‘Add Material’ and going through the above process of selecting and uploading the appropriate maps.

Add Color: This option is used to configure secondary colors.

Interaction:

This option in the Avataar web app allows users to set up interactive elements with simple animations, enhancing user engagement and enabling exploration of products within the 3D/AR experience. For example, "Open" and "Close" animations for a chest of drawers.

To configure interactive elements for the GLB file, follow these steps:

In a GLB file, the animations are already saved as clips. The following simple procedure will map these clips to the corresponding action type.

• Choose ‘Open’ from the drop down menu. 
• Choose ‘Close’ from the drop down menu.

To configure interactive elements for the USDZ file, follow these steps:

• Enter the clip duration in the corresponding text field as a percentage of the total number of frames. 
• Enter the clip duration in the corresponding text field as a percentage of the total number of frames. 

For example, if 100 frames were used in total and open animation is 40 frames, then close animation will be 60 frames. In this case, ‘Open’ text field is 40% and the ‘Close’ text field is 60%. Only numerals to be entered.

Dimensions:

This option is used to map the dimension material of the product. This dimension will appear beside the product in the web experience and it can be configured to be ON or OFF.

The following options are available under dimensions.

• Select material: This drop down is used to choose the dimension material in glb to configure. For example, “Dimension_mat”.
• Select node: This option allows you to select the available geometry node in the usdz file to configure. For example, “Dimension_geo”.

Generate Preview:

Click on this button to preview the 3D model as a web experience. The 3D model will load in the web browser and it can be interacted with. The following buttons are given here.

• Color: This button shows the color variants of the product. (Primary and secondary colors if available)
• Interaction: This button triggers the ‘Open’ and ‘Close’ animation of the product. 
• Dimensions: This button toggles the visibility of the product’s dimensions.

After reviewing the model, click on the ‘Submit’ button to convert the 3D model and the associated textures into a web experience link.

Supported File formats:

The following file formats are supported by the configurator.

• GLB - GLB (GLTF Binary) is a file format used for 3D models and scenes in AR and VR applications. It is based on the glTF standard and offers compactness, complete 3D scene representation, real-time rendering with PBR, and interoperability across platforms.
• USDZ - USDZ is a file format developed by Apple for AR applications, based on the USD (Universal Scene Description) format. It integrates with Apple's ARKit, supports lightweight and efficient file sizes, enables animation and interactivity, and offers compatibility with various Apple applications and devices.
• PNG - PNG (Portable Network Graphics) is a widely used raster graphics file format known for its lossless compression, supporting sharp edges, solid colors, and transparency. It offers wide color support, including 24-bit RGB, 8-bit grayscale, and 48-bit truecolor, along with the ability to store metadata.
• JPG - JPG, or JPEG (Joint Photographic Experts Group), is a common file format for digital images, particularly photographs. It employs lossy compression, resulting in smaller file sizes but some loss of image quality. JPG supports variable compression levels, full-color representation with 24-bit truecolor, and enjoys widespread compatibility across software and devices.