My Role: UX Designer / Duration: 1 month
Overview
Safebite is a mobile app designed to provide users with easy access to gluten-free restaurants, fast-food chains, and markets near their current location. People with gluten sensitivities or preferences often face challenges when searching for suitable dining and shopping options. Safebite simplifies this by offering a user-friendly platform where users can find nearby gluten-free options, save their favorites, and leave reviews for businesses.
Problem Statement
People with gluten-free dietary needs often struggle to find reliable and trustworthy options when eating out or shopping. Many existing platforms either don't offer specific gluten-free filtering or lack community-driven content, which would give users confidence in their choices. Safebite addresses this gap by providing real-time, location-based gluten-free recommendations, enhanced with user reviews and the ability to save favorite spots for easy access.
Research
To design an effective solution, thorough user research was conducted, focusing on:
User Interviews: Interviewed 3 individuals who follow gluten-free diets due to medical conditions like celiac disease or personal preference.
Competitor Analysis: Evaluated existing restaurant finder apps, focusing on gluten-free options and identified gaps in the user experience, such as difficult navigation and lack of personalized recommendations.
Key Findings:
Users need trustable recommendations when they are in an unfamiliar area.
A streamlined user experience that allows them to quickly find and save gluten-free places.
The importance of user-generated reviews in building trust and community validation.
Personas
Sarah (Age 28, Diagnosed with Celiac Disease)
Needs: Reliable gluten-free options, especially when traveling. She values quick access and verified reviews.
Frustrations: Spending too much time searching through generic restaurant apps for gluten-free spots.
Tom (Age 35, Health-conscious and Gluten-sensitive)
Needs: A simple way to find gluten-free options at fast food chains and markets nearby.
Frustrations: Inconsistent experiences with gluten-free menus at non-specialty restaurants.
User Flow
The main objective was to ensure the user could quickly discover gluten-free locations without unnecessary steps. The app’s core functionalities are mapped around this goal.
Map Screen:
Action: Upon launching, the user sees a map displaying nearby gluten-free restaurants, fast-food chains, and markets.
Key Interaction: Tapping on a business icon brings up more detailed information.
Business Page:
Action: Users can view ratings, gluten-free menu options, and user reviews.
Key Interaction: The “Leave a Review” section allows users to share their experience.
Favorites:
Action: Users can save their favorite places for easy access.
Key Interaction: Places can be added to “Favorites” directly from the map or business page.
Profile Page:
Action: Users can access their personal information, review history, and settings.
Key Interaction: Track reviews written and update user preferences.
Design Approach
The design approach focused on simplicity, with easy navigation and an intuitive interface that aligns with Safebite’s mission: providing users with peace of mind when it comes to gluten-free dining.
Color Palette:
Soft, calming shades of green and blue were chosen to convey trust and reliability. The map uses neutral tones to avoid visual clutter, while gluten-free places are highlighted with a distinctive icon.
#424242 (Dark Grey)
#EAEAFA (Light Blue)
#FF9444 (Orange)
#D4DE1E (Green)
Typography:
Legible sans-serif fonts were chosen for readability, especially important for mobile screens. Important information, such as business names and gluten-free icons, is displayed prominently.
For location purposes, Roboto Condensed was used.
For the most part Roboto was used with it's Bold variations.
Navigation:
The navigation bar includes three primary tabs:
Map: The default screen showing gluten-free options.
Favorites: A collection of the user’s favorite spots.
Profile: Where users manage their personal settings and review history.
Wireframes
Initial designs focused on the structure of the map and business pages. These helped establish the core layout and functionality without getting distracted by design details.
Usability Testing
Objective: Evaluate if users could easily find and save gluten-free options and interact with reviews.
Method: Conducted two rounds of usability tests with 3 participants from different backgrounds who follow gluten-free diets.
Key Feedback:
Some users recommended that favorites should be the first option in fingers reach, If they can't find anything nearby from their favorites, they would love to check the map afterwards.
Some users wanted clearer icons to distinguish fast-food chains from sit-down restaurants.
There was positive feedback on the user reviews feature, with users feeling more confident in visiting a place after reading personal experiences.
Actions Taken:
Improved iconography to distinguish place types on the map.
Changed the orders of the sections of navigation bar.
Final Product
Next Steps
Future improvements include:
Adding a feature for users to upload photos of the gluten-free dishes they’ve tried.
Introducing a notification system for new gluten-free restaurant openings nearby.
Expanding Safebite’s database to include more countries and regions.
Conclusion
Safebite addresses a significant gap in the market by providing a tailored experience for gluten-free users. Its user-friendly interface, community-driven content, and essential features such as map navigation and favorites make it an indispensable tool for those with gluten-free dietary needs. Through research, testing, and thoughtful design, Safebite successfully delivers a solution that empowers users to dine and shop with confidence.