It's not magic, it's just clever thinking

When shopping online and configuring products, you usually see the main image update - whether it’s the colour, size, or pattern. But there’s rarely a way to build a fully custom product while the images update dynamically

Now, take something fairly complex - like a bike with different frames, wheels, pedals, and handlebars. Presenting all of that in a way that’s clear, interactive, and actually useful for the customer? Not so easy

Until now…

We’ve been using Advanced Product Options (APO) from Mageworx for a while. It’s a really flexible module that lets merchants configure products in a much more detailed way, meaning customers get a better and more informed experience.

Put simply, it’s a solid bit of kit

After using this module on various merchants' websites, we thought...

• How can we go further and make this a fully interactive product builder?
• How do we handle image updates in a way that actually works?
• Could we also use this to upsell products naturally without forcing anything?

After a few hours of thinking, we had a solid plan

Step 1 – Photoshop

We created a layered document where different components can be overlaid properly, so the user sees their product come together in real time.

Step 2 – APOs

We set up the product using Mageworks APO, making sure the UX was smooth while also allowing for relevant, non-intrusive upsells.

Step 3 – UX Improvements

We added some simple frontend code (literally just two small files) to bring everything together and make the experience seamless.

A fully interactive product builder where users can see their custom product update live as they configure it.

Check out the Miami Road Bike here!!

Your customers

Having a fully interactive "Custom Product Builder" is a great way to give them a proper representation of what they're buying

It gives you the opportunity to put products into perspective, whilst also giving them a better view of individual products

If we take this bike for example, it gives them absolute peace of mind that the mud guards will fit the bike, without them needing to go and find mud guards separately and figure out if it's compatible

You

Having these products is a great way to increase your AOV!

Giving your customers more options to pick and choose compatible products can lead to a much higher average order value.

It also improves UX...

We're not forcing the user to choose these options, we're simply giving them more options. This leaves the control in the users hands, which is an absolute MUST when it comes to UX