Problem
My client owns a burger joint and uses third-party delivery services like Uber Eats and DoorDash. Although these services bring customers but they charge high fees, impacting both profits and customer costs.
Solution
Develop a custom e-commerce website where customers can order directly from the restaurant, bypassing third-party fees and saving money for both the business and its customers.
Role
Research, UX, UI
OVERVIEW
This project aims to create a simple, mobile-friendly website for my client’s restaurant. It will allow customers to browse the menu, place orders, and make secure payments directly, cutting out third-party fees and improving the overall experience.
THE PRODUCT
The new product will offer customers an easy and enjoyable way to order without hidden fees, so they can stay within their budget. It will also help my client save money by eliminating the commissions paid to third-party delivery services, allowing the business to keep more profits.
RESEARCH
As the eCommerce market continues to grow steadily year-over-year, understanding consumer expectations is essential for profitable growth.
User Interview
For this project, I interviewed five individuals to understand their food ordering habits. This included three college students who frequently order food online due to dorm living and two working-class employees who prioritize ordering meals within a budget.
What did we learn?
Based on the data collected, I found that consumers are frustrated by hidden fees at checkout, often as high as the food price itself. They prefer shopping from places with clear, upfront pricing and no unexpected costs. Additionally, they showed strong interest in a rewards system, where they can earn points with each purchase and redeem them for free products.
Flowchart
These user and task flows help me hypothesize how users will navigate through key screens, ensuring a smooth and intuitive journey throughout the website.
Scope
85 hours self paced
Understanding Consumer Preferences
in the Online-Driven Market
70%
of customers prefer ordering food online.
40%
of customers prefer to order through the restaurant’s app or website
13%
of customers use third-party apps to place a delivery or takeout order.
Market Research Insights
Through my research, I discovered that most consumers prefer ordering food online rather than visiting the restaurant. They also don’t want to pay more than five dollars in fees when using third-party platforms. Additionally, the data shows a strong preference for ordering directly from the restaurant’s website instead of going through third-party services.
Competitor Analysis
To develop the best solution, I conducted a competitive analysis of both direct and indirect competitors in the food delivery space. My focus was on identifying their unique value propositions, strengths, and weaknesses to inform a solution that addresses gaps and maximizes opportunities for my client.
Key Takeaways
01
Participants prioritize easy navigation and a straightforward ordering process.
02
Three out of five participants are unwilling to pay hidden fees added at checkout.
03
Most participants are interested in a rewards points option to earn free items.
04
Most participants are likely to return to a website that offers exclusive discounts or promotions.
Affinity Mapping
What did we learn?
I discovered that customers highly value a fast, seamless, and user-friendly online ordering experience. They particularly appreciate features like a rewards system and real-time order tracking. Many also shared their frustration with hidden fees on third-party apps like Uber Eats, showing a strong preference for clear and upfront pricing.
Feature Set
After further research into user personas, I focused on identifying my user’s core needs and developed the feature set based on those insights.
The prioritization allowed me to focus on delivering the most essential features first, while keeping future improvements in mind.
Sitemap
Task Flows:
Wireframes
The lo-fi design was created with a strong focus on user needs, guided by the insights gathered from my research. I prioritized features like easy navigation, a rewards system, and order tracking to address key pain points. This design serves as a foundation for a simple and intuitive user experience, ensuring that the website meets user expectations effectively.
Branding (Typography, Icons, and Buttons)
I kept the client’s existing restaurant logo to maintain brand consistency. Using the logo's colors,
I developed a color palette that complements their style and enhances the overall look of the website
All Screens
The following screens highlight the overall look and feel of the website, incorporating features that users will appreciate. The first set showcases desktop screens, while the other two sets focus on mobile screens. Using insights gathered from the research, I created a design layout that aligns with my client’s restaurant style and enhances the user experience.
View project
Usability Testing
I conducted usability testing with five participants to gather feedback on the design and functionality of the website. My objective was to evaluate how effectively users completed the tasks, identify any errors, and prioritize user feedback for improvements. The results as follows:
01
Participants loved the color choices and the overall look and feel of the website.
02
One participant mentioned that there was no clear indication when an item was added to the cart.
03
Four out of five participants raised concerns about the image sizes on the homepage, noting that some were not properly aligned.
04
One participant noted that the color of the "closed" text in the footer drew too much attention compared to other elements.
05
Most participants found the term "to unlock" unclear and were unsure about its meaning or purpose.
06
Three out of five participants had difficulty locating the “Track Order” button on the website.
Eisenhower Matrix:
Before & After
After testing the product on the participants, I addressed the solutions to improve the design based on users feedbacks.
What did I learn?
From the feedback, I learned the importance of clarity, consistency, and accessibility in design. Clear labels and intuitive navigation are crucial. Also, Visual elements such as text colors and image alignment also significantly impact user perception, emphasizing the need for a polished and cohesive design.
Next steps...
01
Add more pages to the website to enhance its usability and functionality for users.
02
Incorporate a review system where users can share their feedback, helping the owner make improvements based on customer experiences.
03
Integrate a 'Chat Support with Merchant' feature into the app.
User Persona
I created the user persona based on insights from interviews and affinity mapping. This process helped me define clear problem statements, making it easier to focus on building the right solutions for the website. It also ensured the design aligns with the needs and expectations of the target users.