Case Study

Covers Timber Merchants

UCD • Branding

An overview

Covers are a successful builders merchant originally based in Hampshire. They have a well established offline brand and heritage, along with an extensive product range and multiple retail warehouses across the country, supplying building materials to a vast, loyal customer base. When the time came to translate that experience to eCommerce, I rose to the challenge.


👨🏻‍💻 Role: UX/UI Lead
💻 Platform: Magento eComm
👥 Team: 3 Devs, 1 Designer
👁 Vision: Responsive eComm
Delivery: 3 Months
💼 Agency: Advantec

coversmerchants.co.uk

covers-mob-grid.png
covers-ucd.png

Defining the problem

To kick off the process, I hosted a discovery meeting with a representative from each department, from the shop floor right through to the MD and navigated them through a short design sprint process to efficiently identify the key problems that we had to tackle with the digital offering. From this process, it became evident that the key problem was that the site needed to work efficiently on location, in the hands of their main customers, building contractors. They regularly needed to get materials to site with a short turnaround time, on occasion, paying with trade credit, currently offered by Covers in store, which added time and delay and was currently a frustrating process to go through.

covers-mob-3.png
covers-dt-ui.png

The challenges

Now that we had identified and agreed on the key problems that Covers faced as a business, I worked in collaboration with them to turn these problem statements into addressable challenges through a ‘How Might We’ design thinking exercise. This resulted in identifying three key challenges that the design process needed to address; 1. How might we ensure that the site is easily navigable on a building site? 2. How might we make it easier for tradespeople to pay for materials when they need a quick turn around? 3. How might we structure the product range to best suit our users? With these 3 challenges democratically decided, we had a clear unified vision to take through to the ideation stage.

Aro+Ha_0010.jpg

The concept

The design concept addressed usability first, keeping the product catalogue clear and navigable on mobile. A custom account area where users could now pay for their order using a traders credit was designed. This allowed both Covers and their users to efficiently keep track of payment, speeding up the turnaround time on orders. A ‘timber tally’ interface was successfully prototyped, this allowed users to calculate multiple lengths of timber on an order, receive a quote and add it to basket, all in one go; a game changer in terms of efficiency.

covers-dt-2-screen.png
covers-mob-2screen.png

User interface

Knowing what the 3 challenges were for the new Magento 2 site I started to translate the brand online by defining a solid design system to keep such a large site unified and cohesive. The UI incorporated a bold and striking colour palette, clear button styles, with strong contrast, along with a typographic system focused on readability, tested under sunlight to ensure that it would work in a construction environment.

Product page

 
covers-dt-pp.png
covers-dt-depot-finder.png

The results

Covers’ first transactional site was a huge success. Their online ordering process received strong praise from their users through to their team of directors. The attention to the design process and the site UX had catapulted Covers into a new era. Organic traffic went from 10,231 in Nov 2016 to 24,823 in Nov 2019 - a 143% increase. They have now opened their 15th warehouse store and have increased their turnover by £10 million since the transactional eCommerce site went live.

What the client said

 
clients-covers-grey.png
 

Ciara Davies

E-commerce manager at Covers Timber and Building Merchants

“Building our first transactional website was never going to be an easy task. Covers have such a strong heritage, trying to capture that brand identity and bring it through on the website was one of our main priorities; something the company was quite protective of! Joe very quickly put us at ease, he took the time to really understand Covers as a brand and what our ethos really means, not only to us but to our customers! We were included in every aspect that we wanted to be and our feedback was always taken on-board.

Joe was never afraid to challenge our ideas and push boundaries where we never would have thought to! It was down to this that our respect and trust for this agency was solidified and the end result speaks for itself! Every aspect of our site was accommodated for in Joe’s design process, from translating the brand digitally, through to the way our customers navigate our pages, and that’s the difference with Joe, he designs for the whole user journey, from start to finish, with a passion and empathy for the problems of the end user as well as us.”

Next project Akrivia Health

Got a design problem?
Let’s talk.