Ethical Eats

Ethical Eats is a mobile platform for ordering food from restaurants for takeout, focused on connecting ethically-conscious users with sustainable and transparent food options.

Overview

I developed a new product concept and prototype for the mobile application Ethical Eats — a solution to fulfill the needs of urban adults seeking sustainable and transparent food choices that align with their values in order to help them feel ethical about the businesses they support and the choices they make.

KEY DELIVERABLES

PROCESS WORK


  • MY ROLE

    UX Researcher | UX/UI Designer | User Interview & Usability Testing Moderator

  • METHODS

    Directed Storytelling | User Interviews | Low Fidelity Wireframes | Information Architecture | High Fidelity Wireframes | Interactive Prototyping | Usability Testing | Think-Aloud Protocol | Affinity Diagramming

  • TOOLS

    Figma | FigJam | Trello | Otter.ai | tl;dv | GoogleSheets | Evernote | Keynote | Zoom | Pen & Paper

SUMMARY

Key Points

  • Problem: Develop a new product concept for ordering and receiving food

  • Process: As a 1-person team, I developed an understanding of the exiting experience by conducting generative research (directed storytelling) in order to identify key opportunity areas and develop a user goal statement to drive subsequent steps in the design process

  • Findings: Opportunities to facilitate ethical transparency from businesses and develop a sustainable ordering and takeout system

  • Solution: I developed an interactive prototype for usability testing, identifying problems and developing a findings and recommendations report with annotated wireframes along the way

  • Challenges: Participant recruitment and screening was based on pools of known contacts, with varying relevance in psychographics to the target user group (urban adults), and this needed to be considered in the prioritization of usability problems

  • Reflection: This project provided the opportunity to take a product a new product concept from the early stages of generative research through an initial round of usability testing, allowing for various research, wireframing, and design methods, spanning across multiple tools

PROBLEM

Problem Statement

The COVID-19 pandemic has changed the way people live — and eat. There are numerous digital platforms for ordering & receiving food, ranging from grocery options, to meal-prep delivery services, to restaurants, and more. While such products have expanded and evolved over time, keeping pace with an ever more digital world, rapid growth since the start of the COVID-19 pandemic has given rise to new users, challenges, and needs. I was tasked with researching and creating a digital product for ordering and receiving food, in order to fill opportunity areas in the current experience.

There are a number of digital platforms that provide food ordering and receiving services. Some apps (such as DoorDash, pictured here) incorporate a portfolio of restaurant options, while others are restuarant-specific.

Many grocery stores offer pickup (in-store or curbside) and delivery services (such as Cub Foods, pictured here). Some grocery stores provide these services through in-house staff, while others partner with third-party providers such as InstaCart.


Understanding the Existing Experience

To understand the existing user experience in this space, I conducted generative research through six directed storytelling sessions.

User sessions were conducted remotely, with video (Zoom) and audio transcriptions (Otter.ai, pictured above) recorded for subsequent processing and analysis. Directed Storytelling session began with the prompt “Tell me a story about a time when you ordered food or groceries for pickup or delivery.”

Screenshot of FigJam board used for affinity diagramming to analyze and synthesize user session data for commonalities and differences across various themes (experiences, goals, values, needs, painpoints, and positive points).


Research Findings

The synthesis of our research data revealed several key themes and opportunity areas.

COVID-19

6/6 research participants have ordered restaurant takeout food, and make food ordering  decisions based on health and safety (COVID-19) concerns.

Impact: A subgroup of users of digital food takeout platforms increased their usage of these tools in response to the COVID-19 pandemic.

Brand Loyalty

4/6 research participants exhibit brand loyalty to their favorite restaurants and local businesses (sometimes with the tradeoff of workflow, convenience, and/or cost).

Impact: Users are often repeat customers at their favorite businesses, even to the point of being able to overlook certain painpoints and/or temporal/monetary drawbacks.

A Value on Ethics

4/6 research participants value ethics in making orders (food ethics and/or company ethics).

Impact: Users want to be able to evaluate ethical implications in regard to the food they eat and the businesses they support against the own beliefs and values they hold.

Key Opportunity Areas

Ethical transparency from businesses (e.g., social, political, environmental, etc.);
sustainable systems to reduce waste from takeout orders


I think I’m pretty loyal…the restaurant would have to do something like that I disagree with [to not order from them]…like if the restaurant owners were like anti-abortion and like super big Trump supporters.

- Participant 1

We haven't been [ordering from that restaurant] because I think their politics are very suspect.

- Participant 3A (pair user session)

They would make substitutions that we weren't always wild about, you know, regular vegetables, substituted for organic vegetables, that kind of thing.

- Participant 3B (pair user session)


User Goal Statement

Based on my research findings, I developed a user goal statement to guide the design process.

User Goal Statement

Our user group is urban adults who need transparent and sustainable food choices that align with their values in order to help them feel ethical about the businesses they support and the choices they make.

SOLUTION

