Meterboxesdirect.co.uk New Magento Theme
The Brief:
Meterboxesdirect.co.uk (from here on I’ll refer to it as MBD, to save my little fingers from all that typing) is one of Tricel’s key eCommerce products. As the name suggests, it sells UK users a full range of gas and electric meter boxes and accessories. The site had the same Magento theme for several years (with extra menus and ad hoc design items added by different designers and developers over time) so badly needed a UX design audit!
The Target Audience:
Current MBD users are a 50:50 ratio of professionals and D.I.Y.ers. Interestingly, the split in device usage is also 50:50 desktop to mobile, so any theme chosen had to be responsive to suit all user needs.
My Role:
My colleague Shauna (marketing executive for the brand) carried out all the UX research (putting her newly acquired UX Research dip skills to work), allowing me to focus on the UX design elements. Working remotely on our first project together, we formed a solid team and I think the end results speak for themselves!
Key Challenges/Constraints:
Budget, Time & Platform! As the eCommerce store functionality was provided by the Magento platform, any theme we picked had to integrate seamlessly with their requirements, so this meant Magneto-friendly themes only! Using a paid responsive theme, rather than ideating and building from scratch, also allowed the process to be budget and time efficient.
Research Study Details
User research:
As mentioned above, Shauna led all the user research - she combed through the site analytics to give us a snapshot of the site’s health, conducted hotjar real user analysis to observe how our current users navigated the site and sent user surveys and compiled a competitor audit to see if they have features that we lack.
From her research it was clear that our users were confused as to how to navigate the homepage (a key factor here was the duplication of navigation menus), they couldn’t easily search and were frustrated, which explained the high bounce rate we were noticing on our analytics. The goal for the new theme was clear - an easy and quick UX experience.
Theme Design Audit
Design Audit:
Shauna and I agreed on features we deemed important and rated five shortlisted Magento-compatible themes against this. The theme chosen allowed us to create a simple homepage user navigation, with a prominent search bar. I reverted back to the original MBD branding colour palette of Light Grey, White and an accent pop of Red, allowing the site to appear visually lighter.
Creation of XD Guide:
In order to hand over to our web developer for implementation, I needed to guide him on how we wanted to match the theme to our MBD content. In XD I created the homepage and product page within the theme parameters. Armed with these, our developer was able to turn on the new theme within a week!
Conclusion:
Now, for the important bit…was it a success? AB-SO-LUTELY! We managed to cut that bounce rate down significantly and achieved record levels of transactions, beating our yearly sales target.
