Forma is a software suite that helps 3d specialist in the automotive and manufacturing industries to turn complex 3D product data into interactive configurators and more. Users make product variations, create interactive cameras, visualize designs, and export results in a non-coding required interface. Forma launched in December 2020, trusted by industry leaders such as Volkswagen and Airbus.

1. 0-1 Product Design: Founding designer, owned the end-to-end design of Forma, scaling it from a concept into multi-platform 3D authoring ecosystem

2. Strategic Discovery & Product-Market Fit: Conducted foundational user studies that led to breakthrough findings, directly resulting in the acquisition of the vertical's key early adopters.

3. Operational Leadership: Served as the design key person of the entire business vertical, established the vertical's data-driven design culture, implementing frameworks for testing and iterative development.

1. Holiday Calls: I was hired right before the holiday season, instead of expecting more context from the team, I used my own connections and set up interviews with industry experts from Nio and Honda Motor in East Asia.

2. Onsite Study: Fought for resource to do international onsite-studies and brought back user reports and partnerships.

3. SME Interviews: Ran 50+ rounds of interviews and established a format that devs, sales or anyone on the team are invited so the team grew together and make better autonomous calls.

In the Sales Configurator development stage, auto brands rely heavily on expensive manual agency works or slow in-house development for difficult-to-maintain solutions due to the absence of proper tools. High recursive cost result in companies searching for better solutions.

Instead of “growing X by Y percent” approach, the success metrics of the early stage is simple, as long as we onboard targeted industry leaders, it’s a win, which we completed the milestone soon after release.

Framing

Stakeholder Alignment

Design Ideation

Prototyping

Production

Working With Design System

Unity’s design framework handles packed UIs well, but the clutter clashed with Forma’s need for an inviting interface. I collaborated with the Editor team to reuse existing components and shared our custom assets back into the design system, expanding access for other teams across Unity.

Create product variations in seconds

Now Alyx could create product variations simply by dragging elements from the product outline, materials, or the object in the scene and dropping them to the variant table, there’s no need to code a single line to create product variation.

WYSIWYG, saving 73% communication overhead

In Forma, what you see is what you get, now teams could visualize and collaborate on the exact scene instead of talking through wireframes or long documents, saving hundred hours of communication costs across different department.

Single-source of truth model management

Now Eli could say no to disposable solutions. Scaling for multiple platform is easy, he could tailor rendering methods, models, environment, and material for target platform all in one place. Saving companies millions on recursive spending, a true budget saver. 

An easy entry to virtual photography

Now Alyx could curate configurator viewing experience and find the best angles to showcase product with our powerful camera system. We Provided an extendable interface letting Alyx to add on more features according current tasks. 

Iterate compositions on the fly

It’s 20 times faster to create compositions in RT3D, Alyx could reuse environment and fine tune look and feel to create a consistent brand identity across scene.

True-to-sales rules is a few clicks away

Creating rules true to sales is easier than ever, Eli can simply import from code or use our simple UI to expose the right product variation all by himself. No need for compare thousands line of rule code and excel sheets on two monitors and sending screenshots and emails back and force with the engineers. 

An innovation of workflow.

Forma saves hundreds hours in each step of the workflow. Users can create an immersive experience and export them into multi-channels all in RT3D with no code required. It is true workflow innovation that help small retailers to big companies making their transition into 3D content creation.

From months to hours

Before Forma exist, it requires a teams of 3d artists and engineers months to create configurators. Now, Forma does all the heavy lifting, making a configurator is only a matter of hours.

Volkswagen ends up being one of the first batches of early adopters of Unity Forma alongside various industry leaders including Luxottica (The monopoly of the global eyeglasses industry), Airbus, and more

Earlier Runtime UI isn’t mobile friendly enough

In the beginning, we were only targeting desktop users. Through user studies, we found there’s strong demand to build configurators for mobile devices.

Challenge: Expanding use case in the last minute

With limited engineering power, we need a generic runtime UI that scales for a wide range of screen sizes. 

Warning: We are neither building a responsive UI nor an adaptive UI here! Neither UGUI nor UI Element provides an easy way to create responsive UI that is so common in the web/mobile world. There’s no column systems, media query, sorts of things that make engineering responsive layout easy. Therefore, to maximize the outcome with the least time, we are creating a generic UI that detects device orientation and will work from a large TV screen to a small i-phone SE screen. 

What I did first is to analyze the configurator, identify finite and indefinite elements so we know how to create a layout that consumes and displays data well. For finite elements like logo and product name, there’s always one of each in a configurator, therefore, a fixed container would work well. On the other hand, for an indefinite list like product variants which users could make as many as the PC could handle, we need to define a container with a scrollable area.

Then I moved on to wireframe the basic structural interactions. The reason I used a layout where the scene is on top and the control sheet at the bottom is based on my research on multiple automotive game UI and configurators, this layout is optimal for car presentations.

Explore scalable solution in a tight timeline

Next step, I created mockups for both landscape and portrait views.

After discussion with the PM, we think our template should serve more products besides cars, therefore, I decided to use a more squared ratio scene. Also, I iterated on several different layouts to get to a UI that needs the least conditions in code but still works well for any sort of product.

Understand engineering to create efficient designs that balanced flexibility and usability

Below is the final layout, the difference between portrait and landscape is minimized:

• The control sheet is always vertical

• Using same navbar and header

• Using a card list so the behavior difference only lies in the scrolling direction.

• Price tag always centered at the bottom of the scene

• UI toggle always stays on the top-right

I tested out the design on multiple screen-sized as follows. with the same pixels (under the premise all UI runs on default system, scaling factors) The UI works fine from small smartphone screens to desktops. To run beyond a 4K screen, in the engineering end just need to specify multiplication by 2 for the UI.

Building empathy as a team

Building products for specialized experts is difficult. Early on, we noticed the team was making technical decisions that didn't quite fit our users' needs because they lacked the right context. To fix this, I started weekly product reviews with everyone from engineering to business. We walked through workflows and shared research findings together. This changed how our developers worked—they began actively evaluating if their code actually solved the user’s problem. Because the whole team understood the 'why' behind every feature, they became faster and were able to make smart decisions on their own.