Too Good To Go

Helping users with food allergies find the right products while fighting food waste

Role: UX Researcher, UX / UI Designer

Time: Jun. - Jul. 2021

Tools: Figma, FigJam, Photoshop

“I feel left out on this mission.” 🌏

My friend Danielle texted me asking if I wanted a bag of bagels. Knowing she has a gluten-free diet and is always concerned about food waste, I was confused as to why she would purchase something she can't eat.

Seems like TGTG is not so ALLERGY FRIENDLY

By packing up food or ingredients that haven’t sold at the end of the day into a surprise bag and selling them at a lower price on the app, Too Good To Go (TGTG) helps restaurants, bakeries, supermarkets, and more reduce their daily food waste, food that otherwise would have gone unsold or been disposed of.

I talked to 3 other designer friends, hoping we can address this issue through UX strategies and help people like Danielle who have diet restrictions/ food allergies. This way, they too can participate in the mission to promote environmental sustainability.

Research & Interview

Why can’t TGTG have an allergen filter just like other food-ordering apps? Though there are a lot of food ordering apps on the market, the fact that leftovers vary daily, foods aren’t made after the order is placed, and packing them up in a surprise bag at the end of the day makes TGTG unique from other apps on the market.

To better understand the app, my designer friends and I tried out the app by ourselves. We went through the whole process and placed two orders from a bakery and a grocery store. While picking up the orders, we interviewed the vendors for their thoughts on implementing the allergy-friendly features.

“It would be nice if TGTG have this feature, we pick up a lot of calls just asking what is in the bag. It’s time-consuming and tiring.” -Vendor from EIRA

“It seems unpredictable, but there is actually a pattern for what food might become leftovers.” -Vendor from Juicepress

After reading through hundreds of reviews and doing desk research on different platforms, we found that Danielle is not alone.

Synthesize

Through our research, we found the common food allergens and food restriction categories. In America, 32 million people are suffering from allergies, 10.8% of US adults and 7.6% of US children.

Data from AAFA

What limitations does TGTG currently have?

  • Vendors pack surplus food or ingredients into a surprise bag at the end of the day.

  • Vendors received lots of calls about allergy information about the surprise bags.

  • The current Allergen and Ingredients feature does not provide effective information.

  • Users express the will to have a comment feature after confirming pickups.

How might we inform users with food allergies to choose the right products without interfering with the surprise bag nature?

Ideate for Solutions

Existing information architecture

We started drawing down the user flow to better understand the logic of the app.

Segmented user flow

We then further break down the user flow and trying to figure out where we could implement the feature.

Evaluate solutions

Based on the user flow, we identify 3 entry points with a focus on whether to use an allergy survey, allergy filters, or setting up direct messages for users to contact the vendors.

After evaluating the pros and cons, we decided to narrow down to three approaches:

  • Adding allergy-friendly icons on store cards

  • Optimizing allergen filters on the Browse page

  • Showing allergen details on the store information page

Usability testing for Iterations

Since food allergy is a sensitive topic, we want to make sure that the users can properly understand the design and utilize it with no difficulty. We did usability testing with 6 users to settle down for feasible designs, specifically looking at the allergy-friendly icons and allergy filters.

Allergy-Friendly Icons

  • The language is confusing

  • Users might accidentally check the box even if they don’t have an allergen

  • The information is too heavy and disruptive

  • It does not fit users’ intuition

Users can still easily understand without seeing the instructions above

Allergy Filters

  • The information could be too heavy while users are reading other information on the page

  • Hard to adapt to different card element

  • The expanded menu takes up too much space

  • Hard to understand without text

  • Hard to adapt to different card element

· Minimum design
· Scalable for different card element

Wireframes

Final Deliverables

Allergy-Friendly Icon

Users can discover allergy-friendly stores without looking at the store detail page.

Allergy Filters

Users can select ingredients that trigger their allergies. They will be matched with stores that don’t contain those allergens and browse without concern.

Allergen Details in Store Information Page

Users can double-check the allergen detail before they place an order with the store.

Rating & Feedback

After confirming the pick-up, users can rate their experience and leave a comment on how allergy-friendly the vendor is.

We presented the final design to vendors and a couple of our friends, including Danielle. Danielle expressed her will to use TGTG again if the features are implemented in the future. We also got positive feedback from vendors and they strongly wish the feature could be in place one day.

My Takeaways

This project allowed me to speak for a minority group as a designer and fix their concern through UX design. I was able to learn about the information that otherwise would have been ignored by me and consider edge cases.

This is a self-initiated project, so were not able to receive feedback from the company. It makes me realize how important it is to do usability testing when we need support for the design. There is no right or wrong, it is which one works better. The rationale behind the decision is more important.

Moving forward, another design we can work on is the allergen feature on the vendor version. Due to access constraints, we did not have enough information to work on. It would be critical for designers to come up with solutions to create a seamless experience between the vendors’ information inputs and the outputs on the customers’ side in the future.

Design Spec