Low-Fi Prototyping

Guided by my user goal statement I started with hand sketches and low-fidelity digital wireframes to explore the development of key deep screens in the context of the identified opportunity areas.

Wireframe 1. User profile setup screen allows users to enter/select custom information about causes, issues, practices, etc. that they care about (e.g., environmental, social, community, etc.). These categories also are to be used as filter/sorting criteria in the explore/search functions of the app as well (for example, see Wireframe 2), to show how various restaurants/which restaurants best align with each user’s “cares.”

Wireframe 2. Search screen/function gives users the ability to input custom searches for restaurants in a specific location, with the ability to filter on basic criteria (such as cuisine, cost range, search radius, etc.), but also more nuanced ethics-focused criteria (e.g., environmental issues like ‘does this restaurant compost?’, or social & community issues such as ‘is this restaurant committed to supporting workers with a living wage?’. Restaurant entries/listings indicate shared values between the restaurant and the user (based on the “things you care about” user profile setup section - see Wireframe 1).

Wireframe 3. This app concept supports a reusable takeout container return/discount system/program for all restaurants included in its portfolio. In this concept, users receive their takeout orders in reusable containers; if they return these containers in a future order, they will receive a discount on their total order (fostering both sustainable practices and brand loyalty/repeat customers). This series of screens allows users to enter information about the containers they will return when picking up their order, in order to calculate the resulting order discount.


Information Architecture

I developed an architecture diagram in order to more thoroughly understand the key user and task flows for this new product concept, as well as to provide context for where the low-fidelity deep screen wireframes fit into the overall process.

The architecture diagram developed depicts high-level screens and flows, along with information about screen and menu content.


Interactive Prototyping

Working from low-fidelity wireframes, and guided by the architecture diagram, I moved into creating an annotated interactive prototype for the main user flow through the new product concept.

Prototyped user profile setup screen corresponding to wireframe 1.

Prototyped search screen corresponding to wireframe 2.

Prototyped reusable takeout container dialogue corresponding to wireframe 3.

EVALUATION

Usability Testing

I conducted concept evaluation and usability testing using the think-aloud protocol with three participants in order to understand the factors that influence how difficult or easy it is for users to perform the primary user flow/task flows of the app.

Usability testing sessions consisted of both participant-led and scenario-led prompts; this combination of testing styles was selected based on happy path testing, due to the relatively linearly-constrained user flow path of the interactive prototype developed. Interview data was initially processed using Trello, grouping observations by like scenarios, and color-coding by participant or observation type (e.g., painpoint, positive aspects, etc.).

Usability problems identified in the interview processing using Trello were translated to and organized in GoogleSheets, categorizing types of usability problems, and evaluating salience and severity.


Findings & Recommendations

Usability testing revealed that the most salient and severe usability problems were related to:

  • cohesiveness in the communication of brand identity

  • iconography

  • consistency in terminology

  • navigation

In response to these identified issues, I developed a findings and recommendations report, including annotated wireframes of suggested changes to address prioritized usability problems.

A more descriptive “tagline” and the inclusion of the logo on the welcome screen may help users to more easily and quickly understand the services offered through the app, as well as establish a more clear brand identity.

Consistent color treatment of badges/icons between different screens, as well as the incorporation of a pop-up or verbal message may help to provide clarity to users on which restaurants share their common ethical values.

More consistent terminology to refer to ethical values implemented throughout the app may help users to recognize categories and how shared criteria impacts their experience throughout the ordering process.

More consistent terminology and usage of icons throughout the app may provide additional context for how user values connect between different screen.

Grouping of similar pages/functionalities, as well as more consistent icons and explicit verbal cues may help to provide a more streamlined, recognizable, and fluid navigation experience.

CONCLUSION


Next Steps

  • The immediate next steps include implement all recommended solutions to high priority problems uncovered during the first round of usability testing sessions.

  • After updating existing screens, another round of usability testing could be conducted to evaluate and validate these solutions, as well as identify unresolved or new problems.

  • Additional screens and interactions could also be built out according to the architecture diagram for testing.


Key Learnings & Takeaways

  • Taking a new product concept from the early stages of generative research through an initial round of usability testing provided the opportunity to practice various research, wireframing, and design methods, spanning across multiple tools.

  • Even small user interview sessions can provide a wealth of data and insights — the research, design, and evaluation process was guided by a total of 9 user session.

  • More stringent participant selection and screening processes may provide more focused experiences and feedback, as the participants for these user sessions were selected from known contacts, with varying relevance in psychographics to the target user group.

  • Diagramming more focused processes (such as screens or user tasks) separately in architecture diagrams may help provide more clarity when defining key components and interactions within the context of the overall product architecture.

  • Through this process, I was able to gather insights from users to formulate a user goal statement, develop and design a new product concept guided by these user needs, and evaluate the primary user flow — helping Ethical Eats on its mission to help users do what they believe in through food.


>

The JP4 Foundation


<

Minnesota Women’s Press