Bunnings product page

I worked on the redesign Australia’s most viewed retail page – the Bunnings product page. Being the most important page in the customer purchase journey, the Product page needed a complete overhaul to better balance business and customer needs and showcase Bunnings's huge range. From a hammer to a shed – the product page takes care of the lot.

Project timeline
6 months 

Project timeline
6 months 

Year
2016

Year
2016

Location
DT (now AKQA)

Location
DT (now AKQA)

My role
Senior UI/UX designer

My role
Senior UI/UX designer

Project type
Digital, web

Project type
Digital, web

Getting across the enormous range

Bunnings is one of Australia's largest retailers and with over 200K+ products online, offering the 'widest range' is one of their core brand pillars. We had to first of all understand the breadth and depth of the range then work out the best way to group similar products, make more impactful and relevant use of imagery and feature Bunnings's growing Services offering. These were all areas the existing product page was underperforming.

We also needed to provide a strategic vision for the future of the page and consider how products appear across the site including search and category listings.

Bunnings Range

Content hierarchy and wireframing 

Once the content for each product type was collected we mapped this to user needs and business objectives. This enabled us to establish the hierarchy of the page and explore these block style lo-fi wireframes with Bunnings. We then started to add detail and iterated options, stress testing the wires using product content and data until we knew they were unbreakable. 

Bunnings wires

Designs

Once the wireframe system was solid, we moved into visual design phase and rolled out dozens of mockups of products acorss the range. We also developed functional prototypes to help communicate concepts to Bunnings and detail complex interaction functionality for our dev team.

Bunnings PDP Mower
Bunnings PDP wood
Bunnings mobile

Usability testing and iteration

We were able to gain rapid insight from customers on how the new designs were performing by remote A/B testing our designs with the existing page. On desktop and mobile the majority of users prefered the new design giving us comprehensive confirmation we were on the right track.

We took valuable insights from testing and rolled them into future iterations of the design.

Bunnings testing

What did users say? 

“This has all the information I need without making me feel cramped”

“This has all the information I need without making me feel cramped”

“Overall the cleanness of the layout makes it much easier to find the information I was looking for”

“I prefer to have a picture before other product details”

“I prefer [the new design] because it does not look as cluttered as the [old one]”

Thanks for reading. View the page

Other projects