A new look for Heist
I was the lead designer on a site redesign for Heist. They’d just engaged an agency who created new print guidelines and I worked closely with the creative director to translate these for web.
The site itself was a re-platforming project as they moved to BigCommerce. This involved regular check-in with the internal and BigCommerce engineers. The whole project was done in 3 months.
Re-defining the Heist site
Objectives: • Create a new design system • Increase conversion on mobile devices • Simple shopping experience • Surface reviews and customer service • Slick and informative site
The previous site
1. User found shopping complicated
2. No cohesion between brand and shopping on the homepage
3. Shopping list pages confusing
4. Navigation is confusing
5. Customers interested in reviews not press
Objectives from learnings:
1. We need to improve our conversion rate from the homepage to shopping
2. Brand and shopping feel disconnected
3. Product page needs to be consistent and load time quicker
4. Showcase trust pilot reviews
5. Introduce cross sell and a wider shopping range
Mapping out a new site architecture
This exercise helped to structure the site design into three key pillars E Commerce, Brand and Content. These pillars then dictated three key products to wireframe and prototype. The exercise also helped categorise shopping pages and find a place for reviews, help and customer service.
• Creating a simple to use and fully responsive shopping components • Creating a mobile first navigation • Brand and content pages are a master template than can be used and built in the CMS • Organising information in the Navigation and footer based on the site architecture
Wireframes of key pages, navigation and footer
• Create an immersive flow on the homepage. A better cohesion between brand, shopping and reviews. Three iterations were prototyped and tested
• On the shopping list page, the same structure was used across the range of products
• On the shopping pages, keep the same structure to be used across shopping pages. Two alternatives were prototyped and tested.
Heist didn't have a huge budget for user testing so I set up moderated interviews with members of the team. I also did some unmoderated tests with friends and family asking them to answer questions on their experiences.
UI a closer look: Homepage
UI a closer look: Product page
Two product pages were A/B tested. Testing conversion, session times and loading times.
Full site - www.heist-studios.com