Product configurators are interactive UIs that allow a brand’s customers to personalize certain aspects of a product to fit their tastes and preferences. No matter whether they’re the only path to purchase or one of many possible options, configurators offer several advantages:

* Consumers often perceive customized products as more luxurious than their mass-produced alternatives, which can help reduce price sensitivity.
* Brands can use configurators to upsell customers on premium options they would not otherwise consider, potentially boosting average order value (AOV).
* Configurators are also the perfect place for cross-selling through accessories and other complementary products, increasing average basket size (ABS).

Over the years, product configurators have evolved dramatically, thanks in no small part to technologies such as 3D, AR, and VR. They are particularly popular in the fashion, furniture, electronics, and automotive industries, where total personalization and flexibility are key to an engaging customer experience.

However, total flexibility often leads to complexity, which creates a slew of UX challenges. To avoid alienating their customers, brands must manage this friction and ensure their configurator is intuitive, efficient, and enjoyable.

In this article, we’ll provide recommendations and guidelines for creating a product configurator that balances flexibility and usability, driving the results you’re looking for.

## 1. Create a Sense of Progression

Product configurators come in different shapes and sizes, but creating a sense of progression is vital for enhancing the user experience and ensuring consumers complete their purchase.

This can be accomplished by breaking down the configurator into manageable steps, giving users a sense of achievement as they complete each stage. The incremental progress keeps them motivated to continue through the entire flow and ensures you’re not overwhelming them with too much information.

<figure>
   <img src="https://cdn.sanity.io/images/kqgmf0g2/production/50b4ecf3d0b7d97a936816b3917c6bc10775eb89-1999x1130.png?fit=clip">
   <figcaption>To avoid confusion, the Framework Laptop configurator guides the user only shows the currently active step and clearly marks completed steps.</figcaption>
</figure>

## 2. Display an Accurate Product Preview

Each step of a configurator should provide users with instant feedback on their selections, ensuring that changes in options (such as color, material, or features) are immediately reflected in the product preview. This reassures customers about their decisions and creates a more engaging and enjoyable customization process.

Some brands display 3D models that users can rotate, zoom in on, and view from different angles, or they integrate AR to allow customers to visualize a product in a real-world environment.

<figure>
   <img src="https://cdn.sanity.io/images/kqgmf0g2/production/1b693df00472a9b77899af8bc7a6e26af036724e-1999x1223.png?fit=clip">
   <figcaption>For maximum engagement, Tylko allows customers to customize their product straight from the 3D rendering of their product.</figcaption>
</figure>

## 3. Calculate Up-to-Date Pricing and Shipping

In a product configurator, the price and shipping time estimate should be updated whenever the user changes their configuration.

This will help users make more informed decisions around which customizations fit their budget and delivery constraints, which in turn results in reduced friction and cart abandonment.

<figure>
   <img src="https://cdn.sanity.io/images/kqgmf0g2/production/167eaca2dcfac99b7d89cc97dc845fed77d83790-1999x1488.png?fit=clip">
   <figcaption>Cowboy clearly displays the impact of each addon on cost and shipping time, and shows alternative configurations with faster shipping.</figcaption>
</figure>

<figure>
   <img src="https://cdn.sanity.io/images/kqgmf0g2/production/1c8f23357fbb84311d4d8c93acaf0699ee7696f9-1999x1675.png?fit=clip">
   <figcaption>On mobile, a sticky header/footer can be used to keep pricing and delivery information front and center while the user interacts with the configurator.</figcaption>
</figure>

## 4. Offer Technical Explainers

Customers who are new to a brand may need additional information about specific features or options while customizing, especially in technical product categories where jargon abounds, or the functionality or benefits of particular options are not self-explanatory.

To avoid overwhelming the user with too much information at once, brands can use UI elements like tooltips or modals. These elements provide immediate, context-sensitive assistance right where the customer needs it through text, videos, and tutorials.

