Viewport
This section offers a comprehensive overview of the viewport interface located on the right side. It serves as the primary workspace, providing essential tools for interacting with the 3D scene and controlling the position of objects and lights. The navigation pane situated above the viewport provides additional tools for scene navigation and saving the project in the Avataar Experience Creator web application.
The viewport interface located on the right side of the Avataar web app consists of two main sections:
- Storytelling
- 3D/AR
Storytelling
The Storytelling section is divided into two tabs: "Property" and "Interaction". Within these tabs, users are provided with a wide range of tools to manipulate the 3D scene and customize its elements, enabling them to create engaging storytelling experiences.
Property
The property tab includes the following settings:
Object Orientation:
Through this option, you can assess the product's orientation along the X, Y, and Z axes in terms of its position, rotation, and scale. However, these values can’t be changed under this option and the SKU has to be moved manually using the move tools.
Camera Settings:
You can precisely control/limit the camera movement and zoom using the following three options:
- Horizontal - You can set the minimum and maximum limits for horizontal camera movement by using the ‘min’ and ‘max’ sliders.
- Vertical - You can set the minimum and maximum limits for vertical camera movement by using the ‘min’ and ‘max’ sliders.
- Zoom - You can control the minimum and maximum zoom levels of the camera by using the sliders.
Scene Settings:
The Scene Settings allow users to adjust the position, rotation, and scale of the room being used in the scene. These settings significantly influence the overall layout and presentation of the 3D environment.
AI Editing:
You can utilize this option to eliminate noise from a neural render. The noise removal can be adjusted along a linear scale (ranging from 0 to 1), effectively eliminating unwanted artifacts from the scanned model. Furthermore, noise reduction can be achieved through the cropping option, available for adjustments along the X, Y, and Z axes.
In addition, the color correction tool provided allows you to exercise control over the object's contrast and exposure.
Important
This option is only available if you are using a Neural render (scanned model through Incarnate by Avataar) and won’t be visible if you are using an uploaded 3D model.
Light Settings:
Users have the flexibility to enhance the scene's lighting by adding lights by clicking on the ‘plus’ button. Three types of lights can be introduced into the scene by using the drop down:
- Ambient Light - Adds an ambient light source to the scene
- Directional Light - Adds an extra light source with adjustable positions in the x, y and z directions
- Spot Light - Adds a spot light source with adjustable positions in x, y and z directions
Once a light is added, it can also be removed using the ‘-’ sign at the right side of the light.
Furthermore, you have the ability to fine-tune the light intensity within the added illumination. To make these adjustments, simply click on the parallel lines located on the left side of the "remove light" option. Here, you'll encounter a linear scale (ranging from 0 to 10) that facilitates the precise control of light intensity. Additionally, a color picker option is provided for modifying the light's color, accompanied by a checkbox that enables the casting of shadows.
Additionally, you can upload a custom High Dynamic Range (HDR) image to achieve desired lighting effects and atmosphere by clicking on the upload button next to the label “Upload HDRI”.
Shadow Settings:
The Shadow Settings enable the users to fine-tune the shadows in the scene by using the following options:
- Shadow Color - Allows you to change the color of the shadows using a color picker.
- Shadow Opacity - Controls the transparency of the shadows using a slider.
Interaction
In the Interaction tab, you can access options to interact with and manipulate various elements within the 3D scene. These elements include the canvas, camera, color variants, and text elements.
Canvas:
Users have the flexibility to adjust the values of the canvas width and height on which the 3D scene is rendered. This enables them to customize the size of the rendered scene according to their preferences and requirements.
Camera:
This option allows users to set the default position of the camera in the x, y, and z coordinates, enabling precise control over the camera's initial placement within the 3D scene.
Moreover, the FOV (Field of View) slider is provided, which allows users to adjust the camera's field of view. This control modifies the visible area captured by the camera, influencing how much of the scene is displayed and the perception of depth and perspective.
Object:
This option enables users to add and manage variants of the product in the scene through a convenient selection option through checkbox. With this feature, you can easily select and apply different variations to the objects, which eases the customization process for variants.
Important
This option will only be visible if you have added a 3D mesh, it won't appear in case you loaded a Neural Render.
Text:
This option provides a dedicated tool to add and edit text elements within the 3D scene. With this tool, you can easily include textual content in their 3D scenes, making it possible to enhance the scope of branding. The text elements are also three dimensional in nature and can be customized in terms of font style, size, color, and position, enhancing the storytelling and interactive aspects of the scene.
3D/AR
To view the uploaded object/SKU in Avataar's renderer, you need to click on the '3D/AR' option. Once clicked, the object will load in the renderer, enabling you to rotate and observe the object along with its variants (if applicable). If you wish to enable the light for a better visualization, you can click on the checkbox ‘Enable Light’ at the top right corner of the page, to activate the light source. This feature enhances the visual representation and allows you to interact with the object in a more dynamic and immersive manner.
