Configurator upsell: accessories shown on the product

On a typical product page, accessories sit in a row of small cards under the description, headed something like "You may also like". A shopper who scrolls that far has usually decided on the main product already, and each accessory card shows the item on its own, with nothing to show how it fits.

In a configurator the accessory comes up while the shopper is still building the product, and it appears on it. A rack is offered while the shopper is choosing the bike, and picking it puts the rack on the bike on screen. Apart from fewer returns, that's the main commercial case for a configurator. The glossary entry on the 3D product configurator covers how options are tied to a price.

Upgrades, fitted accessories and consumables

Teams building their first configurator often want the whole accessory catalogue in it. An item that can't be seen on the product gets nothing from being in a 3D tool and makes the option list longer, so cleaning kits and warranties are better offered in the cart.

The cargo bike configurator

We built a configurator for Livelo, who sell cargo bikes. Buying one involves a chain of decisions: frame and colour first, then a box or a flatbed, then a rain cover, child seats and lights, and a battery size that depends on how much weight you'll carry.

Choosing the box puts a box on the bike. The rain cover goes over the box, and adding children puts two seats inside it, so by the time the shopper gets to lights and battery they're looking at a bike that already carries most of what they picked.

Sofas are built up the same way. On our own configurator page a sofa's modules and fabrics are chosen like the bike's parts, and the full sofa configurator is among the demos. A separate piece covers what a furniture configurator needs before it goes on a product page. If you'd like to see your own accessories fitted, send us the product in your range with the longest options list.

Design rules for selling add-ons

Put the price change next to the option. When the total only appears at the end, shoppers tend to hold back on every click. With a running total that goes up as they add the cargo box, they can see what each part costs while they're trying options out.

Group the options by the part they attach to, so the rain cover is offered next to the box and not in a separate accessories tab.

Add a rack to the configurator once it's modelled to the same standard as the bike. A poorly modelled add-on puts people off buying it.

In the cart, write the configuration out in words, such as "Cargo bike, sand, long box, rain cover, two child seats", so the customer can read it back and spot a mistake before paying.

Common mistakes

Open the configurator on a popular specification, with everything that's included visible and easy to change. Forty options with nothing chosen leaves the shopper with nowhere to start. Some brands go the other way and open it fully loaded so the first price looks high, and experienced shoppers spot that and start removing things.

If a shopper can choose a box and a child seat that don't fit together, somebody ends up phoning them about the order. Production knows which parts go together, so they should write the compatibility rules the configurator uses.

Load time on phones matters as well. A configurator that takes eight seconds to load on mobile data loses people before they see an option. Model weight, texture size and whether optional parts load only when they're chosen decide how fast it opens.

Pricing for configurators

Configurators usually go on the Value tier of our pricing, because a base product with parts that attach to it is more work than one static model.

Sources

• Shopify, merchant data on 3D and AR content, September 2020.
• Shopify, 3D e-commerce and AR shopping.