<figure>
   <img src="https://cdn.sanity.io/images/kqgmf0g2/production/12648a14f561a220330d221a7a71adf171751430-1999x1546.png?fit=clip">
   <figcaption>Herman Miller includes a help icon at almost every step of their configurator. When clicked, it opens a modal containing information about specific options.</figcaption>
</figure>

## 5. Provide Real-Time Validation

While clear instructions can dramatically reduce the likelihood of a user error, it’s still common for users to encounter issues while using a configurator, such as selecting incompatible options or trying to place their order without completing all the necessary steps. If not properly handled, these errors can lead to frustration and result in the user abandoning the configuration experience.

Providing visual, real-time validation as users make selections can help them easily navigate the customization process. Use clear indicators, such as red outlines and error messages, to highlight invalid choices and guide users toward valid options.

<figure>
   <img src="https://cdn.sanity.io/images/kqgmf0g2/production/75355ef1bf806c09c9be9c529067f5cdc62612d4-1999x1180.png?fit=clip">
   <figcaption>In Framework’s configurator, we highlight missed steps in red, guiding users to provide the necessary information to complete their configuration.</figcaption>
</figure>

## Product Configurators Are Never Really Done

While these best practices lay the foundation for a successful and engaging configurator, you should still periodically review and improve your configurator's UX by:

* Conducting regular surveys, questionnaires, and interviews to gather  feedback from your users about their experience with the configurator.
* Running usability testing sessions where users interact with the configurator and provide real-time feedback.
* Using analytics tools to monitor user behavior and identify patterns, such as frequently encountered issues or abandoned steps.
* Adopting an iterative design process where the configurator is continuously refined through cycles of feedback, prototyping, testing, and implementation.

