Who are Baking Stash?

Baking Stash are an online retailer distributing cake decorating goods to professional and hobby cake bakers across the UK. Initially, products were sold on marketplaces however, the business seeks to increase revenue by driving sales directly to their new mobile web app.

Design Challenge

I was tasked with designing the homepage for Baking Stash. A new ecommerce web app, for cake decorating supplies, based on user needs.

My Roles Within The Project

🔎 Research 📝 Wireframing 💻 Prototyping 🎨 UI Design

Research

Qualitative research was conducted with our existing customer base to understand the following research goals:

What motivates users to purchase their cake supplies online
Determine key products and features users seek when ordering their cake supplies
The challenges/pain points users face when placing an online order for cake supplies
Users motivations for repeat custom

Empathy Map

An empathy map was created to gain a deeper understanding of our users.

Pain points

Research allowed me to identify the following user pain points which needed to be addressed:

Users found the minimum spend to qualify for free delivery was often high on competitor sites
Frustrations when items aren’t delivered in time for the occasion / celebration
Users were unable to locate products easily
Pricing isn’t always competitive as marketplaces offer free delivery
Frustrations as retailers don’t always offer a wide range of products/brands

Personas and User Stories

Our personas and user stories were based on an ambitious, young female who ran her own business baking cakes from home. As she receives a variety of requests from her customers and often at short notice, she wants to be able to place orders with a company that offers quick turnaround times to avoid turning away custom.

Problem Statement

With our persona receiving last minute orders, it meant we needed to offer fast and efficient delivery options to allow them to fulfill their business needs.

User Journey Map

A user journey map was created to help visualise the process our user takes to successfully place an order on the Baking Stash web app. This allowed us to understand each action taken, as well as identifying opportunities for improvements.

Goal Statement

The goal for the Baking Stash app was to allow professional cake bakers to easily locate their items and place an order, selecting a suitable delivery option which included the option for next day delivery.

Web App Architecture

User Flow

To help us understand the path taken by a typical user on the web app, which covers all potential loops, decision points and exits, we created a User Flow diagram.

Information Architecture

To help us organise where information will be placed, information architecture allows us to structure the contents of each section of the web app. It is important to keep in mind where the user will naturally look for information.

Ideation

The ideation process allowed me to generate possible solutions to solve our problem statement whilst also focusing on both user and business needs.

Storyboard

Our close-up storyboard tells the user's story, on how they would use the web app, in a sequence of panels. It takes into account our persona and the problem statement.

Paper Wireframe

Digital Wireframe

Using Figma, I was able to create digital wireframes which allowed all stakeholders to visualise the design with a higher degree of accuracy for contents and scale.

A usability test of the low fidelity prototype allowed me to gain an insight on how users move through the app and make adjustments accordingly based on their feedback.

Results

I successfully led the research and design aspects for this project. On completion of the project, we launched the Baking Stash ecommerce web app. This saw an increase in revenue for the business, allowing users to order directly on the company’s own digital platform. whilst addressing user requirements. Below are high fidelity prototypes of the web app created.

High Fidelity Prototype

High fidelity prototypes provide more detail and are considered the most complete blueprint of the final design. This design contains imagery and text and is as close to the final design as possible.

Following visual design principles, I was able to bring my designs to life using colour, typography and iconography.

My designs successfully allowed me to emphasise the next day delivery options available to our customers. This was placed at the top of the page, and was one solution to resolve our problem statement.

In addition to this, we wanted to reassure users that the business would also process and dispatch orders placed before 2pm the same day to avoid any delays in receiving their order.

I organised the products into categories to allow users to easily navigate through the homepage and locate the products they required. Users also had the option to use the menu bar to browse through all categories or search for a specific product.

For users seeking specific brands, I created an interactive carousel with manufacturer logos which would take users to a brand specific landing page.

Let's connect

Get in touch with opportunities or just to say hello! 👋