About
Mexican food
delivery app
UX/UI Design Case Study
My role
UX Designer
UX Researcher
Visual Designer
My tools
Duration
June - August 2023
Introduction
Project Overview
Lime Mexican it noffers a fresh take on modern and street-style Mexican food, with tapas-style menus designed for sharing among friends and enjoying across multiple courses. Whether you're craving Mexican delights in the comfort of your own home or looking to have a fiesta at a location near you, Lime Mexican is here to spice up your culinary experience. You can savour our vibrant Mexican flavours with options for takeaway or delivery.
The Goal
The main goal is to design a mobile app for Lime Mexican restaurant that offers a user-friendly interface, simplifying the process of ordering Mexican food. The app aims to provide customers with a seamless and enjoyable experience, ensuring convenience, customization options, and reliable delivery service.
The Lime Mexican mobile app is designed to working professionals and busy individuals who appreciate the convenience of ordering restaurant-quality Mexican food without the need for dining out. It also appeals to families looking for a quick and hassle-free meal option.
The problem
Customers face frustration and dissatisfaction when they are unable to customize their orders according to their individual preferences. Many users desire control over their orders, ranging from the desired level of spiciness to portion sizes.
However, traditional food delivery apps often lack the flexibility to accommodate these customization options, leading to a suboptimal user experience. At Lime Mexican, we aim to address this issue by offering a mobile app that empowers customers to personalize their orders, ensuring a truly satisfying and tailored dining experience.
Empathize
User research
User interviews
Competitive analysis
Define
Personas
Empathy map
Journey map
User story
Ideate
Info architecture
User flow
How might we
Prototype
Wireframing
Visual design
Testing
Usability testing
Implementing feedback
Learn & Analyse
User Research
Learning and understanding the context of problems faced by the grocery shoppers will give insight into what possible outcomes there are for the design.
Empathy map & persona
After user research and analysis, user attitudes and behaviors were assessed which are explained by empathy map and persona. An empathy map is a visualization tool used to articulate what a product team knows about the user, and persona may help to infer what a real person might need.
Competitor analysis
Analyze the market for the presence of existing products, and get a further understanding as to what users might expect and how Fresh Market could improve that experience.
Design & Improve
Information architecture
With IA available, it becomes significantly easier to make key decisions for new features and implementations, to understand timelines for product changes, and to follow user behavior through multiple processes.
User flow
User flows are a great method for segmenting and defining your user experience. They allow you to track what screens users typically see when they interact with a product and how they interact with those screens.
Low fidelity paper sketches
The paper sketches is a necessary part of the design process because it helps convey the information architecture and user flow of an app in a simple way.
Wireframes & UI Iterations
With a solid basis of UX findings, the visual part of the app was designed, such as brand style, UI elements, moodboards, pixel-perfect mockups & design system.
Surveys
Understanding the users
Users research
To ensure a clear understanding of our target users at Lime Mexican, I conducted interviews and developed empathy maps. Through this research, I identified our primary user group as busy working adults who face time constraints, making it difficult for them to dine out or cook at home. However, our findings revealed that various obligations, interests, and challenges hinder their ability to access cooking ingredients or visit restaurants physically. By recognizing these additional factors, we can design our app to cater to their specific needs, providing a seamless and convenient solution for enjoying Mexican cuisine.
User pain points
Limited time
Users often order food because they lack the time or energy to cook due to busy schedules or other commitments.
Tiredness or exhaustion
After a long day at work or when feeling tired, users may prefer to order food rather than going through the effort of cooking a meal.
Convenience
Users seek the convenience of having food delivered to their doorstep, saving them the effort of going out or preparing a meal from scratch.
Cravings
Users may have specific food cravings or desires that they want to satisfy, leading them to order food instead of cooking.
Variety and options
Ordering food provides users with a wide range of culinary choices, allowing them to explore different cuisines and try new dishes.
Occasions or celebrations
Users may order food for special occasions or celebrations to enjoy a hassle-free dining experience without the need for extensive preparation or cleanup.
Diets or preferences
Users with dietary restrictions, allergies, or specific dietary preferences may order food to ensure they can find suitable options that cater to their needs.
Limited cooking skills or resources
Users who lack cooking skills or have limited access to kitchen facilities may rely on ordering food as a convenient and viable option.
Limited ingredients
Users may choose to order food when they have a shortage of ingredients or lack certain key items needed for a particular recipe.
Accessibility challenges
Users with disabilities or limited mobility may face difficulties accessing and using food delivery platforms or navigating the ordering process, leading to barriers in placing their orders and receiving the desired meals.
Avoiding crowds
Some users may prefer to avoid crowded places, especially during peak dining hours, and choose to order food instead.
Weather conditions
nclement weather, such as heavy rain or extreme heat, can discourage users from going out to eat, making food delivery a preferable option.
Research
User Insight
User insight refers to the valuable understanding gained from analyzing user behaviors, preferences, and needs. By delving into user insights, designers can make informed decisions and create products that truly resonate with their target audience, leading to more successful and user-centered solutions.
51.3%
Do you have a preference for homemade food over restaurant food?
76.9%
How frequently do you consume homemade food?
84.1%
Do you have any specific dietary restrictions or food preferences?
Research
Key metrics
67%
Do you have a preference for homemade food over restaurant food?
92%
How frequently do you consume homemade food?
31%
Do you have any specific dietary restrictions or food preferences?
User
Empathy map
By creating an empathy map, I gain valuable insights into user needs and emotions, enabling me to design a mobile app that effectively addresses their pain points and delivers a seamless and satisfying user experience.
Says
"I'm always so busy, I wish there was an easier way to get delicious Mexican food."
"I need to find something quick and convenient for dinner tonight."
"I want to order food that caters to my dietary preferences."
Thinks
"I hope I can find a Mexican restaurant that offers delivery or take-out options."
"I wonder if there's an app that allows me to customize my order."
"I need something reliable and efficient, with good customer reviews."
Frustrated with the lack of time to cook or visit a restaurant.
Anxious about finding a convenient solution for dinner.
Excited when discovering a restaurant app that offers customization and reliable delivery.
Feels
Searches for Mexican food delivery options online.
Compares different restaurant apps to find the most user-friendly one.
Reads reviews and ratings to assess the quality and reliability of the service.
Does
User
User persona
By understanding our target users' needs and preferences, I can design a mobile app that caters to their specific requirements, ensuring a tailored and exceptional user experience.
Sarah Wilson
Age
34
Occupation
Marketing Manager
Education
Macquarie University
Residense
Sydney
Family
Married
Kids
2 Children
Stoty
Sarah is a busy working professional and a loving mother of two young children. Juggling her career and family responsibilities, she often finds it challenging to prepare home-cooked meals every day. She enjoys exploring different cuisines, including Mexican, and wants to provide her family with tasty and convenient dining options.
Motivations
Quality
91%
Speed
72%
Price
83%
Discount
96%
"Family is my top priority, and I want to maximize the moments I have with them by minimizing the time and effort spent on cooking."
Smartphone usage for ordering goods and services has seen a significant increase over time.
Time saved by ordering food instead of cooking or waiting in line at restaurants.
Purpose
Convenience for the family: Sarah wants a convenient and time-saving solution to provide her family with delicious meals, particularly Mexican cuisine, without the need for extensive cooking or dining out.
Variety and nutrition: She seeks access to a diverse menu of Mexican dishes that cater to both her and her children's preferences, ensuring they have balanced and flavorful meals.
Customization: Sarah appreciates the ability to customize orders to accommodate her children's dietary restrictions and any specific allergies they may have.
Family-friendly experience: She desires a user-friendly app with a simple ordering process and an interface that is intuitive for both herself and her children.
Timely delivery and tracking: Sarah expects reliable delivery with accurate tracking, ensuring that meals arrive promptly.
Scetches
Storyboard
This storyboard provides a visual narrative that captures Sarah's experience over time, offering valuable insights into her preferences and guiding us in creating a tailored and memorable dining experience.
Sarah busy at work and she need pick up her kids from after school care and sport. She frustrated because she don’t have time to cook dinner for her family.
Sarah decided to order food. She download Lime Mexican mobile app and discover it.
One of Sarah kid has allergy on gluten and she want vegetarian food. She happy that all food in the app marked with ingredients and gluten free labels.
Sarah order food for her family and simply check out
Sarah can monitor progress of delivery on the app.
Sarah happy and enjoy Mexican style dinner with her family.
Research
Competitors audit
By conducting a competitive analysis in UX design, I was able to assess the strengths and weaknesses of competitors. This valuable insight enables me to identify areas of opportunity and inform the design process, ensuring a competitive and user-centric experience.
Features
Restaurant Range
Coverage Area
Order Customization
Delivery instructions
Delivery Options
Live Order Tracking
Promotional Offers
User-friendly UI
UX Design
Rating
Review
Personalization
Filtering
Payment Options
Dark Mode
Accessibility
Customer Support
Uber Eats
Wide variety
Nationwide
Customizable options
Various
Deals and discounts
Intuitive layout
Recommendations
Credit card, PayPal
WCAG 2.0 compliance
Menulog
Extensive selection
Nationwide
Special requests
Various
Promotions
Easy navigation
Preferred restaurants
Multiple options
Accessibility options
Deliveroo
Curated options
Major cities
Add-on ingredients
Various
Exclusive discounts
Seamless browsing
Food preferences
Various payment methods
Accessible features
DashDoor
Local favorites
Limited cities
Limited customization
Various
Limited
Simplified ordering
Limited
Limited
HungryPanda
Asian cuisine focus
Limited cities
Customizable options
Various
Exclusive deals
Visually appealing
Cuisine preferences
Various payment methods
Limited
Path
User flow
Based on the data collected from my research, I have developed a user flow that served as the foundation for creating wireframes and a prototype. This user flow allowed for testing and validation with users, ensuring a seamless and user-centric design.
Path
User journey map
I have created a comprehensive journey map for Sarah, to visualize her experience from initial awareness to post-purchase interactions. This journey map serves as a valuable tool to identify feeling and emotions, ensuring a seamless and satisfying journey for customers.
Phase
Define
Exploring
Research
Order
Tracking
Receiving order
Feedback
Action
Discovering the app
Browsing & exploring
Selecting & customizing
Placing the order
Order tracking & updates
Delivery & enjoyment
Providing feedback & ratings
Tasks
Sarah learns about the Mexican restaurant delivery app through online advertisements or word-of-mouth recommendations.
She downloads the app, log in or sign in and choose pick up or delivery her order
Sarah opens the app and is greeted with a visually appealing home screen featuring enticing Mexican food images.
She navigates through the menu sections, exploring different categories like appetizers, main dishes, desserts, and beverages.
Sarah filters the menu based on her preferences, such as vegetarian options or specific dietary requirements.
Sarah selects the items she wants to order, adding them to her virtual cart.
She customizes her order by adjusting spice levels, selecting toppings, or making special requests to accommodate her dietary preferences or her children's allergies.
Sarah reviews her order, ensuring everything is accurate, and proceeds to the checkout.
Sarah selects her preferred payment method, such as credit card or mobile wallet, and provides the necessary details.
She verifies the delivery address and chooses a delivery time that works best for her and her family.
Sarah places the order and receives an order confirmation with an estimated delivery time.
Sarah tracks her order in real-time through the app, keeping an eye on its progress from preparation to delivery.
She receives updates on the app regarding the order's status, including when it's being prepared, picked up by the delivery driver, and estimated arrival time.
The delivery driver arrives at Sarah's doorstep with the food order.
She receives the order, checks its accuracy, and thanks the driver.
Sarah and her family enjoy their Mexican meal, savoring the flavors and convenience of having it delivered to their home.
After the meal, Sarah receives a prompt to rate her experience and provide feedback on the app and the quality of the food.
She shares her feedback, highlighting any positive experiences or areas for improvement.
Sarah may also consider leaving a review on the app store to share her overall satisfaction with the Mexican restaurant delivery app.
Feeling
Excitement: Sarah feels excited about the prospect of discovering a Mexican restaurant delivery app that offers convenience and a variety of food options.
Curiosity: Sarah becomes curious as she explores the app, eager to discover new dishes and flavors that align with her preferences.
Delight: Sarah experiences delight when she comes across her favorite Mexican dishes or finds unique and creative menu items.
Confused: with the variety of categories and food types because they used Mexican names
Empowerment: Sarah feels empowered as she selects the items she wants to order, customizing them to her taste and dietary requirements. The ability to personalize her order enhances her sense of control.
Convenience: Sarah appreciates the convenience of being able to place her order seamlessly and efficiently through the app, saving her time and effort.
Anticipation: As she confirms her order and receives an estimated delivery time, Sarah feels a sense of anticipation for the upcoming meal.
Reassurance: Real-time order tracking and updates provide Sarah with a sense of reassurance and peace of mind, knowing where her order is in the delivery process.
Excitement: As the order progresses and gets closer to delivery, Sarah's excitement builds, looking forward to enjoying her meal.
Satisfaction: When the delivery driver arrives with the order, Sarah feels satisfied with the convenience and timely arrival of her meal.
Happiness: Sarah and her family experience happiness and enjoyment as they indulge in the Mexican cuisine from the comfort of their home.
Engagement: Sarah feels engaged and appreciated when given the opportunity to provide feedback and ratings on her experience. It gives her a voice and the chance to contribute to the improvement of the app.
Emotions
Excited
Curiosity
Confused
Convenience
Worried
Satisfied
Engagement
Improvements
Two-Factor Authentication: Implement a two-factor authentication system to add an extra layer of security during the login process. This can involve sending a verification code to the user's registered mobile number or email address for authentication.
Kid-Friendly Section: Create a dedicated section within the app that specifically caters to kid-friendly Mexican dishes. This makes it easier for Sarah to find options that her children will enjoy and encourages family ordering.
Personalization Options: Expand the customization options to include additional preferences like portion sizes, additional toppings, or ingredient substitutions. This allows Sarah to tailor her orders precisely to her and her family's preferences.
Introduce loyalty programs, promotional offers, or discounts for frequent users to encourage customer retention and repeat orders.
Real-Time Order Tracking Enhancements: Enhance the order tracking feature by providing more detailed updates during each stage of the delivery process. This includes notifications when the order is out for delivery and estimated arrival times.
Smoother Checkout Process: Streamline the checkout process to make it quicker and more intuitive. Minimize the number of steps required for payment and ensure a seamless transition from customizing the order to completing the purchase.
Courier rating and Integration: Allow Sarah to provide feedback within the app after receiving her order. This could include a rating system, review option, or a simple feedback form to gather insights and address any issues promptly.
Scetches
Paper wireframes
Wireframes serve as a comprehensive visual representation that effectively showcases the page structure, layout, architecture, flow, functionality, and behaviors of the design. They play a vital role in conveying the intended user experience and aiding in the collaborative design process.
wireframing
Low-fidelity prototype
Low-fidelity prototype was created to explore and test mobile app's prototype and functionality. This simplified version allowed quickly iterate on ideas and gather feedback before delving into more detailed development.
Interactive
High-fidelity prototype
The final prototype showcased improved user flows for ordering food and a seamless checkout experience. It successfully fulfilled user needs by offering pickup or delivery options and enhanced customization capabilities.
Guidelines
Design System
Spacing
Grid
Design
Home Screen
The homepage of the mobile app encompasses essential functions for users, allowing them to easily switch between delivery and pick-up options, explore various categories of food and beverages, and stay updated with enticing offers and promotions.
Food card
Food cards visually showcase and inform users about various food options, simplifying the browsing and selection process
Shopping Cart
The shopping cart feature allows users to conveniently add and manage their selected items before proceeding to checkout.
Order status
The order status feature provides users with real-time updates on the progress of their orders
Category
Users have the flexibility to choose category of desired Mexican food when selecting food options
Popup menu
convenient way to explore different categories of food and beverages, providing them with a seamless browsing experience and enabling them to quickly find their desired items.
Category
Order status
The order setup feature allows users to conveniently set their delivery address and choose a preferred delivery time, providing them with flexibility and control over their order fulfillment.
The list of restaurants is automatically sorted by distance, ensuring that users are presented with nearby options for a more convenient and efficient selection process.
Do you have a food allergy?
If you have a food allergy or intolerance
(or someone you are ordering fo has), phone the restaurant +61 248 454 545.
Do not order if you cannot get the allergy information you need.
Close
Order checkout
My design focuses on creating a simple and streamlined order checkout process. By minimizing unnecessary steps and incorporating clear and intuitive navigation, users can quickly and effortlessly complete their orders. The user interface ensures a seamless experience, allowing users to review their selections, enter payment information, and confirm their order with ease. With a strong emphasis on simplicity and ease-of-use, the checkout process enhances user satisfaction and encourages repeat purchases.
Log in /Sign up
I've optimized the registration form to be user-friendly by minimizing it to just three input boxes. This simplified approach is expected to significantly increase the sign-up rate. By reducing complexities and keeping only essential fields, we aim to make the registration process quick and straightforward, encouraging more users to complete it seamlessly.
Signup details
Sign up with social
media accounts
Design
Accessibility considerations
Screen Reader Support
Ensure that your app is compatible with screen readers. This involves providing appropriate labeling for UI elements, supporting accessibility attributes, and ensuring that all important information is conveyed through text.
Adjustable Text Size
Allow users to adjust the text size within your app to accommodate those with visual impairments or difficulties reading smaller text. Provide options for enlarging or scaling the text without compromising the overall layout or functionality of the app.
Color Contrast
Use sufficient colour contrast between text and background elements to make content readable for users with visual impairments.
Clear Navigation and Controls
Ensure that app has clear and intuitive navigation, making it easy for all users to understand and operate. Use standard UI controls and avoid relying solely on gestures or complex interactions that may be challenging for individuals with motor impairments.
Keyboard Accessibility
Support for keyboard navigation, allowing users to navigate through your app using only keyboard input. This is essential for individuals who have difficulty using touchscreens or rely on alternative input methods.
Alternative Text for Images
Include alternative text descriptions (alt text) for images within your app. This helps users with visual impairments understand the content and context of the images through screen readers or other assistive technologies.
Focus Indicators
Ensure that interactive elements, such as buttons and links, have clear and visible focus indicators. This helps users who rely on keyboard navigation to understand where they are within the app and easily navigate through different elements.
Clear and Simple Language
Use clear and simple language throughout your app to ensure comprehension for users with cognitive impairments or learning disabilities.
Takeaway
Going Forward
Challenge
Overcoming the time constraint in this individual concept project posed a challenge, limiting extensive research. However, I managed to strike the right balance, creating an app that significantly impacts users' daily lives. The chosen problem resonates with people in various ways, making it relevant and compelling.
Learnings
Designing the Mexican Food Delivery App taught me that initial ideas are just the beginning. Conducting usability studies and feedback from peers, I iterated on the app's designs, continuously improving the user experience.
The extensive workload involved in the project taught me valuable lessons in time management and task prioritization. Through careful planning and efficient organization, I effectively managed my time, ensuring that crucial tasks were given the necessary attention. This experience enhanced my ability to work effectively under pressure and maintain a strong focus on delivering high-quality results.
Next steps
Moving forward, the plan is to gather more feedback, explore different use cases, and brainstorm additional features based on the user insights. The goal is to further enhance the app's functionality and ensure it meets users' evolving needs.
Thank you for your attention
Contact me
komaris@gmail.com