At Nebulab, we’ve helped our clients build, launch, and optimize product configurators in industries where the ability to create a bespoke product is a significant competitive advantage. If you’re curious, you can learn more about our work for Framework in [our case study.](https://nebulab.com/case-studies/framework)

If you need help designing and building a new product configurator from scratch or improving your existing setup, [don’t hesitate to reach out!](https://nebulab.com/contact-us)

How To Design the Perfect E-Commerce Product Configurator

With 9 out of 10 online shoppers stating that they want retailers to offer recommendations based on their interests, and
considering the vast amount of data and technology brands now have, there are few excuses not to have a personalization
strategy in place. eCommerce personalization is proven to increase conversion rates, customer retention, and lifetime
value, creating a virtuous cycle that can turn your visitors into loyal customers.

And yet, we often see brands struggle with rolling out an effective eCommerce personalization strategy: founders aren’t
sure how to segment their customers, evaluate the effectiveness of their personalization program, or what technologies
to adopt.

This article will demystify eCommerce personalization, providing you with a straightforward, data-informed approach for
designing, implementing, and validating your personalization program.

## What Is eCommerce Personalization?

Much confusion stems from the vagueness of the term “personalization.” If you Google it, you’ll find books, articles,
and SaaS products that all give it a different meaning: they talk about A/B testing, machine learning algorithms,
retargeting, user-generated content… It can be hard to understand where to start.

At its core, eCommerce personalization is the technique of using the information you have about your customers to
display content that is tailored to them. You can personalize across different dimensions (e.g., personalize by country,
browsing history, demographics), at different touchpoints (e.g., your website, your email campaigns, your ads), and with
different techniques (e.g., machine learning, user-generated content, human curation). No matter *how* you personalize,
the goal is to create a customer experience that feels unique.

## Designing Experiments with GTDT

When we coach founders that want to start experimenting with personalized eCommerce, we encourage them to think of
personalization as the means, not the end. Like all initiatives, personalized shopping experiences must be designed
thoughtfully and intentionally for maximum effectiveness. Adopting a tool or installing a plugin will only take you so
far if you don’t have a clear understanding of what you want to achieve with your personalization program.

Unfortunately, most resources offer an endless list of personalization examples from famous online retailers but no
indication of *why* or *how* those brands designed their personalization programs. This leaves operators scratching
their heads as they try to replicate the success of these brands. As a result, they tend to go for “blanket solutions”
that are easy to implement but ultimately leave the most exciting opportunities on the table.

Over time, we have developed a model that helps brands roll out thoughtful personalization experiments that get them
closer to their goals. **We call it GTDT, which stands for Goal, Technique, Dimension, and Touchpoint.** In the
following paragraphs, we will explain this process, providing you with all the tools you need to design your
personalization program.

### Goal

This might seem obvious, but surprisingly often, online stores will launch personalization capabilities to tick off a
checkbox with no clear goal in mind. Unfortunately, this not only means they will roll out an ineffective
personalization program, but it also means they will not be able to validate the effectiveness of their program: if you
don’t know what metric you’re optimizing for, you will not know what metric to look at.

The first step for any good personalization experiment is to understand what goal you’re aiming for—everything else
follows. Depending on your brand’s SKU catalog and business model, a personalization experiment for increasing your
average order value will likely look much different from an experiment to improve your add-to-cart or repeat purchase
rates.

If you’re unsure what goals you should be prioritizing, talk to your team and pick the one that feels most urgent right
now. Where are you falling behind compared to the industry benchmarks and your (or your board’s) expectations? What are
your customers telling you in your interviews? (You ***are*** doing customer interviews, right?) What are your plans for
the next 12-18 months?

Don’t make the mistake of falling into analysis paralysis: the beauty of running experiments is that you can quickly
pivot if you find that you’re optimizing for the wrong things. Make a data-informed decision, launch your experiment and
move on!

### Technique

With eCommerce personalization rising in popularity, several tools have emerged that promise to offer the definitive
solution to all your personalization problems. A/B testing tools, content management systems, eCommerce platforms, UGC
aggregators… almost every tool provides some level of personalization nowadays.

Unfortunately, without a clear personalization plan, it’s easy to get carried away by shiny object syndrome and try
every tool in hopes that it will solve all your problems. Do this enough times, and you’ll end up with a Frankenstein
monster of solutions that don’t integrate and annoy your customers with endless popups and broken UIs.

Before picking a tool or technology, decide **how** you want to personalize. You should do this, first and foremost, by
continuously referring back to your experiment goal and dimensions, but you should also lean on your brand’s strengths
and values. If you’re a fitness brand that’s all about community, you might want to leverage the power of user-generated
content, at least in *some* of your experiments. If you’re a luxury brand selling elevated essentials, perhaps you can
offer human-curated recommendations to your customers.

This last example brings us to the next point: don’t be afraid to do things that don’t scale, especially in the early
stages of your company. Many brands go from zero to a hundred by integrating deep learning models that are complex to
tweak and customize, and they don’t realize that they’re missing out on many lower-hanging opportunities. You’d be
surprised by how much you can accomplish with some basic customer segmentation and a human touch.

### Dimension

Once you know what you’re aiming for and how you want to get there, it should be easier to understand which dimensions
you want to personalize across. For example, you might want to personalize content based on geography, customer lifetime
value, previous purchases, demographics, or other factors.

It might help to group personalization dimensions into three big buckets:

- **Historical.** These are actions your customer has taken before. For instance, you might segment customers based on
  their AOV or purchase history.
- **Demographical.** These are traits that will always be true about your customer. For instance, you might segment
  customers based on geography, gender, or age.
- **Contextual.** These are actions your customer is taking now. For instance, you might segment customers based on
  their cart contents or session length.

When thinking about dimensions, don’t get limited by data availability: just because you don’t know your customers’ age,
it doesn’t mean you shouldn’t use it in a personalization experiment. Part of your personalization program should be
designing ways to collect or infer the information you need to carry out your experiments, which has the added benefit
of enriching your understanding of your customers over time.

You also don’t want to limit yourself to generic customer data: we find that the most successful personalization
programs use proprietary brand data to create win-win outcomes. If you sell pet food subscriptions, you might want to
curate your product catalog based on the customer’s pet type or age. If you sell sports equipment, you could send your
customers content specific to their favorite sports. Think about the different ways customers engage with your brand,
and try to design your experiments to optimize and improve those interactions.

### Touchpoint

With your goal, dimension and technique nailed down, it’s time to pick a personalization touchpoint. With this term,
we’re referring to the specific customer interaction you want to personalize. This will likely depend on your goal and
dimension: for example, if you want to increase AOV (goal) by looking at cart contents (dimension) to suggest upsells
(technique), you can only do this after the customer has added something to their cart or completed their purchase.

When deciding which touchpoint to personalize, we encourage brands to look beyond their product pages or on-site user
experience. Even with the average brand, there are so many ways your customers might interact with you and so many
opportunities to personalize those interactions. The most effective personalization programs are omnichannel and focus
on often-neglected interactions, such as transactional notifications, or create entirely new touchpoints, such as
sending customers a personalized card for their birthday.

Again, don’t get limited by your current touchpoints: if you want to send personalized email campaigns but are currently
not doing any email marketing, don’t be afraid to start now. If you think push notifications might resonate with your
customer base, why not give them a try?

The goal is to catch your customers when they need personalization even though they don’t know it, and leverage the
power of data to turn a mundane interaction into an intimate, personalized experience.

## Measuring Experiment Effectiveness

Designing and launching your experiment is only the first step. For an effective personalization program, you want to
validate the effectiveness of your experiment, double down on the ones that work, and kill the ones that don’t.

To do this, you must go into every experiment with a clear definition of success. This means answering the following
questions:

- What metric(s) do you expect the experiment to move, and in what ways?
- Are you already measuring the metrics you need? If not, how can you measure them? Do you need time to get a baseline
  for comparison?
- For how long will you let the experiment run after measuring the results?

### A/B Testing vs. Attribution Models

A special mention here goes to A/B testing: like with AI/ML, inexperienced founders often jump into A/B testing without
a clear understanding of the technique. While it’s tempting to run all personalization experiments as A/B tests,
sometimes this can be overkill or even detrimental: A/B tests require specific expertise, dedicated infrastructure, and
relatively high traffic volumes to reach statistical significance.

Typically, we only recommend A/B testing for large brands, running experiments where the results are highly uncertain,
and a clear control group can be established (e.g., customers that see the regular homepage vs. customers that see the
personalized homepage). In all other scenarios, a robust attribution model is a more reliable way to measure the
effectiveness of your experiment—even better when it’s paired with qualitative customer insights.

### Following Through on Experiment Validation

However you decide to validate your experiment, make sure it’s easy to roll back if needed and remember to look at the
data and take action accordingly! A recurring “experiment review” meeting with your team, where you review all
experiments that need to be validated and decide how to move forward, can do wonders to keep you accountable.

Finally, don’t be too rigid: if you expected a cross-selling experiment to drive $100K in revenue, but it only drove
$80K, it might still be worth keeping, depending on the effort you need to turn it into a permanent, first-class
capability. For some experiments, it might be helpful to establish different thresholds of success. Going back to our
example:

- Anything below $50K might be a clear failure.
- Anything between $50K and $100K might be up for discussion.
- Anything above $100K in incremental revenue might be a clear success.

Generally speaking, whenever you make decisions about your digital experience, you want to be data-informed, not
data-driven.

## Ready to Start Personalizing?

eCommerce personalization can create remarkable outcomes: when leveraged intentionally, personalization programs
increase revenue, customer loyalty, conversion rates, and lifetime value. It’s a tool that should be part of every
eCommerce store’s marketing strategy.

With the GDTD model, you have a streamlined process to design, launch and validate your personalization experiments.
It’s a high-impact tool that evolves with your brand as you scale, better understand your customers, and develop more
sophisticated ways to engage them.

If you have questions or need help with your brand’s personalization program,
[we’d love to hear from you.](https://nebulab.com/contact-us) Let’s start personalizing!

The Nebulab

How To Design the Perfect E-Commerce Product Configurator

The GTDT Model for Intentional eCommerce Personalization