Dishy

Healthy, Delivered

Dishy is a healthy meals subscription business for which I redesigned the customer signup and checkout experience of
...

Dishy checkout

Details
Summary
Background & Problem

In response to seeing a gap in the market, I co-founded a healthy meals delivery business. As part of my responsibilities I designed and product managed the entire digital experience for users of the service.

Early customers began to reach out by email and live chat with queries about the Dishy service. The issues most commonly raised made clear that customers were confused about aspects of the service and how to place their orders through the checkout.

Research: Field Interviews

On occasion I take the opportunity to deliver meals to certain customers. I used these opportunities to ask customers about their checkout user experiences. From approximately 15 doorstep conversations, I received feedback such as:

"I found it [the checkout] confusing. It wasn't clear that I would receive the meals in two separate deliveries over the week."

- Karen, HR Manager

"...so I nearly made a mistake of creating a second subscription even though I had one already. It needs to be more upfront that a subscription is running."

Hilliard, Wholesale Distributor -

"It's not overly obvious that I can order for multiple people and that each one can have their own [food] requirements entered."

- Kelly, Marketing Executive

Research: primary source Analysis

I followed up on the field interviews by studying previous communications from Dishy customers to the business.

Sample of customer support queries

Research: Usability testing

In addition, I conducted usability tests with selected participants to study them using the Dishy checkout in it's staging environment. Some excerpts included participant comments such as:

"Most sites don’t ask for these two [sign up and delivery address] on the same page."

- Richard, Solicitor

"What if I just want to order once?...Is it all subscription?"

Marta, Beauty Professional -

Checkout v1 (Contextual Analysis)

Research: findings
  1. Resetting passwords became impossible if users had not validated their email address
  2. Checkout process did not explicitly state that users would receive two deliveries per week
  3. Signup and Delivery Details as one screen/ step proved 'unnatural' to most users
  4. Checkout did not alert active subscribers to their ongoing subscription if they tried to reorder
design: Persona

The research clearly indicated that the UX for the Dishy checkout required a fullscale redesign. I created a User Persona based on my research and knowledge of Dishy customers, and used this persona to influence the Job Stories I wrote for the redesign of the checkout.

User Persona

Empathy Map

Design: Sketching & Wireframing

I researched other ecommerce checkouts and then sketched out a number of the screens of a smoother, clearer and more coherent checkout user experience.

Dishy sketches

The sketches formed the basis of the wireframes for the redesigned Dishy checkout.

research: prototype usability testing

I used the wireframes to create an interactive prototype that I could test with a select number of Dishy customers.

Checkout InVision prototype (demo here)

Design: Feature iteration

The prototype received positive feedback from customers and revealed a number of pain points which influenced the final handover to the developers, including:

development: assets Handover

With UX research and design completed, I presented both the wireframes and prototype to the developers with the design artifacts acting as the basis from which development would based upon. These were supported by a Job Story backlog which would form the basis of sprints for the release.

development: Testing & constraints

Over a series of weeks I worked with the developers through the sprints to bring the Dishy redesigned checkout to life. Acceptance Testing was a particularly important aspect of this process as I sought to have the shipped product as close to that of the designs as possible. However, in the final published version a number of technical constraints influenced aspects of the design, such as:

Redesigned checkout demo (Staging environment)

Shipping: performance analysis

A few weeks after handover, including a number of beta reviews and minor iterations, we shipped the redesigned Dishy checkout.

The redesigned checkout had a number of direct positive impacts upon the Dishy business, including:

NExt Project: GYMR
Fitness marketplace App
See Gymr