RestAllergy App
A 6 month long academic project, that involves user research, ideation, visual design, and usability testing. Purpose is to provide an mobile app that helps people with food allergies be able to eat comfortably when dining out.
My Role
Solo Project
Entire product design from research to ideation, to UI design to testing.
Project Duration
6 Months
Area of Focus
Restaurant / Food / Health / Location
Synopsis
This is a 6 month long academic project that I did while learning from Springboard UX Design online bootcamp. The main topic for this project is to see what are the issues that people with food allergies experienced and try to design a digital application from the research in order to improve said experiences.
If you want to jump ahead to view the ideations process or visual design you can click on their respective links below and it would take you straight to that process.
1. Research
2. Ideation
3. Visual Design
4. Usability Testing
Challenges and Restrictions
The restrictions and challenges that you see below impacted which methodologies is used for this project.
The Research
This section shows the reasoning behind my decision to choose food allergies, and what user research methodologies were used to pinpoint the specific user groups that I want to analyze.
What inspired me to tackle food allergies and eating out
Personal Experience:
-
The feeling of being a burden to others.
-
Normally getting food allergies when eating outside.
-
The struggles of handling allergic reactions.
Secondary Sources:
-
There has been 50% increase of people with food allergies in the US
-
Around 60% of people with food allergies in the UK would avoid eating out.
-
Misinformation between the staffers and the restaurant visitors can occur
-
There are social pressures, checking food allergen can been seen as social embarrassment
-
Lower confidence in restaurants ability to properly respond to food allergy emergency
-
Traces of food allergen can still cause allergic reaction.
Screener Surveys
What I want to know
Demographics
-
Experience when eating out positive & negative.
-
Eating Behaviors & comfort levels.
-
Coping with allergic reactions.
-
The severity of allergic reaction.
-
Relationships and trust with food business / restaurant.
-
Ages 19 - 45
-
Has food allergies
-
Has experienced food allergies in the past
-
90% from r/foodallergies
-
10% from friends and family
What I learned
-
More people get food allergies from restaurants than cooking or going to friend's party.
-
They are less likely to try new restaurants or cuisines.
-
A lot more people experience food allergies from eating a dish that they thought was safe.
-
There is a lot more people that feel unsure about the restaurant staffers accommodating their food allergens.
The Interviews
What I want to know
-
How comfortable are you when eating at a new restaurant compared to restaurants that you know?
-
Learn about the methods do you use to prevent food allergies and why do you use it?
-
Tell me about a negative / positive experience that you have when eating out? and why?
Conducting the Interview
-
Total 6 interviews.
-
All the interviews were conducted through Zoom and Discord.
-
Went for a more free-flow approach to interviewing.
-
Only asking specific questions if they haven't covered it yet.
Analysis from interviews & surveys
After conducting the 5 zoom interviews, I have found three major problems that people with food allergies are experiencing.
User Personas
How I ended up with Curtis as my main persona
According the what I have found, there has been a distinct separation between those that have severe allergies than those that have mild allergies; especially in regards to trust and concerns when dining out.
Example Scenario
Here is an illustrated example as to what concerns & frustrations Curtis has to face when going out to eat.
How might we provide people with food allergies the information and option to feel comfortable when eating out?
Brainstorming
Here is where I would show you the process that went through in order to figure out what kind of solution I would provide, and what key features that would serve as an MVP for my app before moving to wireframing.
Sketch Dump
This is an example of the multiple sketches that I did for the sketch dump to see what kind of interesting ideas I can take my design. The amount of grounded to over-the-top ideas were inspired by Design Thinking Ideation process, where I would let loose my creativity. If I choose an exaggerated idea that I liked I can always bring it back to reality down the road.
Exploring the user's journey
In addition to sketch dumping I've also created a few user scenarios that I believe users like Curtis would be in when they feel the need to go out and eat. Some of these scenarios were inspired by the answers that the interviews gave.
The main features and their flows
By looking at both my brainstorming and which scenarios would my users mostly take I have decided on five main features for my design's MVP.
Illustration of how my product would help the user
This is one of the many scenarios that I storyboarded for my presentation in order to help the views understand how product would help the user; for this example is locating which restaurants is the safest to eat.
Wireframing
Digital "Paper Prototypes"
Initially I made quickly "paper prototypes" like wireframes in order to do a quick guerilla test on its usability. To see whether or not I need to make changes such as removing a page or swapping the sequence. Due to Covid 19 restrictions, I ended up using a prototyping website called Maze to do my guerilla testing.
Planed user flows
Heading into the low fidelity wireframes, I've created three separate user flows that encompasses my main features.
Low Fidelity Wireframes
The wireframes below are some of the main pages for each of the flows. The program that I used for both the user flow and wireframes is Sketch.
The Prototype for the Test
Choosing the visuals for the app
Primary Colors:
-
The main choice of color is yellow due to its association with a sense of happiness and optimism, feelings that I want my app to evoke.
Sunset Feel:
-
I was inspired by the sunset colors as it gives an additional relaxation in order to ease the users anxiety with using my app.
-
Additional colors such as using purple as a secondary color and orange as a tertiary color.
Menu Structure:
-
Since my app would have a lot of information I decided to based the usage of color hierarchy off of a food menu.
-
Condensing a lot of information but structuring them in a way that would not visually overwhelm the user.
Style guide
Most of the style guide itself, especially the icon & inputs are building from an Andriod UI kit for Sketch.
High Fidelity Prototype
Usability Testing
In order to know if my app is convenient and easy to use by my target users, I've conducted at least two usability testing, each around 5-6 testers. Most of the testers have food allergies and/or has had a history of food related allergic reactions. I've also tested a couple of people with dietary restrictions due to the lack testers that fit my testing criteria.
Conducting the Test
-
All the test was conducted through Zoom, and have them share their screen for me to see and record.
-
The prototyping tools used for the test is Invision.
-
There are 5 scenarios given to every tester to test our each of the 5 features that I have.
Test Results
In Summary
For the majority of the feedback that I got the testers didn't have a problem with the restaurant menu, review, and onboarding tasks. In fact, the love that the app would give them the the best options available based off of their allergy preferences. Since most of the testers would go straight to the menu when viewing the restaurant, they weren't disappointed when they say that the food was also labelled based off of their allergen preferences.
However the features that they had the most problems with were the location features and landing page, since most of them said that it was difficult to navigate through them in order to achieve the task that was given. In addition, the testers also mentioned that since personalizing the app based off of preference is such as fey feature, why not include personalized filters for the search feature and menu feature as well.
Conclusion
After completing the second usability, test I went backto make further adjustments suc has hidden typos and adding real comments to the restaurant review page. In I have also listed below what I'm thinking of doing for the project in the far future, if I were to continue to work on this project.
What's next for the near and far future
What I learned
Using specific social media groups for surveys and interviews
-
Since this was during a time of Covid 19, going to social media groups like r/FoodAllergies has helped me a lot in getting more people to do my survey and interviews. Some of the characteristics of the persona that impacted my design were inspired by the redditers that I interviewed.
Using UI Design Kits for quick prototyping.
-
The UI design kits shaved off a lot of time when prototyping my wireframes since I designed most of the style guide and wireframes by myself.
Adapting to digital tools for user research and testing.
-
Due to the project being conducted during Covid 19, I learned, from the class I took, how to conduct user research and usability testing on the computer rather than the usual physical research/test.
What I can improve on
Learn to adapt to situations where the testers start randomly clicking on the prototype.
-
I would need to adjust my usability testing transcripts so that I have to let the testers know that its a prototype, "jpeg to jpeg" as I would say, otherwise the testers can get frustrated if they click on buttons that isn't part of the test.
I have to make the prototype as real as possible.
-
The next time I conduct the test I have the remove all text template, as it did cost me valuable feedback on the restaurant reviews simply because I didn't feel the need to add real comments in the prototype.
