Smart Sweets is a beloved and innovative Vancouver company that’s made it their mission to #KickSugar and keep candy. With a dynamic brand and rapid growth, it seemed like this success story was a happily ever after. But when it came to their online experience, the website was dishing up a lot of issues for customers when it came to interactivity and the sales process.
- User Experience Design
Even though the Mellengerms don't consider themselves Shopify experts, our senior developers love to solve problems, and have had great success improving product and code quality on Shopify sites. When Smart Sweets needed our help to put out the fires that were causing their users frustration, we ended up refactoring the site code and redesigning the UX to create a browsing and shopping experience that was seamless, efficient and fun.
Start on the same page
We aim to establish an open relationship and consistent communication with all of our clients, but there was added incentive with this project. While Smart Sweets needed our UX expertise, we would be working closely with their established brand and in-house design team to “skin” our site structure or tools. We came together to talk through goals, ideas and solutions and create one cohesive team upfront. While most dev shops want to own the whole process, we’ll fit in where you want us and build the team around your needs.
Redesign to refine
We needed to maintain Smart Sweets’ vibrance and playful interactivity but elevate their web experience to a premium level. Resolving user issues with simple but effective fixes would refine the brand’s digital space. There used to be a lot happening on the home page, but we led with one hero image above promotional spaces and product teasers to create a cleaner experience. The new home page design was also more flexible for messaging, making it easier for our client to update content themselves.
We created consistent headers for all content pages, and worked with the Smart Sweets designer to develop a consistent type hierarchy that would be incorporated into the brand guide. On the product page, many items were hidden below the fold, so we moved them up to give users an immediate overview of the range without scrolling up and down. Most users also didn’t understand that the prices they saw online were for multiple items (only 6 or 12-packs were available on the site), so we removed that confusion with clearer call-outs.
Kick scrolling, keep playing
The biggest change was to Build a Box, the interactive subscription pack. It had an engaging, animated element where users could see the box open and fill up with the products they added. However, a lot of the interactivity was happening below the screen frame. Users had to scroll up and down to see it, which ruined the experience. We brought everything above the fold, maintaining the fun while making it seamless. Customers loved it, and the brand got great feedback on the update.
Level up on e-commerce
Smart Sweets’ shopping experience needed to reflect how big-time they had become, as well as set the brand up for expansion. We changed the main menu to a “mega menu”, a larger drop-down box that was aligned with bigger e-commerce sites and wider product ranges. We also worked within Shopify’s limitations to improve the cart experience. Before, there was no cart icon for easy checkout navigation or prompt to confirm that you had added an item. We added an icon that highlighted whether items were in the basket, and a cart fly-out that showed users which item/s they had added to their bag.
When we launched the new and improved site, online sales smashed all expectations. Launch day saw a more than 2000% increase from average daily sales prior to launch, and sales have stayed at a minimum of double their previous normal every day since. Most remarkably, this was in April 2020 at the height of the COVID-19 pandemic! We remain close to Smart Sweets as their technical support, handling the site updates for new products or promotions as they roll out one delicious treat after another.