E-commerce Navigation

Challenge

  • Complete navigation overhaul for web and app to help users find products faster and easier
  • Produce a complex navigation component that translates well to the app and across different screen resolutions
  • Design System UI Kit Integration

Research & Analysis

  • In-store interviews with customers and associates to identify typical user behaviour and decision processes during purchases first-hand
  • Stakeholder Interviews – finding out what business needs and goals are for the navigation redesign, what are the main motives and clearly define them in a design document
  • Comparative analysis of Material and iOS specifications
  • Competitive analysisPerforming an audit/review of competing websites and apps; conducting user testing of competing sites; writing a report that summarizes the competitive landscape. of navigation patterns on e-commerce sites in and out of home improvement industry niche
  • Analytics reviewAnalyzing web or mobile usage data, and making subsequent recommendations. & data visualization – going through the numbers and getting insight from data by cross-referencing information about the customers from different sources within the company

Key Findings

  • Around 50% of site users are currently finding products by browsing
  • There are several types of navigation components across the site:
    • Primary
    • Secondary
    • Tertiary
    • Lists (dynamic and manually curated)
    • Cards (several types)
    • Landing Pages
  • There are multiple points in the shopping experience which can be improved by cutting the number of steps from the moment user sees the product to checkout
  • There is a number of technical challenges that need to be resolved by close collaboration with engineering team in order to provide a seamless cross-channel experience
  • Improving usability, accessibility and loading times is the top stakeholder priority

Design

Navigation mobile pattern for most used device screen resolutions