City Plumbing

Basket (Web)

Project goals

Stremline the user journey by introducing a single call to action and transform the way basket is presented to simplify the decision making and as a result drive conversion rates.

Company objective

Stremline the user journey by introducing a single call to action and transform the way basket is presented to simplify the decision making and as a result drive conversion rates.

Responsibilities

Stremline the user journey by introducing a single call to action and transform the way basket is presented to simplify the decision making and as a result drive conversion rates.

Role

UX/UI Designer

Platform

Web

Sector

E-commerce

Audience

B2B & B2C

Tools Used

Figma, Decibel, Monetate

Date

2024 -

Problem Statement
The user journey was slowed down for 99% of users by having two add-to-cart buttons. The basket needs to now accommodate fulfilment selection.

Cool Design

Lorem ipsum dolor sit sodales, augue velit cursus nunc.

Amazing Style

Lorem ipsum dolor sit sodales, augue velit cursus nunc.

Sharp Edges

Lorem ipsum dolor sit sodales, augue velit cursus nunc.

Ultra Durable

Lorem ipsum dolor sit sodales, augue velit cursus nunc.

Competitior Analysis

Company

Bradfords

Victorian Plumbing

Travis Perkins

Strengths

I am text block. Click edit button to change this text. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

Weaknesses

I am text block. Click edit button to change this text. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

Top Features

I am text block. Click edit button to change this text. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

Stage 2: Understanding Users

Data Analysis

76%

Collection Only

0.3%

Collection & Delivery

99%

1 Branch Collection

Stage 3: Concept Design

Design

Stage 3: Testing Concept

User testing

From our user feedback playbacks we saw:

conversion rate, add to cart, average order value, bounce rate, cart abandonment

I am text block. Click edit button to change this text. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

Survey Results

Natural Flow

Sed cursus turpis vitae tortor donec eaque ipsa quaeab illo.

Hot Looks

Nemo enim ipsam volup tatem quia vol uptas sit sunt in.

Awesome Design

Nam libero tempore, cum soluta nobis placeat facere.

Awesome Design

Nam libero tempore, cum soluta nobis placeat facere.

Visual Builder

Ipsum totam rem aperiam, eaque ipsa quae ab illo.

Ton of Features

Incidunt ut labore et dolore magnam ali quam quaerat.

Unrivaled Quality

At vero eos et lorem accusamus et iusto ullam corporis.

Visual Builder

Ipsum totam rem aperiam, eaque ipsa quae ab illo.

Stage 4: Design

Design Ideation

Content

Centered content, long titles and descriptions which caused a lot of critical functionality to stack and be pushed further down the page.

The search placeholder text was either very vague or too long so the user couldn’t read it.

The same functionality had different names. One page used words like ‘advanced search’ another used ‘search options’ which caused confusion to the user.

Imagery

Searches had an irrelevant background image that distracted the user from the primary aim of the component.

Map and text search hierarchy

We aimed to align the hierarchy of both the map and text search features. Google Analytics revealed a 35% increase in map view usage over the past six months, highlighting its importance.

Enhancing the hierarchy involved assigning a clear H2 heading to the component title, which is crucial for users relying on assistive devices and ensures consistency across all ten searches.

Design ideation

Stage 4: Design

Impact and learnings

Results, learnings & next steps

This is a description

02. Content

Quisque molestie elementum quam molestie malesuada. In sagittis urna vitae blandit molestie. Nam aliquet dui neque, eget tincidunt sem accumsan et. Suspendisse egestas, turpis eu pellentesque aliquam.