Backend Configuration

Manage SVG Layout

To assign SVG layouts to the product, navigate to Product Designer > 3D Products > Manage SVG Layout.[1]

 

On the Manage SVG Layout page, click the Create SVG Layout button to create a new SVG layout for the product. This action will redirect the admin to the Add SVG Layout page.[2]

 

First, the admin must select the product from the Products dropdown menu.[3]

 

Now, enter the SVG Layout Name and set the Status to Enable using the respective field and dropdown menu.[4]

 

Once all general configurations are completed, upload the SVG Layout by clicking the Upload button beside the Upload SVG Layout field.[5]

 

Refer to the layout creation guide for more information on creating an SVG Layout.

 

The admin can also upload the Masking File and Reverse Masking for output.[6]

 

The admin needs to upload a Thumbnail Image for the SVG Layout. Accepted file formats are PNG, JPG, and JPEG. After completing all configurations, click the Save button to add the SVG Layout.[7]

2D + 3D Product Designer Settings

After the Simple Product is added, the admin navigates to Product Designer Settings for the 3D product.

 

To configure the 3D Product Designer settings, first enable the Product Designer by setting the Enable Product Designer toggle to Yes.[1]

 

Select the Designer Type as 3D Products from the Designer Type dropdown menu to configure the 3D Product Designer Settings.[2]

3D Products

Now, navigate to the 3D Products section and set the AR toggle to Yes to enable Augmented Reality in the designer tool.[1]

 

Now, select 2D Design 3D Preview from the Select 3D Type dropdown menu to create products with a 2D design interface and 3D preview functionality. This setting allows users to design the product more efficiently.[2]

 

The admin must now upload a 3D Model file for the product. Accepted file formats include .GLB and .GLTF.[3]

 

Refer to the .GLB file conversion guide for more information on converting files for the Designer Tool.

 

Now, to assign the SVG Layout, set the Assign SVG layout toggle to Yes and select the assigned SVG layouts for the product from the SVG Layout Selection grid.[4]

Design Area

Now, set the Design Area for the 3D Product. To do this, navigate to the Design Area section and select the SVG Image.[1]

 

The admin needs to upload this PNG Image along with the Product Image during product creation.[2]

 

The Design Area for 3D Products is set to Full Design Area by default. The admin only needs to fill in the Location Details. First, enter the Location Name and select the Image Side from the dropdown. The admin should ensure the Location Name and Image Side matches the SVG Layout Name exactly.[3]

 

Follow the same process for all sides of the product, and click the Save button to save the settings.[4]

 

Note:

 

The user must upload a GLB file to configure the product as a 3D Product.

 

The user must upload an SVG layout and configure it with the product so the product loads according to the assigned SVG layout.

 

The user must enable 3D Preview from Manage Layout. Only then will the product work as a 3D Preview Product.

Designer Tool View

On the Product Designer tool page, the admin can view the end design accordingly.[1]

 

The end user can view and interact with the Live 3D Product Preview in the floating 3D Preview window. They can also minimize or maximize the preview window as needed.[2]

 

To view the full preview, the admin must navigate to the Preview section. From there, the admin can switch between the 2D Preview and 3D Preview modes.[3]