 "Harnessing The Power Of Custom Product Builders")
Harnessing the power of custom product builders.
Fancy letting your customers build their own products? Do you think it's too complicated to achieve on Shopify Plus?
In this post, we explore how brands can customise Shopify to create custom product builders that enable them to create one product with different configurations of the individual elements that make up the final product, e.g. size, colours, and materials. Those unfamiliar with the power and flexibility of Shopify mistakenly believe that it’s not possible (or too complex) to deliver this type of builder on the platform, BUT we'll show you how it's done. Let’s get started!
What is a custom product builder?
A custom product builder (or bespoke product builder) enables you to create one product with different configurations of the individual elements that make up the final product, e.g. size, colours, and materials.
For example, with a custom product builder, you can:
create a desk or wardrobe to fit the dimensions of your home office or bedroom,
build a scooter that’s comfortable for your height for a more comfortable ride, or
make a BMX bike to suit your skill level and personal style with different parts in colours and sizes of your choice.
Those unfamiliar with the power and flexibility of Shopify mistakenly believe that it’s not possible (or too complex) to deliver this type of builder on the platform. They’re wrong, but more on that later!
The advantages of a custom product builder for Shopify.
With a custom builder, you have the added advantage of
selling customers the exact product they want, i.e. something tailored to their specific needs,
differentiating yourself from the competition, and
opening up new markets for your business and therefore driving growth.
Three fabulous custom product builders we created on Shopify.
1. Dogg Scooters: Custom Scooter Builder.
The challenge.
Dogg Scooters caters to a full spectrum of riders - from beginners to intermediate and advanced - with a quality range of scooters and parts from the most exclusive brands in the business. So, when upgrading its website to Shopify Plus, the brand wanted an interactive product builder so customers of every skill level could create their own custom scooter.
The solution.
Rising to the challenge, the blubolt team delivered a fun and fabulous custom scooter builder.
Constructed with React and utilising Shopify’s Storefront API, the builder enables customers to create a bespoke scooter that suits their needs. The parts available and the compatibility between them are fully customisable by the team at Dogg Scooters.
Before starting the build, customers can choose the scooter size (for example, small, tall or all riders) so the builder can show suitable parts and components.
From there, customers can select everything from bars and decks to forks and wheels. It also has a "randomise" function, which builds a scooter (tailored to your size) by randomly pairing suitable parts. Customers can then purchase that scooter design or use it as a starting point and make their own.
Once customers have confirmed the design, the builder supplies a handy summary to check over and an option to have their masterpieces built ready to ride (rather than self-assembly).
The result.
It’s only recently launched, but the new custom scooter builder has already received rave reviews from the brand and its customers! Dogg Scooters can now confidently promote their custom scooter service, safe in the knowledge that the custom builder is fast and user-friendly. Read more about the Dogg Scooters project.
2. The Dormy House: Modular Furniture Builder.
The challenge.
The Dormy House team wanted an elegant, high-performing Shopify Advanced site with a new modular furniture builder that worked flawlessly on both desktop and mobile.
The solution.
The blubolt team created the star of The Dormy House’s new Shopify Advanced site: the sleek, easy-to-use, and mobile-friendly modular furniture builder.
Designed and built with React, the builder enables customers to create storage furniture that’s personalised to them without the usual high price tag of bespoke furniture. With fifteen furniture options - everything from desks, drawers and cabinets to bookcases, wardrobes and kitchen larders - customers can simply measure their own space and select base and top units using the modular grid function.
From there, using the intuitive drag-and-drop functionality, customers can use the grid to create their ideal configuration before choosing paint colours and handles.
Behind the scenes, this modular builder delivers on a number of complex requirements, namely:
Dimensions. It has the ability to show accurate dimensions to the end user.
Store product layout. It can store the layout of the individual items selected to form the overall design as an image. This image then shows the Dormy House team how to build the customer’s custom design correctly.
Logic. It has the logic to ensure the correct amount of colours and handles were added to each unique "custom" build.
The result.
We asked Anna Trinder, Owner of The Dormy House, what she thought of the new website and the custom builder. “It’s fantastic to have a flexible, user-friendly site – for both us and our customers - that works seamlessly across all devices while showcasing our wonderful products. We’re most excited about the modular furniture builder that enables our customers to design the perfect piece from the very comfort of their home.”
Read more about The Dormy House project.
3. SourceBMX: Custom Bike Builder.
The challenge.
SourceBMX is 100% rider-owned and run, enabling them to deliver unparalleled advice and customer care to pro riders and novices alike.
To give the brand’s diverse range of riders an optimal experience, SourceBMX wanted to enable customers to design their own custom BMX bike from the ground up on the SourceBMX website.
The builder needed to work on all the brand’s international websites and perform seamlessly in terms of compatibility rules. Along with creating BMX bikes with the custom builder, Source BMX also wanted to utilise it for bespoke wheel builder functionality (now live).
The solution.
As SourceBMX joined blubolt with our bluprint for Success programme, the blubolt team inherited the brand’s existing theme created by another agency. As a result, blubolt adapted the existing theme and injected an app layer to allow adding and developing REACT functionality for key areas.
Taking the project’s complexity and making it look simple, the blubolt team created a fully customisable custom BMX bike builder. Using React, GraphQL and TypeScript, working together with Shopify's storefront API to retrieve the relevant data, the builder is also connected with Shopify's recent filter amends to allow filtering parts by colour size or brand.
On the user side, customers start by choosing the build mode, with the default being 'Complete build mode', where you start construction from scratch. If customers want to upgrade their current bike with some new parts, they can switch this mode off and colourise placeholder parts to resemble their own bike.
From there, customers choose all bike elements, from the frame, steering parts and seating to the drive train (whether you are a left-hand or right-hand driver), brakes and grinding. In a move that elevates the experience further, the builder allows costumes even to create custom wheel designs (or opt for something pre-built).
To enhance the user experience further, blubolt completed further development to allow customers to share their builds to third-party systems (Facebook, Twitter etc.) as well as save them in "Your Workshop" so the customer can return to their own design at a later date.
In addition, blubolt built an app to store the data from custom bike and wheel builds and to enable the functionality to flatten imagery into a format so that it can be shared on these third-party platforms.
The result.
“The Custom Bike builder developed alongside blubolt has been a game changer in how customers interact with our website and brand. Before the bike builder, it was an arduous task to create your dream bike from the ground up; individually checking stock levels and compatibility between 20+ components was time-consuming,” says Marc Moore, Owner at SourceBMX. “Now the bike builder makes the whole process quick, fun and engaging, so much so that it has become the most popular section on our website.”
Read more about the SourceBMX project.
Custom build your way to success on Shopify.
From bespoke scooters to furniture to bikes and wheels, in this post, we’ve shown you the enormous potential of custom product builders on Shopify when you’re working with an experienced and expert Shopify agency.
Fancy a chat about custom builders for your eCommerce store?
We're a Shopify Plus agency that designs, builds & optimises beautiful bespoke eCommerce solutions to help your brand grow faster. Explore our expert Shopify services and browse our client work for Shopify inspiration. Alternatively, get in touch to discuss your requirements. We would love to help!
