Threekit Product Visualization Workflows
The Threekit Platform has been designed to enable a variety of product visualization workflows.
The Threekit Platform platform has been optimized to make these workflows efficient. As a result, many of these workflows have overlapping characteristics.
The following article covers the common setup of all visualization workflows, followed by specific workflows used to get the most popular outputs from the Threekit platform.
There is a common setup and data model across all workflows. At a high level, the objective is to virtualize products into the Threekit system. We need to virtualize both product data, including options, as well as visual appearance.
The first step to any visualization workflow is getting product data, including options, into the Threekit Catalog. The best solution leverages your existing data as much as possible. There are a variety of ways this can be accomplished: importing data, from spreadsheets or a JSON file, or by connecting it to your eCommerce or ERP system.
Please consult documentation on Importing and the Product Import API for further details. The Threekit team is also available to aid in this process.
Import 3D assets of your product’s models, and materials into the Threekit Asset Library. Similar to populating the product logical model, there are a variety of ways this can be done. The best solution leverages your existing data as much as possible.
This can be done via importing existing 3D assets in a compatible format (e.g. V-Ray scenes, FBX, OBJ, glTF, or USDZ), importing CAD data and touching it up (e.g. STEP or IGES), or engaging the capabilities of a 3D art team (Threekit can help here) to create your products in 3D from your available source materials (e.g. CAD designs, photographs, physical samples).
Map from Logical Model to 3D Assets
The 3D assets need to be associated with the products and options they are representing. Thus, one needs to map product data to the 3D assets. This informs the system how each product is to be realized in 3D. This is often done by the 3D art team responsible for populating the 3D Asset Library.
One Model and Material to Rule them All
The Threekit solution is designed for user efficiency, requiring only a single version of the 3D assets, both models and materials, for the large variety of possible outputs.
In order to simplify the display of your products on your website, if you are eventually looking to display them on your website, it is necessary to make our system aware of your ecommerce system and its product data. Once this connection has been created, it enables our system to automatically know which product to display on any ecommerce web page without any additional work on your side. This integration is independent of which of the types of visualization outputs you want to display -- that is separately configurable from the base connection.
The most popular type of product photography has white backgrounds, often referred to as silhouette shots, AKA “silos.” The Threekit Platform is regularly used to create these shots en masse.
When creating silos there are a couple of choices. They can be created either one at a time or in bulk. Most clients create them one at a time while doing tests to ensure the product is setup correctly, ensuring the lighting is great and the angle is flattering. Once that is confirmed, the silos are created in bulk across large swaths of the product line and available options.
Many of our users leverage our ability to create silhouettes en masse in order to present their customers with virtual photography-based visual configurators. These visual configurators allow for their customers to experiment with product options while seeing an update product view that reflects their choose options. For products with complex options, having a constantly updating accurate visual representation boosts customer confidence in your products and its suitability to their needs, thus increasing sales and reducing returns.
The creation of visual configurations proceeds similarly to the silhouettes. The main difference is that for a configurable product, it must have options available and they must have discrete values. You then create images of the products and all option combinations. This again creates an image set. You can review the image set for correctness and then make it live for the chosen product. In this case though you do not show a single image but rather you use our player capability to present the image set and its configuration options. As the user explores the options by changing its configuration, the image automatically updates.
We offer advanced virtual photography based visual configuration through the use of layered image sets as well. This is mostly used when a configuration is incredibly complex and rendering out individual images for each possible configuration is not tractable. When presented with these requirements, your art team can group together options and aspects of the 3D assets into layers. These layers then are rendered independently at lower complexity than the whole set of options. Our player will automatically pull multiple layers together and combine them on the client side in order to achieve a result which appears to be a single image but is much more efficient to create.
The second most popular style of product photography besides silhouettes is lifestyle shots. Lifestyle shots incorporate your product into a real-world context. For clothing this would likely be having a model wear your clothing in the context of doing an appropriate activity. If it is furniture, it would be an appropriately setup room, such a bedroom to showcase a dresser, or a living room to showcase a sofa. Lifestyle shots often incorporate more than a single product into a shot in order to encourage customers to purchase additional complimentary products.
The process of creating lifestyle shots is more involved than silhouettes because of the need to create an appropriate context. It is quite likely that you can not use one of our existing “stages” and instead the 3D art team (we can help you here if necessary) will have to create these for you. These stages can optionally have configuration properties on them, such as setting the wall color or the flooring. After this step, the rest of the process is identical to the silhouette process.
Interactive 3D refers to a product presentation within a webpage in which the customer can interact with the product in a meaningful way, such as spin it around or change options, which seeing a live update. These outputs utilize WebGL, a web technology, that enables high quality 3D graphics to be created within the webpage unique for each client. It leads to very fast, rich and engaging interactions.
Our product viewer will load a 3D asset and then allow the customer to move it around in 3D. This can be great for a customer to understand your product in great detail and allow them to get a sense of it that they could normally not get without actually physically touching your product.
Product viewing is very easy to set up. In fact each time you are on product page you are using the product viewer. We call this our player. Thus this works by default once your 3D assets are properly loaded into the platform and correctly associated with your products. This player can be automatically pulled into your ecommerce site via the previously mentioned ecommerce connector.
Interactive 3D Configuration
Interactive 3D configuration is similar to product viewing, but it includes the ability for the product to change its visual properties in response to option changes.
To enable interactive 3D configuration, you need only to have products with options on them along with their backing 3D assets. Then, by default, you will see an interactive product viewer on the product page along with its configuration. When you change this configuration your changes will be seen live.
Product tours educate customers by highlighting product features in an interactive engaging fashion. This differentiates your products from competitors by ensuring that customers know your differentiators and remember.
To create a product tour, you must create a configurable product but in this case, the option should be of the type “tour steps”. This then changes the mode of the player into one that has a series of named steps, basically stops along the product tour. Your art team then needs to set up in the 3D asset the points of interest, the annotations, and the camera settings that represent the stops on the tour. Once this is one, if you connect this product to your ecommerce site, then it will show a product tour.
Augmented reality is the ability to view your models in your surroundings, either on the floor in your room, a wall, or even on yourself (e.g. AR try on.)
In order to support native AR from web-based ecommerce sites without the need to install mobile apps, the Threekit platform creates glTF and USDZ files. The platform can create these assets on demand or one can request that the platform create all glTF and USDZ needed to represent your products as a bulk process. After a glTF or USDZ file has been generated it is then cached for future re-use to enable faster client experiences as well as to be resource efficient.
Once a product has been fully setup and is visible in the product viewer, then it is possible to convert it to USDZ or glTF as described. On demand generation can be triggered via a customer clicking on the “AR” button in the product viewer. On-demand generation can take a few seconds. On-demand generation is best suited for situations where the number of realizable product combinations is huge and inefficient to exhaustive pre-generation in bulk. Bulk generation can be done via the same process as the creation of the virtual photography image sets. You still access AR files that were bulk-generated via the “AR” button in the player but this time they read from the cache rather than being on-demand generated. This leads to a faster experience when the possible product combinations are exhaustively enumerable.
It is also possible to access both the glTF and USDZ within your own customer AR native applications via our documented API.