7.14.0 - 3D Product Configurator User Manual and Integrations Guide
In this article, we will learn how to use the 3D Product Configurator in 3D Cloud:
- 1 1. Introduction
- 2 2. 3D Cloud™ CMS
- 3 3. Configurator and Folder Management
- 4 4. Create 3D Components
- 4.1 4.1 What is a 3D Component
- 4.2 4.2 Defining a component
- 4.2.1 4.2.1 Meshes
- 4.2.1.1 4.2.1.1 Positions
- 4.2.1.2 4.2.1.2 Materials
- 4.2.1.3 4.2.1.3 Material Slots
- 4.2.1 4.2.1 Meshes
- 4.3 4.3 Bulk creation and editing
- 5 5. Define Steps & Options
- 5.1 5.1 Configurator Options
- 5.1.1 5.1.1 Multi-Product SKU
- 5.1.2 5.1.2 Image Root URL
- 5.1.3 5.1.3 Select Thumbnail Image
- 5.1.4 5.1.4 Base Price
- 5.1.5 5.1.5 Header and Price Settings
- 5.1.5.1 5.1.5.1 Header Text
- 5.1.5.2 5.1.5.2 Use SKU in Sub-Header
- 5.1.5.3 5.1.5.3 Use text in Sub-Header
- 5.1.5.4 5.1.5.4 Sub-Header Text
- 5.1.5.5 5.1.5.5 Pricing in Header
- 5.1.5.6 5.1.5.6 Pricing Level
- 5.1.5.7 5.1.5.7 Option Pricing Display
- 5.1.6 5.1.6 Camera Settings
- 5.1.6.1 5.1.6.1 Heading
- 5.1.6.2 5.1.6.2 Pitch
- 5.1.6.3 5.1.6.3 Fit to Screen Multiplier
- 5.1.6.4 5.1.6.4 Height
- 5.1.7 5.1.7 Additional Settings
- 5.1.7.1 5.1.7.1 Download Image Feature
- 5.1.7.2 5.1.7.2 Share Feature
- 5.1.7.3 5.1.7.3 WebAR
- 5.1.7.4 5.1.7.4 HD Render Spins
- 5.1.7.5 5.1.7.5 Plugins
- 5.1.7.6 5.1.7.6 Custom CSS
- 5.1.7.7 5.1.7.7 3D Background Color
- 5.1.7.8 5.1.7.8 Custom Metadata
- 5.2 5.2 Steps
- 5.2.1 5.2.1 Importing data from SIF files
- 5.2.2 5.2.2 Import/Export data from/to a spreadsheet
- 5.2.3 5.2.3 Step Label
- 5.2.4 5.2.4 SKU Component Order
- 5.2.5 5.2.5 Display Type
- 5.2.6 5.2.6 Reset to Default
- 5.2.7 5.2.7 Filters & Sort By
- 5.2.7.1 5.2.7.1 Sort By Filters
- 5.2.7.2 5.2.7.2 Sort By Price
- 5.2.7.3 5.2.7.3 Filters
- 5.2.8 5.2.8 Camera
- 5.2.9 5.2.9 Hotspots
- 5.2.10 5.2.10 Help Content
- 5.2.10.1 5.2.11 Option Query
- 5.2.10.2 5.2.12 Step Properties
- 5.3 5.3 Options
- 5.3.1 5.3.1 Option Label
- 5.3.2 5.3.2 SKU Component Code
- 5.3.3 5.3.3 Price Difference
- 5.3.4 5.3.4 Image Type
- 5.3.4.1 5.3.4.1 Split
- 5.3.4.2 5.3.4.2 Hex code
- 5.3.4.3 5.3.4.3 Image
- 5.3.5 5.3.5 3D Render Components
- 5.3.6 5.3.6 Filters
- 5.3.7 5.3.7 Tooltip Content
- 5.3.7.1 5.3.7.1 Tooltip Header
- 5.3.7.2 5.3.7.2 Tooltip Body Text
- 5.3.8 5.3.8 Help Content
- 5.3.8.1 5.3.8.1 Help Modal Entry Label
- 5.3.8.2 5.3.8.2 Help Modal Entry Subheader
- 5.3.8.3 5.3.8.3 Help Modal Entry Text 1
- 5.3.8.4 5.3.8.4 Help Modal Entry Text 2
- 5.3.9 5.3.9 - Properties
- 5.3.10 5.3.10 Import/Export from/to a spreadsheet
- 5.3.11 5.3.11 Step Groups
- 5.4 5.4 Internalization and translation
- 5.1 5.1 Configurator Options
- 6 6. Manage Dependencies
- 6.1 6.1 Defining Dependency Tree
- 6.2 6.2 Steps and Step Order
- 6.3 6.3 Options
- 6.3.1 6.3.1 Defaults
- 6.3.2 6.3.2 Visibility
- 6.3.3 6.3.3 Order
- 6.3.4 6.3.4 Option Query
- 6.3.5 6.3.5 Dependent Children
- 7 7. Configuration Preview
- 8 8. Generating Renders
- 9 9. 3D Product Configurator Inspection Tool
- 10 10. Marxent Assembly to Configurator Tool
- 11 11. Implementing On a Website
1. Introduction
The 3D Cloud™ 3D Product Configurator is a platform for product configurators that includes a content management system (CMS) and the front end configurator application for displaying them to users. The content management system is part of the 3D Cloud™ by Marxent and is for building configurators (3D Product Configurator Backend). The front end application can be delivered as a NPM package, via a CDN folder, or an iframe site to be integrated into websites (3D Product Configurator Frontend). The entire platform is data driven allowing for product configurators to be built or modified without having to publish new code.
Product configurators are built using 3D components, steps, and options. 3D components are the parts of the product to be configured. Each component will have one or more 3D mesh/models of the part and optionally one or more materials which can be swapped on that mesh. During the 3D modeling process the product the configurator for, would be broken down to the parts that need to be swapped or have materials swapped on them. Steps define the choices that a user makes and/or the parts of the SKU. Steps have options, and the options are the choices the user can make or the choices that are made, through dependencies with other steps.
This manual is meant to define the 3D Product Configurator and how to use each part to build, edit, and publish configurators.
2. 3D Cloud™ CMS
2.1 How to login
To use the 3D Product Configurator users must login using an account that has the appropriate user roles defined in the 3D Cloud™ CMS. To login, navigate to https://cms.3dcloud.io. Enter username and password to access the site and 3D Product Configurator.
2.2 How to open 3D Product Configurator
To open 3D Product Configurator a user must select a client in the CMS first. Select the client from the Home screen.
To open 3D Product Configurator, navigate in the left side menu to Utilities -> 3D Product Configurator
3. Configurator and Folder Management
The 3D Product Configurator supports a folder system to store and organize configurators. Users can create, move, rename, or delete folders. Folders can be nested inside other folders and configurations can be created inside any folder or at the top/root level. Folders and configurators can be dragged and dropped to change their parent folder. Dragging onto the back arrow will move them to their parent’s parent folder.
3.1 Create a folder
To create a folder select the Create New Folder button.
3.2 Open a folder
3.3 Renaming, moving, or deleting a folder
A user can rename, move, or delete a folder by selecting the options menu (... icon) on the folder you wish to edit.
Folders cannot have the same name as another folder. If this is detected, a number will be appended to the folder name. For example:
Original Folder Name
duplicated will be:
Original Folder Name (1)
duplicated again will be:
Original Folder Name (2)
etc
3.4 Creating a configurator
To create a new configurator select Create New Configurator.
3.5 Opening a configurator
To open a configurator click the configurator on the list.
3.6 Rename, duplicate, move, publish, or delete a configurator
A user can rename, duplicate, move, publish, or delete a 3D Product Configurator by selecting the options menu (... icon) on the folder you wish to edit.
3.7 Publishing configurators
Whenever a change is made to a configurator, the configurator is saved automatically. That saved version is called the latest version. The latest version can be previewed in the preview modal. See below for more information about the preview modal.
When a configurator is ready to test in the test/QA environment select the option menu and click the Publish To: Test option. This will register the current version as the test version of the configurator and will be available to 3D Product Configurator front end builds pointed at the test environment.
3D Product Configurators promoted to the test environment will automatically show up in the default queue of the 3D Product Configurator Inspection Tool in the QA state.
The staging version is meant to be for external review and certification testing. To publish to a staging version click the Publish To: Staging button in the option menu.
The active version is the production version. This version is used with 3D Product Configurator front end builds pointed at the production environment.
3.8 Version history and restoring versions
Whenever a change is made to a configurator, the configurator is saved automatically. That saved version is called the latest version. Each time a change is made a new version is created in the version history. If you would like to view a previous version you can open the version history from the options menu. From the version history modal
Once a version is open it can be restored, making it the latest version, by clicking the Restore This Version button at the top of the open configurator.
4. Create 3D Components
4.1 What is a 3D Component
3D Components are the 3D parts that are combined through the 3D Product
Configurator to define a 3D product. Any part or component of a product that needs to be swapped or material changed should be defined as a separate component entry in the 3D Product Configurator.
Components in the 3D Product Configurator consist of a list of meshes, a list of materials, and a list of material slots for a specific component name. You also define positions for the mesh, and each position defined will create an instance of the component in the 3D scene.
4.2 Defining a component
To create a new component click the Add New Component button.
4.2.1 Meshes
The primary part of a component is a list of one or more meshes. These are linked to Product IDs (PIDs) which are the 3D Cloud™ unique IDs for 3D models/materials in the 3D Cloud™ CMS.
To add a mesh to a component click the Add New Mesh button found inside the component box. Then in the search and browse modal that opens, select the product you wish to pick for the mesh. You can rename the mesh by clicking the header bar text and typing in your custom name, this can be useful when referencing in the options later.
4.2.1.1 Positions
Each mesh in a component needs at least one position defined. The position is the location the mesh will be placed in the 3D scene relative to the origin, which is the bottom center of the scene. Most will work with 0,0,0 position and rotations defined. More than one position can be defined to instantiate more than one instance of this mesh in the 3D scene, one at each position defined. To add a new position click the Add New Position button and enter your position and rotation values in the fields.
4.2.1.2 Materials
Materials are defined for a mesh as a list linked to Product IDs that correspond to 3D Cloud™ products with material data. No materials are required to be defined. To add a new material click the Add New Material button and choose your material product ID in the search and browse modal. Select the “...” menu to delete a material.
4.2.1.3 Material Slots
3D Product Configurator supports swapping more than one material on a single 3D Component. Each material that can swap is called a material slot and needs to be defined in the component, allowing in the options for a user to assign a material to a specific slot. These slots must match up to material slots defined in the mesh itself during the 3D content creation process. Select the “...” menu to delete a slot.
4.3 Bulk creation and editing
To bulk create or edit 3D Components use the Import/Export tool. The Import/Export tool uses Excel spreadsheets to allow for editing a large number of 3D Components in a spreadsheet and the transfer from one configuration to another.
To export to an Excel Spreadsheet of the current 3D Components setup in your open configurator select the Export Components button.
To import a spreadsheet containing new components or edits to existing components select the Import Components button.
Each row in the spreadsheet will be associated with a component id and be either a row representing a mesh or a row representing a material. Material rows are also associated with the mesh name. An example of the format:
5. Define Steps & Options
The configuration builder allows for a user to define the settings for the entire configuration being built along with the steps and options available to use.
A step in 3D Product Configurator is a choice in a configurator that is made either directly by a user's input or through dependency logic linking to other user choices.
An option is one of the choices within a particular step that a user or dependency can choose from. Options are associated with the 3D components defined previously in this manual and the steps and options defined at any given point define what would be visible in the 3D viewer through linking 3D components to the options.
Steps and options make up the core parts of a configuration picker. We use these to define dependencies and rules in the Manage Dependencies section documented later in this manual.
5.1 Configurator Options
5.1.1 Multi-Product SKU
Specifying that a configurator should support multiple SKUs allows for the configurator to display a list of product SKUs, not just one resolved SKU. This works with the step display type Item Summary to support multiple resolved skus.
5.1.2 Image Root URL
Defining an Image Root URL allows for direct definition of image urls in each step without needing to enter a full URL each time. This can be left blank when using the built in image picker and upload tools in 3D Product Configurator.
5.1.3 Select Thumbnail Image
An image can be uploaded or linked to that will be used in the folder/configurator browser to represent what the particular configurator is.
5.1.4 Base Price
The base price is the fixed price that all other options are added to to calculate the final price.
5.1.5 Header and Price Settings
5.1.5.1 Header Text
The header text is the main title text that shows up in the configurator to the user. See example here:
5.1.5.2 Use SKU in Sub-Header
If you want the SKU to appear in the header / footer on mobile devices, select Enable.
5.1.5.3 Use text in Sub-Header
If you want the sub-header text defined below to appear in the header then select Enable.
5.1.5.4 Sub-Header Text
Enter any text you want to appear in the header here. This will only be visible in the configurator header if the Use text in Sub-Header is set to Enable.
5.1.5.5 Pricing in Header
If you want the total price to appear in the header select Enable.
5.1.5.6 Pricing Level
3D Product Configurator allows for two types of pricing levels to be set up in a configurator. Product level or option level can be chosen.
Product level pricing only shows the total product price to the user of the configurator.
Option level pricing shows the product level total price and also shows the price of each option in each step.
5.1.5.7 Option Pricing Display
When showing option level pricing there are two types of option prices you can pick from, relative cost and actual cost.
Relative cost will show the price difference between the current option and the option you can pick.
Actual cost will show the total price added to the base price by an option and not relative to other options.
5.1.6 Camera Settings
3D Product Configurator allows for customizing the default camera position in the 3D viewer on first entry into a configurator.
5.1.6.1 Heading
Heading is the rotation around the vertical axis in degrees. Adjusting heading will change where the camera starts around the product, the camera will always face the product. This value should be between 0 and 360 and rotates around the product counter-clockwise.
5.1.6.2 Pitch
Pitch is the rotation around the horizontal axis in degrees. Adjusting pitch will change how high the camera is relative to the product and the camera will always still face the product. The pitch should be between 0 and 90 with 90 being looking straight at the front of the product and 0 being above the product.
5.1.6.3 Fit to Screen Multiplier
Fit to Screen Multiplier is the value defining how much of the product appears in the 3D view by default. A value of 1 would have the product filling the view by default. A value of 2 would have the product be half as big as the view.
5.1.6.4 Height
Height is the length in meters from the center of the product that the camera is looking at. So instead of the camera looking at the center of the product, the height can adjust the point to be higher or lower.
5.1.7 Additional Settings
5.1.7.1 Download Image Feature
Toggles if the download image button is on or off in the configurator.
5.1.7.2 Share Feature
Toggles if the share button is on or off in the configurator.
5.1.7.3 WebAR
3D Product Configurator supports on demand generation of USDZ and GLB file formats for use with WebAR. WebAR also requires the front end build must also be set up to support WebAR and the client must be subscribed to the service.
5.1.7.4 HD Render Spins
The 3D Product Configurator supports showing the product in a rendered spin in place of a 3D WebGl based view. Enable in your configurator when this feature is available to show 2D rendered spins in place of 3D. For more information, see Section 8.
5.1.7.5 Plugins
The 3D Product Configurator architecture allows for client implementations of the 3D Product Configurator platform to include custom code via plugins. When defining a configuration you can add plugin names here to activate them. To add more than one enter the names comma separated with no spaces.
5.1.7.6 Custom CSS
The 3D Product Configurator architecture allows for CSS overrides to be passed down in the configuration file to the front end to change colors, fonts, and sizes. For example:
.mxt-spins-loading-progress-background {
background-color: rgba(255,0,0,0.5);
}
.mxt-configurator-container .section-header h2 {
color: green;
}5.1.7.7 3D Background Color
The 3D Background Color field allows for changing the default background color in the 3D view. You can enter a Hex Code color value and see a preview.
5.1.7.8 Custom Metadata
For custom plugins and features you can add custom data to the Custom Meta Data field in the configuration. This is a string field that can contain almost any data you need for the front end application.
5.2 Steps
A step in 3D Product Configurator is a choice in a configurator that is made either directly by a user's input or through dependency logic linking to other user choices. Configurators all have one or more steps with one or more options available on each step.
5.2.1 Importing data from SIF files
3D Product Configurator supports importing data from SIF files into an existing configurator or creating a new configurator from the SIF files. Feel free to watch this short demo video or read along for more detailed information and screenshots:
To do this, first click the Import Steps button above the steps and select Import SIF File.
Next you will need to enter the three files that make up a SIF data set.
You do not need to know which SIF file is your TOP, KEY or OPT file. Our system will intelligently detect each file automatically
Once the SIF files are uploaded a user will have the ability to assign steps found in the SIF data to steps in the configurator. A user can pick the entry level in the file to build steps from. Once a level is selected at the top of the modal, a user can add steps to the configurator if you choose Replace. Or you will see the steps in the configurator to update.
Once you have the options and steps assigned you can click Apply Changes to import the pricing data into your configurator.
5.2.2 Import/Export data from/to a spreadsheet
3D Product Configurator supports exporting steps to an Excel spreadsheet or importing data from a spreadsheet into an existing configurator. Export to a spreadsheet by clicking the Export Steps button. To import from an Excel spreadsheet, first click the Import Steps button above the steps and select Import Excel.
Choose a spreadsheet to import or drag and drop into the modal.
Preview the changes found in the spreadsheet and import those changes or cancel.
5.2.3 Step Label
The step label is the name of the step shown in the configurator to the user.
Step Labels also appear automatically if hovering over a Step Name in the Dependency Tree:
5.2.4 SKU Component Order
The SKU component order defines what place in the SKU this step’s option SKU component code gets added. The order is ascending.
5.2.5 Display Type
The display type of the step defines how the steps options are presented in the configurator to the user.
The default Display Type for new Steps is always set to Swatch. This includes Steps generated via SIF Import.
● Swatch: Displays the options as image swatches or hexcode swatches
● Text Only: Displays each option as a text button to click
● Dropdown: Displays the options in a drop down menu for the user to select
● None: For steps that should not be visible to the user, only used in SKU resolution
● Item Summary: Used with multi-sku to show an item number/sku of the component defined in the steps above this one.
5.2.6 Reset to Default
When a step is set up as a parent dependency in the Manage Dependencies section this setting will define what happens when an option is chosen and children dependencies have specific options available or not available. If it is On, when an option is chosen all children steps will have their choice changed to the defined default choice. If Off, the children will stay the same unless the current option is no longer valid, in the case of an invalid option it will fall back to the default.
5.2.7 Filters & Sort By
5.2.7.1 Sort By Filters
Defines if sorting by filters for this step here are enabled. This will also turn on the sorting functionality in the front end step as needed.
5.2.7.2 Sort By Price
Defines if sorting by price for this step is enabled. This will turn on the front end sorting functionality as needed and show price as a choice.
5.2.7.3 Filters
Filters can be defined for the step. Each filter can have either the include in sort
by or use as group checked. Only one or none of these can be checked at a time.
Each filter has a name and display type defined for it.
● Dot: Display the option filters as radio “dot” buttons
● Checkbox: Display the option filters as checkboxes
● Tag: Display the option filters as text buttons
● Dropdown: Display the option filters as text buttons
Option Filter order is respected. This means if you setup your Option Filters in a specific order in your 3D Product Configurator, it will also display in the same order on the front-end application.
5.2.8 Camera
Camera angles in the 3D view can be set for a configurator for each step optionally. If values are defined in these fields then when a user selects an option in this step the camera will move to that orientation. Leave these fields blank to keep the camera from moving when a user selects an option in this step. A distance value that is larger than 0 must be defined for the camera step settings to be used on the front end.
5.2.9 Hotspots
One or more hotspots can be added to a step to highlight key information or components of a product. Click the Add New Hotspot button to create a new hotspot on a step.
● Hotspot Type and Hotspot Position defines if the hotspot is positioned relative to the world origin, local model origin, or relative to the bounds of the model.
● The Hotspot Plugin field is used to define custom data for custom hotspot plugins.
● Foreground Color defines the primary icon color and Background Color defines the secondary background color.
● Camera Options define what the camera will do when a user clicks the hotpot icon. If these values are not defined then the camera will not move.
● Modal Options define what text appears in the hotspot modal that opens when a user clicks the hotspot.
5.2.10 Help Content
Help text can be defined for the step which appears in the Help Me Decide modal. The help modal and the help tooltip can also be disabled or enabled. Enable Option Tooltips will control if a tooltip appears when hovering the mouse over individual options in this step.
5.2.11 Option Query
3D Product Configurator supports defining step options through a query against products in the 3D Cloud™ instead of manually defining them in the 3D Product Configurator UX.
If a step has no options defined then a user can define queries by category and/or Marxent Assembly Classifier (MAC).
Along with a query the 3D Component that these options change the material on needs to be selected.
Steps with option queries use the product data in the 3D Cloud™ database to setup filter values, SKU code, and price. Using options queries only works with material swapping on a 3D Component, not mesh product swapping.
5.2.12 Step Properties
Properties consisting of key value pairs can be defined for steps to be used with custom plugins and features in 3D Product Configurators.
5.3 Options
An option is one of the choices within a particular step that a user or dependency can choose from. Options are associated with the 3D components defined previously in this manual and the steps and options defined at any given point define what would be visible in the 3D viewer through linking 3D components to the options.
5.3.1 Option Label
The option label is the option name displayed in the configurator to the user.
5.3.2 SKU Component Code
The SKU component code is the part of the SKU that this option provides to the fully resolved SKU.
5.3.3 Price Difference
The price difference of the option. This value should be the actual price of this option that gets added to the base price.
5.3.4 Image Type
When a display type is selected as swatch for the step, then the image/swatch is defined here.
5.3.4.1 Split
3D Product Configurator supports a split swatch type that has an upper and lower defined image or color value. When this type is selected, 2 images, 2 colors, or a combination of the 2 can be defined.
5.3.4.2 Hex code
Selecting Hexcode allows for a color to be defined by a hex code value: https://www.w3schools.com/colors/colors_hexadecimal.asp
5.3.4.3 Image
Selecting the image type allows a single image to be uploaded or defined by a url link.
5.3.5 3D Render Components
When an option is swapped, one or more 3D components can be changed, swapped, or removed. These changes are defined in the render components list. The choices are pulled from the components defined in the component manager. Please note that if a component has been defined and you now have a none option that would remove the 3d component you should define a none Product in 3D Cloud™ and apply it to the none option, do not just remove the component product.
5.3.6 Filters
When a step has filters defined, each option can have one or more filter tags defined for each step filter. These are defined by selecting Add Filter Tag and adding values to the filter in the text box. Multiple values can be added, comma delimited.
When the filter type defined in the step is Dot, add color data to the filter value to assign a correct color to the UI dot icon by appending “|<css color>” or “|multi” to your value.
5.3.7 Tooltip Content
For each option tooltip text can be defined to be displayed in the configurator when an option is hovered over.
5.3.7.1 Tooltip Header
The tooltip header text.
5.3.7.2 Tooltip Body Text
The tooltip body text.
5.3.8 Help Content
These text values are not used.
5.3.8.1 Help Modal Entry Label
5.3.8.2 Help Modal Entry Subheader
5.3.8.3 Help Modal Entry Text 1
5.3.8.4 Help Modal Entry Text 2
5.3.9 - Properties
The option properties are label:value pairs that allow for different data to be defined for use in the configurator front ends. To add a new property click the Add New Property button and enter the label and value entries.
Label: 'help-label'
Controls label that goes below option name in the help modal.
Label: 'help'
Bulleted text making up body of text for option. Can have more than one 'help' bullet point assigned to a single option in the help modal.
5.3.10 Import/Export from/to a spreadsheet
To export your current options to a spreadsheet click the Export Options button above the options in an open configurator.
To import options from a spreadsheet click the Import Options button and pick a spreadsheet to import or drag and drop your file.
A confirmation preview modal will appear where a user can see the option data being imported and can import or cancel.
5.3.11 Step Groups
Step Groups allow users to group steps together. The dropdown menu also functions as an input field to create new Step Groups and select Existing Groups. Once a Step has been added to a group, the Step Group label will display above the Steps in that group.
In the example below, 2 Steps are in Step Group 1, and another Step is in Step Group 2, while a final Step is not in any Step Group at all.
5.4 Internalization and translation
3D Product Configurator supports translated text and pricing for configurator, step, and option fields that appear to the front end users. The easy to use interface built into the 3D Product Configurator CMS allows for configurator builds to define multiple languages and then apply translations for each language for each field. The 3D Product Configurator also supports bulk export and import via CSV files.
To open the languages modal click the button next to any field that supports translation:
To add a new language select the button at the top right of the languages modal. Languages are associated with the standard web language codes with regions. A user can also Import or Export CSV of the translations using the buttons.
6. Manage Dependencies
Managing Dependencies in 3D Product Configurator is for building the tree of dependencies between steps and options. Building a dependency tree is required for a configurator to work.
The tree is built left to right and top to bottom. The top most steps appear first in the order in the front end configurator. If the steps in a configurator do not depend on other step choices then all steps can live in the 2nd from left column and no further dependencies are needed to define the configurator. When choices made in a step affect which steps or options within another step are available then children dependencies need to be defined.
6.1 Defining Dependency Tree
The dependency manager operates off a drag and drop interface. The list of steps on the far left are the steps defined in the configuration builder. A user can click and drag these steps into the area to the right and drop them to add steps to the configurator. Each level of the dependency tree is another column going to the right. The step/option selected in the column to the left defines which parent a step dropped to the right will have. The selected step/option is a bright green. When going down levels in the tree you will see each level selected. If a step is not in the dependency tree it will not be used in the configurator you are building. For a particular branch only one instance of a step can exist.
6.2 Steps and Step Order
Step order can be arranged by dragging steps by the arrow icons:
Arrows can be moved up and down within a column. Steps that live as children will be ordered below their parent step but above any steps below their parent at the parents level.
6.3 Options
6.3.1 Defaults
Choose which option in a step is the default by clicking the circle icon causing it to be checked.
6.3.2 Visibility
There are 3 states of visibility you can choose for each option on a step.
Visible:
Hidden:
Visible but not pickable:
All three options can be toggled in bulk using the icon on the Step.
6.3.3 Order
The option order for a step can be set by dragging the options up and down. You can customize the option order for each instance a step appears in the branches of the dependency tree.
6.3.4 Option Query
When a step’s options are not defined manually in the 3D Product Configurator but are defined by a query against the 3D Cloud™ database you can define the default product id and an exclusion query in the step for a particular branch. This allows you to define specific limited choices by a particular branch in the dependency tree.
6.3.5 Dependent Children
When building a dependency tree branch you build children off of options. Each option on a step creates a new branch. To add a child to an option, select the option (green color) by clicking on the option, then drag the step you want to child from the far left step menu to the area just right of the option.
The 3D Product Configurator includes a preview modal of your configurator based on the currently defined data (latest version). To access the preview click the Update Preview button in the taskbar of the configurator builder. This will open a modal screen that will display the configurator currently defined.
Click the X button to close the preview
7. Configuration Preview
The 3D Product Configurator includes a preview modal of your configurator based on the currently defined data (latest version). To access the preview click the Update Preview button in the taskbar of the configurator builder. This will open a modal screen that will display the configurator currently defined. Click the X button to close the preview.
7.1 Setting Preview Size
Choose Small, Medium, or Large to change the preview modal size.
7.2 Applying camera settings as defaults
In the live preview a user can apply the current camera values to the defaults for the configurator or to the currently open step. Once the user clicks one of the buttons the values will be updated in the 3D Product Configurator configuration.
8. Generating Renders
When enabled, the 3D Product Configurator can be used to generate HD renders of the product. To access the HD Render generation, click the Generate Renders button in the taskbar of the configurator builder. Click on View Config to return to the configurator.
8.1.1 Render Options
A user can apply render options by choosing the Resolution of the render, adjusting exposure and brightness under Color Management, selecting Contrast Profile and lighting brightness under Environment.
Toggle Render Product Shadow to turn off shadows visible at the bottom of the product to better show products like wall art that would not be on a floor.
A user can choose your output resolution from 1k Proof, 2k, and 4k images.
The advanced options are hidden by default and can be accessed by clicking the chevron on the far right. Advanced options give more precise control over image exposure, brightness, and contrast. The scene light color and brightness can also be changed.
Selecting the Bulk Spin Render button will allow for passing in a list of SKUs to render the 33 spin angles in bulk for. The system will check each SKU against what can be generated in this configurator and render images for valid SKUs.
Selecting the Generate Render button will request a single render from the current camera position and angle in the configurator view on the right.
9. 3D Product Configurator Inspection Tool
The 3D Product Configurator Inspection Tool allows for assigned QA people to test a configurator in a view as close to the live site as possible while passing or failing each step and option. The assigned configurator builder can see the QA states and address each or fail specific geometry or materials to the 3D artists via the tool. A configurator will appear in the tool if it has been published to Test. The 3D Product Configurator Inspector role is needed for QAing configurators in the tool and can be requested from Marxent support/Account teams.
To open the tool go to the QA menu and select the 3D Product Configurator Inspection tool from the menu list.
To select a configurator, click its name in the left side menu. To find a specific configurator you can use the search and filter tools at the top of the left side menu.
Users with the QA role can open a configurator and review each step and option, passing or failing the item via the menu on the right side of the screen. Items can be filtered by status via the drop down menu at the top of the right side menu. Interacting with the configurator on the left will automatically update the items on the right based on the current available steps and options. Progress can be saved via the Save button in the top right corner and the review can be submitted once complete to the builder of the configurator via the Submit button. This will move the Configurator from QA to PENDING in the default list.
Users with the builder role can review PENDING items submitted and either fix those items and send them back for review or fail the product back to the artists. The user can still filter by status using the drop down menu and save or submit to NEEDS REVIEWED.
If the user fails the product, a modal will open up allowing for selection of the specific part of the product to be chosen and along with notes failed back to the artist for remediation.
10. Marxent Assembly to Configurator Tool
The 3D Cloud™ assembly data structures are used frequently with products in room planners and other 3D Cloud™ applications. To simplify moving those products into configurators the assembly to configurator tool allows for quick conversion of simple 1 level assemblies into configurators. To convert a product with an assembly structure click the Create Configurators from Products button in the file/folder browser of 3D Product Configurator.