B&Q

Responsive transformation

B&Q responsive redesign

Project background

To cement their position as the UK's leading home improvement retailer, B&Q have been working on a long term transformational programme to enable a move towards an omni-channel offering placing their customers at the centre of their business.

Although the web channel would no longer be the singular, self-contained part of the business it previously was, success would rely on a solid retail core that offered real value wherever, whenever and however users chose to start or finish their journey.

To help them develop a mobile-first, responsive design solution B&Q approached EMC Digital to provide UX consultancy and interface design expertise.


B&Q responsive checkout screens

Image: B&Q responsive checkout screens


Our role

EMC Digital engaged Clearnegative Design and our long time collaborators at Big Hello to lead the art direction and interface design on the project, with the key commerce areas of the site falling under our responsibility: the basket and checkout; product detail pages; and product search, comparison and listings.

B&Q search results
B&Q search journey

Image: B&Q search results and search journey


Working within an agile cross-functional team, across multiple scrum epics and office locations, we needed to champion e-commerce best practices and interaction patterns to optimise the final customer experience.

It was also vital to work closely with our partners at Big Hello to ensure design consistency and compatibility with the other areas of the site.

B&Q product section identities
B&Q search facet logic


Image: B&Q product section identities and search facet logic


Ben comfortably and calmly manages his workload, whether it's providing art direction or stunningly detailed visuals.
Chad Durham
Art Director, Big Hello Design


B&Q payment and shop category screens


Image: B&Q payment and shop category screens


Design concepts and UX solutions were validated with in-house user testing, and regular reviews and sign-off with both the client and development leadership teams resulted in successful design iterations.

The final templates and component patterns were then collated and documented for the offshore development teams in India and Ukraine, and ultimately for handover to the internal B&Q design team, who would manage the new site moving forward.

B&Q responsive template definition

Image: B&Q responsive template definition



Ben's work is both elegant and thoughtful: a powerful combination that's more rare in a designer, these days, than you'd think.
Oliver Kenton
Creative Director, EMC Digital UK




What we delivered

• Mobile-first design concepts
• Final responsive design templates
• Visual and interaction guidelines



Please feel free to get in touch if you'd like to hear more about this particular project or about how we could help your business design responsive solutions for multiple customer channels.

Alternatively, you can read more about how we helped UBS, Barclays, Hotels.com and Vodafone.