Enhancing consumer confidence through an e commerce overhaul

Improving consumer retention and reducing bounce rate

2 week individual project
UX | UI | Product Design

The challenge

To redesign a local business’s e-commerce site by selecting appropriate research methods, reviewing its information architecture, and ensuring the user interface enhanced usability.

The results

The overhaul of the site’s information architecture aligned with the users’ mental models, significantly improving usability, reflected in the System Usability Scale (SUS) scores, which increased from an initial score of 30 to a final score of 87. The most impactful change was the boost in consumer confidence, driven by the product’s new visual identity.
Final Prototype

Selected local business

lower morden garden centre

Lower Morden Garden Centre  (LMGC) is situated in South West London, It regularly collaborates with the national trust, promoting conservation and a love for nature. Its aim is to support local gardening enthusiasts to create beautiful green spaces.
Current e-commerce site.

Usability testing on current site

uncovering usability issues

This research will uncover usability issues like confusing elements, navigation, and flow problems, prior to the interface design phase.
Research Methods
  1. System Usability Analysis (Interviews & SUS scores)
  2. Task Analysis
  3. Heuristic Evaluation
  4. Structured User Interviews
  5. Journey Map

1. System usability analysis

key findings

  • Average SUS score of 30 (Grade F).
    ‍
    Indicating LMGC's website is difficult to use and offers a poor user experience.
  • Average time of 5:37 to find a product and complete checkout.
  • The UI confused visitors, making them doubt whether they were on a plant website.
  • Colour scheme created confusion.
  • Inconsistent layouts and poor use of negative space.
  • No interviewee would recommend this to a friend.
“This website is the opposite of the I phone”

Research Participant

2. Task analysis

key findings

  • Current site had the highest number of clicks to checkout, twelve.
  • Shortest amount of clicks to checkout was seven, (Petersham Nurseries).
  • LMGC had several pop up screen appear throughout this task, creating feelings of confusion & uncertainty.

3. Heuristic analysis

key findings

  • Branding and colour scheme did not match consumer expectations.
  • The language and filter menus did not align with how consumers shop for plants.
  • Key call-to-action buttons and elements were difficult to find.
  • The design and layout of pages was confusing.

4. Structured user interviews

understanding our consumer

I wanted to develop an understanding of the behavioural patterns and consumption habits of people who purchase plants.
‍
By aligning my design with how people think and behave when purchasing plants, I aim to not only solve usability problems but also create an experience that resonates with customers, driving meaningful improvements.
"I love my houseplants, but every time I think about buying a new one I get nervous... how do I know I will keep it alive, how do I know it will be happy?"
‍

Research Participant

key findings

  • Buyers spend significant time researching before purchasing a plant.
  • Research focuses around care requirements and environmental suitability.
  • Understanding a plants suitability boosts buyer confidence.
  • Using Latin names and technical terminology on a website is confusing.
  • Preferred plant organisation: familiar terms like "indoor" or "outdoor," light, and care requirements.

5. Journey map

Information architecture

site map

My research highlighted the need to rethink the site's information architecture (IA), as the technical language made navigation difficult. Inspired by sites like Patch, I restructured the navigation to match how users categorise plants - by indoor/outdoor, room type, and style - aiming to consumer journey quick and easy.

Initial sketches across key screens

Click images to enlarge.
Initial Sketch: Accordion Menu
Initial Sketch: Basket Overview
Initial Sketch: Checkout
Initial Sketch: PLP 1
Initial Sketch: PLP 2

Lo fi wireframes across key screens

Click images to enlarge.
Homepage Accordian Menu
Product Listing Page
Add To Basket Overlay Menu
Basket Overview Page
Checkout Page

Testing our design

conducting usability tests & improving our design

  • Assess how intuitive users find the new navigation, page layouts and content structure.
  • Discover any oversights and tweak them accordingly.
  • Measure the time it takes to complete key tasks.

Usability testing

findings & results

  • Average SUS score of 87 (Grade B).
    ‍
    Indicating the redesign made the site intuitive, easy to use and delivered a satisfying experience
  • A reduction of over four minutes on the checkout task.
  • People felt the design of the site mean the plants would be high quality.

Design recomendations

  • Redesign navigation sub menu so users better understand it is a further categorisation.
  • Ensure call to action buttons (add to bag) have sufficient emphasis.
  • Consider adding a quick buy function reducing friction to checkout.
  • Familiarise alignment and sizing on the checkout pages.

Design iterations

from usability testing

Before
The ‘All indoor plants’ button had an icon pointing sideways. This confused some testers as they thought it would open another accordion section. It took them directly to the product page.
After
To rectify this I removed the arrow icon from “all indoor plants”. Below I added a further sub section “shop by” to clarify these options gave site visitors an additional sub section.
Before
Testers commented that the alignment and spacing felt off throughout the checkout. The process indicator column had low visual hierarchy and was hard to read.
After
I centralised the alignment of the page. I rectified the visual hierarchy by giving the central column greater width. With the left and right columns now having equal width, balancing the page.
Before
Testers struggled to locate the “Add to bag” button.
After
The “Add to bag” button was emphasised by placing it on top of a grey background, I also gave it a green hover state.

Rebrand

Creating a New Visual Identity

Our initial user testing revealed the site's visual identity was confusing, with users taking time to recognise it as a plant website. Interviews showed nature made people feel calm, so I created mood boards exploring colours, layouts, and typography to inspire a peaceful, modern design.

Colour palette & typography

Final UI across key wireframes

Click images to enlarge.
Home Page
Product Listing Page
Product Landing Page
Basket Overview Page
Checkout Page

Next steps

  • Onboard & feature local businesses

    Featuring local businesses enhances On My Way’s authenticity, showcasing community efforts and reinforcing its role as a grassroots hub.‍
  • Increase Information and Resource Materials.
    ‍
    Provide visually engaging care details to help customers choose the right plant and promote responsible ownership.
  • Introduce a Membership Flow.

    A membership flow would incentivise customer loyalty, offering a personalised experience, with benefits like product recommendations based on past purchases.

Learnings

  • Visual Design & Brand Alignment.
    ‍
    Redesigning the site's visuals aligned the brand's aesthetic with user expectations, boosting trust, satisfaction, and emotional connection.
  • Prioritise Intuitive Navigation and User-Friendly Categorisation Reduced Friction.
    ‍
    The importance of clear, well-structured information architecture, meant users no longer had to guess where to find the products they needed.
  • Mental Models and Scanning Behaviour.
    ‍
    The accordion menu on the homepage aligned with users' mental models, making it easier to scan and find information, enhancing the site’s intuitiveness.
Final Prototype
© 2025.  All Rights Reserved.
Linkedin