Mobile App
UI/UX Design
Lead UI/UX Designer
3 Months
A food delivery and take-out app that serves as a platform enabling diners to choose optimal meals tailored to their preferences through the app’s customization features.
User Research
Wireframing
Prototyping
User Testing
Design
Individuals seeking food delivery and take-out services encounter challenges related to efficiency and health consciousness. Current apps often lack streamlined processes and fail to offer sufficient health-focused options, indicating a need for improved platforms that prioritize convenience and nutritional choices for a diverse user base.
“It's tough to check all these restaurants and menus every time to ensure they fit my health preferences, especially with how busy my schedule is.”
• Limited personalization
• Overwhelming choices
• Lack of health focus
• Complex ordering process
• Limited social interactions
• Inadequate information
Onboarding & questionnaire user flow
Group cart, adding items to cart & checkout user flow
Balanced Bites is a food delivery and take-out app designed to elevate the dining experience. Committed to delivering personalized services, the app caters to the distinctive preferences and nutritional needs of each user. It redefines the food delivery landscape by prioritizing personalization, health consciousness, and enhanced social interactions.
“I like how each meal had their own nutritional facts and showed more than just calories - no other app really does that.”
• Tailored dining experience
• Adaptability to dietary needs
• Informed choices
• Streamlined and time-efficient
• Convenience in group orders
• Enhanced social experience
Our target audience are health-conscious individuals, typically within the age range of 20-50.
These users value dining experiences that are personalized and nutritionally tailored to their needs.
We conducted user interviews to create a more detailed study of the user’s eating habits as well as their wants and needs.
How frequently do you use food delivery and take-out apps?
How often have you faced difficulties in finding nutritious or diet-specific meals on these apps?
How often do you order for more than just yourself?
How often have you utilized group ordering features on delivery apps?
Inefficiency
• Time constraints
• Complex ordering process
• Ineffective search filters
• Inadequate nutritional information
• Overwhelming choices
Lack of variety
• Limited cuisine diversity
• Monotonous selections
• Absence of specialized diets
• Inflexible customization
Inefficiency
• Low-quality food imagery
• Limited visual information
• Non-intuitive image placement
Efficiency: Uber Eats and DoorDash excel in quick food delivery, while HelloFresh and Freshii prioritize convenient and health-conscious options
DoorDash...
• Had no dietary filters, except one generic filter labeled “healthy”
Variety: DoorDash and Uber Eats offer a wide array of restaurant choices, whereas HelloFresh and Freshii focus on curated, healthier selections
Uber Eats...
• Dietary filters only included: vegetarian, vegan, gluten-free, and halal
Uber Eats & DoorDash both...
• Offered a wide variety of filters in cuisine, but were limited in customization options for specialized diets
• Lacked detailed nutritional information
HelloFresh...
• Requires meal preparation and has limited restaurant-style variety
Freshii...
• Has limited geographical presence, and may not offer traditional restaurant delivery (deliveries through third party apps)
Customization: Uber Eats and DoorDash offer extensive customization, while HelloFresh and Freshii provide predefined customizable healthy meal options
Health focus: HelloFresh and Freshii emphasize nutritional transparency and health-conscious choices, providing alternatives to traditional fast food
Jade, a working professional and mother, seeks efficient and health-conscious food delivery for her and her family. She and her husband juggle cooking responsibilities but finds it challenging during busy times. Jade desires the convenience of ordering nutritious meals on the go.
Onboarding, questionnaire, adding items to cart, group cart & checkout user flow
We conducted two usability studies that addressed the sign-in process, questionnaire feature, group cart feature, and check out stages, refining our initial lo-fi designs through multiple iterations. Here, you can compare the initial lo-fi prototype (on the left) with the final lo-fi prototype (on the right).
Implement clear and visible confirmation messages for completed actions
Redesign the group cart interface with clearer guidance and navigation
Simplify the checkout and reduce the number of clicks required in order to reduce inefficiency
Optimize the browsing experience by ensuring a seamless flow between browsing and adding items to cart
swipe to see
• Added “Previous & “Next” buttons to inform users about their navigational choices
• Included a “Finish” button to notify users when the questionnaire is complete
• Emphasized "Congrats" by making it bold and using a larger font size to draw attention to the successful completion of task
• Shifted the option to initiate a group order to the restaurant menu interface, eliminating the need for users to first navigate to their cart to initiate one
• Added a QR code for convenience in mobile app users
• Enhanced the group order functionality by enabling collective and individual payments, setting a spending limit per person, and introducing a group order chat feature
• Reduced the number of clicks for completing the checkout process, including address and payment options
• Reduced interface to two screens instead of three
• Added a toggle for users to easily switch between delivery and pickup options
• Changed the navigation flow so that when users click the "Add to cart" button, they are directed back to the menu item list instead of directly to the cart page
• Users can navigate to their cart through the floating navigation bar, ensuring control and a seamless browsing experience without any unexpected elements or pop-ups
Check out the interactive high fidelity prototype below! (Best viewed in full screen mode)
• Getting started
• Profile setup
• Location
• Questionnaire
• Deals of the day
• Categories
• Top restaurants
• Profile catered to user's health conscious and dietary preferences
• Nutritional info
• Price
• Add to cart
• Link or QR code
• Pay together or separately
• Spend limit
• Group chat
• Check out
• Payment
• Tracking
Our target users recognized the value of the app, particularly appreciating features like the dietary questionnaire and nutritional data for each menu item. This increased their confidence in making food selections not just for themselves, but for their families as well.
Being my first UI/UX design project, I have learned the importance of continuous iterations in the design process, emphasizing the need to remain open-minded for potential improvements via feedback. Prioritizing accessibility has also shown me how it broadens user reach and enhances overall user experience.
Lastly, I've learned to be more adaptable and recognize design involves multiple iterations at every stage. It's easy to become fixated on one aspect of the design that you lose sight of the bigger picture! Sometimes, it's better to finish a task rather than pursue perfection, because it can always be revised later on.
“Really like the group order feature and how specific you can get with the personalization in the questionnaire.”
- Participant A
Iteration never stops and a product can always be improved. Being that this is a student project, here are some steps I would take if this was a real world project:
• Conduct additional usability tests to validate design decisions, identify any new challenges, and gather feedback for overall improvements of the product
• Explore potential new features that are essential or could differentiate the app and enhance its appeal in the market
• Design a feature allowing users to save multiple dietary preference profiles, making it simple for them to choose what suits their tastebuds whenever they want
• Consider adding dietary symbols alongside the menu options
• Integrate additional accessibility features to ensure the product is fully functional and user-friendly for a broader range of users
