UberEats Health Mode





An UberEats redesign for gym lovers featuring the new “health mode” function.

2022



︎︎︎ Partial collaboration with Jasmin Liang, Carla Pan
︎︎︎ My role: Concept development, Research, Wireframe, Prototype, Marketing materials


︎︎︎ Duration: 4 weeks


︎ Figma
︎ Adobe Illustrator

︎ Adobe Photoshop


︎Challenge



Choose an app you are familiar with and understand current user base. Come up with a completely different type of user that would still use this type of app (forget about commercial viability).


︎App and Target user

The app we chose is UberEats and gym lover/healthy food lover is our target user. People who work out tend to cook on their own and take the extra time to do meal prep because they need to eat based on certain diet. Therefore takeout is usually not the best option for them. We want to redesign a food delivery app like UberEats and introduce a new health mode function that offers customized fitness diet plan for gym lovers/healthy food lover.
︎Research and Survey

We compiled a series of questions and ran a fitness diet and food delivery apps user survey.


︎Persona

Based on the survey result, we generated a user persona.
︎Low-fid Prototype

We put together a low-fid prototype for the first round of playtest.
︎Initial Playtest

We did a 2 hours user testing session with our low-fid prototype.
︎Initial Feedback

These are the feedback we got after the playtest.


︎Mid-fid Prototype

After the feedback, we made changed to our design and generated a mid-fid wireframe for further testing.

Survey

Restaurant and Order
Check Out

︎Second Feedback

These are the feedback we receive about the second round of playtest.


︎Style Guide
︎Final Prototype - survey

This survey page is for the users to set up a profile and customize based on their diet needs.

︎Final Prototype - health mode toggle

After entering the main page, the notification guides the user to a button that can toggle on and off the health mode. When the health mode is on, the app will provide with filtered recommendation of healthy restaurants and dishes.


︎Final Prototype - restaurant and order

When entering a restaurant page, there are calory count displyed for each dish. More detailed nutritional infomation are also provided when selecting a certain dish. In addition, the user can also see a nutritional information overview of all the items selected in the cart before check out.

︎Final Prototype - checkout

When checking out, the user can see the daily remaining calories at the top and also a more detailed report of diet plan generated based on the survey. Calory information is also provided on the receipt in addition to price.