Natures Way Cafe
Mobile ordering application
This application is made for a hypothetical cafe that brings a mobile ordering experience to their customers.
This was a solo project done in a Google UX Design course of 15 weeks.
The Final Mockups
Introduction
Nature’s Way Café is a welcoming restaurant that blends healthy living with delicious meals. From refreshing smoothies and nutritious salads to wraps and daily soups, we offer a diverse menu to accommodate various dietary preferences.
The Challenge
As the UI/UX Designer, my goal was to modernize the outdated website and make it more engaging for customers. The main challenge was creating a site that was visually appealing, easy to navigate, and effectively communicated the café’s dedication to healthy living.
The Goal
The redesign focused on clean, bright visuals that highlight the café’s use of fresh ingredients. The updated layout features intuitive navigation and clear call-to-action buttons, making it easy for customers to place online orders or visit the café.
Pain Points
After interviewing 4 participants I identified 3 pain points that they expressed:
1
It can be intimidating to try new items, especially if the menu is unfamiliar to them.
2
Lack of personalization.
Which can limit their ability to tailor orders according to their individual preferences
3
Limited amount of menu information. Which may exclude users that may have dietary restriction
Secondary Research
My research object is to understand better the competition and what makes their app successful, or evaluate how they can be better. Click on each arrow to see the key points based on reviews on the app store an data insights.
Starbucks
I chose this company because of their high success in mobile ordering application usage and better understand how they are able to design features to build more digital engagement.
Chiptole
I chose this company because of their personalization features for ordering food. My goal is to gather insight on their strengths and weaknesses to improve the customization functionalities.
The Personas
From here on out, we will be referring to these two personas which represents our target users.
Coming up with a Solution
.png)
My Initial Designs: Usability Studies
This was the first working prototype, which I tested with my participants.
This is where i found that my design had several issues.
3
Most found the expanded menu items on the menu page to be confusing. They thought the full length menu items represented specific food categories. (Salads, Sandwiches, Smoothies)
1
They liked being able to select/deselect ingredients. However when they wanted to revert their changes they were not able to do so.
2
All of them had issues with the payment method.
Once they are ready to check out and put their order information. All of them did not understand that they needed to swipe up to
Impact
After showing the designs again to several new users among my previous ones. All of them were impressed with the the mobile ordering app.
They were able to navigate through the design with ease, and can see themselves using a application like this in the future.
Key Learnings
I learned a lot about designing with Figma, and experiencing the 5 stages design thinking.
What I would do if I had more time:
For users like Alex, I would want to build more functionalities that would make it easier for him. One example of this, is a feature to order ahead of time. To contribute to the users who are not familiar with using mobile ordering applications, I would also like to provide more animations and popups that help guide them through the mobile ordering process.
Some of the Tech I used
- TypeForm for surveys
- Google Docs for documentation of progress
- Figma for UX design and prototyping
- UnSplash for royalty free images.