Build-a-meal case study

See prototype

My Roles
UX/UI Design
Researcher
Project Manager

project Background

This is a fictional project with real research.

I came up with the idea after discovering I had no time to cook but still wanted to eat healthy without breaking the bank. Build-a-meal is a fictional company (so far) that allows people to build their own meals affordably and select how they want them cooked. Build-a-meal would then cook them up and home deliver to the customer. My intended target users for this idea is athletes who are a little more disciplined about healthy eating and fitness.

Discovery

Research Goals

Interviews

Participants
  • Gender
    - 2 males
    - 2 females
  • Race
    - All caucasian
  • Age
    - 3 Gen X
    - 1 Baby Boomer
  • Employment
    - All full-time employed
  • Marital Status
    - 1 single
    - 3 married
Summary
  • Most who have used a meal delivery service in the past started because of a coupon or other incentive.
  • Most no longer use the service.
  • Incentives do not work to keep customers. Just offer the best service at a decent price to begin with.
  • People like variety and the flexibility to choose according to their diet needs/restrictions.
  • Those interviewed said they would subscribe to such a service if it was more cost effective.
  • Quality of ingredients was of high importance.
  • Counting calories and keeping track of macros was especially important to the success of keeping a healthy diet.

Define

Persona & Journey Map

After talking to several people during the interview, I developed David, my main persona. David is married and he and his wife are very health conscious. He wants to eat better but doesn't like the idea of having to meal plan. He likes variety and flexibility. I also felt this was a good opportunity to map David's journey through the product and log how he might feeling at various points during his experience.
View the full journey map.

Task & User Flows

Task Flow

There is one main task flow and that is to successfully build meals and go through the check out process. View the task flow.

User Flow

The user flow contains a few more decision points. This is where David can decide what plan he wants, or if he needs to edit a meal. He can also save his meals and mark them as favorites. View the full user flow.

Sketches

Building from all of the research I did and the personal development and journey mapping, I created low-fi sketches within Balsamiq in order to bring the user flow to life and determine the application's information architecture. View the full sketch.

Design

Branding

Since this was an idea of my own making, I had full control over the branding. I wanted the app to be seen as colorful, fun and energetic, just like my potential users. I designed the logo where the 'b' looks like it has a spoon inside of it. The color palette is meant to come from actual food items. I wanted red, orange and green to signify fresh food. According to scientific research, those are colors that affect hunger.

High Fidelity Prototype

After getting the branding to where I wanted it, I used my new look and feel along with my low fi mockups to put together the high fidelity mockups you see here. These are just a few sample screens. Interact with the prototype.

UI Kit

The UI kit, a comprehensive inventory of all of the design elements used for consistency when building the app, successfully demonstrates the vibrant and clean look I was striving for.

usability Testing

Participants
  • 42 total test subjects
    - 4 in person (2 female, 2 male)
    - 1 remote (female)
    - 37 remote, unmoderated
Test Objectives
  • Determine the ease at which users can navigate through the app to accomplish their task, which will be to build and purchase meals.
  • Observe the path in which they took to get through to the payment screen
  • Test the overall ease of use of navigating through building their meals.
  • Observe any frustrations or obstacles users may have that may impede their ability to complete their task.
Test Summary
  • In Person/Remote Testing
    - Users completed the task in under 4 minutes.

    - Confusion over some verbiage/terms.

    - High marks for ease of use.
  • Unmoderated Remote Testing
    - 0% had direct success.
    - 51% used an alternate route
    - 49% gave up
    - Many expressed frustration or difficulty interacting with the prototype.

Affinity Map

The affinity map activity gave way to some patterns and suggestions from the usability testing. There was some confusion around a few of the terms I had used in the app. A couple of the testers were concerned that their allergy may not be listed and how would that impact their meal selection. Being up front about cost and shipping was a concern as well. And some of the remote testers had some issues with the overall flow of the meal building process. View the affinity map.

Priority Revisions

I decided to use a priority matrix to prioritize the revisions that I would make. In the real world this would be a great group exercise. The group could rank and then prioritize the changes. Since most of the suggestions or changes landed in the upper quadrant (low effort/high user value) I was able to make most of them. View the priority matrix.

Next Steps

If this were a real world project, my next steps would be to do another round of user testing with the changes I've implemented. After that, I'd do another round of affinity mapping and synthesizing of that data. I'd iterate until the flow was as smooth as it could be. Then I would package it all up and ship it off to the developers.

Next Case Study:
Skin by Kari Lynn
See Next Case Study

Now, Let's Talk about you!

I am eager to work for a company that prioritizes users' needs, values creative problem solving and teamwork. If your organization sees the value in UX research and design use the form below to reach out if you’d like to discuss opportunities or to just say hello!