Help consumers stay informed about foods that they purchase.
Recalled Foods
iOS APP DESIGN
MVP for an iOS app on mobile with focus on providing information on recalled foods in the US.
Role
Designer Researcher UX/UI
Tools
Illustrator Usabilityhub Whimsical Figma Miro
Duration
90 hrs (5 weeks)
Overview
In 2020 alone, according to the FDA (US Food and Drug Administration), there were 922 food/cosmetic products recalled. Recalled foods can be for undeclared allergens not listed in the ingredients or for pathogens/microorganisms, Listeria monocytogenes (Lm), contamination of foreign materials, or due to foodborne outbreaks that are caused by any of these.
of Recalls are from undeclared allergens
1
of Americans have food allergies
2
Americans get sick from foodborne illness each year
3
Problem
Foods are recalled in the US for various reasons including contamination and undeclared allergens. Sometimes brands will send consumers a message about a particular product that has been recalled but most consumer’s contact information is not provided to the place of purchase.
Who: Common consumers of goods in the US, individuals with known allergies, all ages impacted by recalled foods with undeclared allergens, detected foreign material contamination and/or pathogens or bacterium microorganisms that may put consumer’s health at risk.
Solution
Creating a quick and reliable resource available via mobile app that has recently recalled foods will prevent further illness and provide information to consumers of local and nationwide purchases.
Assumption& Risk
Users will want to access information about recalls from a mobile device and would want to be notified of recent recalls; consumers are concerned about recalls and desire to be informed.
Research
Considerations:
Will consumers prefer such an app providing recall information?
How will an app improve their awareness?
What needs to be provided for the app to benefit users?
What will attract common consumers to use this app?
How to make the app easy to use and effective for consumers?
Research Interviews
Research interviews were conducted with 3 participants
Observations:
Avg 6 hours spent daily checking their phone apps
All participants heard about the 2022 baby formula recall
Recalls mostly heard by chance on news or social media
Participants verify recalls on the FDA website
Sharable link desired for those without the app so they can still view it (mentioned 2x)
Findings/Insights:
Participants want specific notifications to tailor their needs
Participants with concerns about recalls check the FDA's website
Participants prefer to be able to share information about recalls
Participants don’t want unorganized information listed in an app
Participants desire validated and trusted information
Empathy Map
Empathy map with the user’s experiences, thoughts and actions.
Persona
Well-informed
Verifies information received
Attentive to needs and concerns
Explores curiosities
Strives to live a healthy life
Ideate
Building the app to develop the product
Research interviews, secondary research and insights summarized in the empathy stage were utilized to begin development of the MVP. The app sitemap should be easy to navigate so that basic tasks are executed within a few screens.
Site Map
Task Flow
(filter by allergen; share the listing)
Wireframe sketches
The main screen upon entering the app allows listings and then can filter to see desired products. User interviews mentioned organized views and ways to see exactly what recalled foods that spark interests.
Annotated Wireframes
The app was designed using iOS human interface guidelines (typography, spacing, default system colors, buttons, activity views, proper placement for action sheets for filter/sort, etc).
Prototype
Prototype built for one task flow to filter for peanut allergens within last week, choose first item, mark to list, and share via message text.
Testing
User testing was held virtually with 6 participants. Testing was done on a single task flow for the user filtering by allergen and date, selecting the first listed item, saving it to list and sharing that listing via text message. Brief instructions were included to guide participants through a scenario for this task.
Participants 6 Age range 25-36 Avg time 2m 31s Avg clicks 34.2 Test method usabilityhub Test subject prototype (mobile)
Outcome
Participants reported navigation is clear and easy to follow. 3 wanted to explore more areas not a part of the task. The filter was not the first selection clicked; some clicked the list items in hopes to immediately see what returns. All were able to locate the list/save button and the share buttons.
Insights
Most participants located the favorite list button and the share button immediately. Going back and cancelling actions is expected from the user’s experience. Using a star to save list items was confusing, so some suggested other shapes like a heart or bookmark icon.
Iterations
Changed 'New' label into pill shape
Updated spacing between items
Changed star icons to pushpin icon for list
Corrected image alignment
Wrap-up
Summary
Research: Gathered information from typical users concerned about food recalls and what motivates them, frustrates them and expectations for the best experience on mobile app
Ideation: Used research to help develop the screens and organization of the app recall lists and menu navigation
Design: developed app design with iOS guidelines in mind for cohesion and accessibility across the experience on mobile
Testing: Navigation should be easy to located quick items, filtering with iconography and glyphs easily recognizable
Next Stages
Other screens: Configure alerts /notification settings and search bar results screen
FAQ section, breakdown for pet and baby foods
Nice to have: further instructions on food handling when food is recalled, checking for contamination, reporting an illness, etc.
Newsfeed with latest articles about updates on recalled foods and other reports
A form to rate/review the app for iOS
Full visual build in dark mode
iOS Dark Mode Compatibility
Other Projects
Coursera App
KAUS Design System
KAUS Insurance