Background
Beaverbrooks are a UK high-street jewellers founded in 1919, with approximately 70 stores nationwide. They approached Code Computerlove to redesign and re-architect their ecommerce-enabled website www.beaverbrooks.co.uk in order to improve brand perception through good design and usability, and increase the conversion rates for jewellery sales and jewellery protection (insurance).
Research and Definition
Prior user research was made available to me in the form of a set of detailed personas and a detailed technical specification. I was tasked with combining these elements with best practice techniques and findings gleaned from my own competitor research in order to define the new site.
As part of this definition I produced a set of user journeys to satisfy the personas & scenarios, which fed into the creation of a site map and a set of process flow diagrams. From there a set of interactive wireframes were produced that defined the site structure, key page layouts and any interactive elements on the site, such as refining search results and adding products to the shopping basket.
Tools Used
Microsoft Powerpoint was used to create the expert reviews, competitor analysis, personas and scenarios, Visio was used for sitemaps and process flows, and the interactive wireframes were produced using Axure RP Pro.
Assets & Resources
Sample slide from Competitor Analysis document (blue = good, red = bad, yellow = a bit of both)
Sitemap overview
Sample wireframe – Branded search results
Working with 3rd parties
Code are building the site templates and then handing them over to a 3rd party who will integrate the pages into the site infrastructure, based on the process flows and wireframes I’ve produced.
Working with 3rd parties in this manner means that detail and supporting annotations are critical aspects of any documentation I produce, and I feel that this project is probably one of the most well-documented projects I have worked on.
At the time of writing, the new site is still in the development stage. However, here are some previews of the rather lovely mockups Code’s creative team have done:
