Gaston - Steakhouse app
Tools
Role
Research, Ideation, Visuals, Prototyping
Timeline
15 weeks
Type
Mobile Application
Project Background
Gaston is an app for a steakhouse restaurant that will attract and retain its customers offering a different experience for all users.We’re creating Gaston’ s app to attract and retain customers in our online system. We noticed that our competitors offer dedicated mobile apps for their customers to navigate through, and they have been very successful. We want to create a product that can compete in the market and increase customer satisfaction.
The existing steakhouse apps are consisted of the same characteristics, many details and don’t offer a navigation that is easy, simple in a special way.
The problem
Design a steakhouse app which includes simple and fast navigation.
The Goal
Design Process
Empathize
User Interview
Personas
Pain Points
Define
User stories
User journey
Compeitive analysis
Ideate
Information architecture
Paper wireframe
Iterate design
Prototype
Low - fi wireframes
Hi - fi
wireframes
Usability
testing
Test
01 - EMPATHIZE PHASE
Unmoderated Usability Study
Research Questions
● How long does it take for a user to check the menu and make a
reservation in the app?
● Are users able to successfully check the menu quickly without many
details?
● What can we learn from the steps users took to check the menu?
● Are there any parts of the menu checking process where users are
getting stuck?
● Is the reservation process easy for the customer?
Personas
With the data I collected, I from the umoderated usability study, I created 2 personas, representing 2 different types of users.
User research: pain points
Simplicity
Users need simplicity using an app with few movements.
Navigation
The navigation should be consisted of “easy flow.”
Navigation
The navigation should be consisted of “easy flow.”
03 - IDEATE PHASE
Paper Wireframes
Taking the time to draft iterations of each screen of the app on paper ensured that the elements would be well-suited to address user pain points. In the home screen, I prioritized a quick and easy option to make a reservation in order to help all users save time.
Digital Wireframes
04 - PROTOTYPE PHASE
Low - Fidelity Prototype
Usability Study:Findings
I conducted two rounds of usability studies. Findings from the first study helped me to refine global wireframe design such as buttons, icons and the second one helped me to go even further on a final product such as accessibility and flow simplification.
Round 1 findings
Users want to check the menu quickly.
Users want simple options in apps.
Users want a simple way to view details.
Round 2 findings
Users need a confirmation page as a last step in order to make a reservation.
The initial flow was confused.
The user flow should be more “attractive” for the user.
05 - TEST
Mockups
Usability studies has emphasized different user roadblocks and needs for evolution.
I added the bar “Make Reservation” on the top of the screen which appears only in the first step to book a table in order to be easily recognised as the first step for the user.
After usability study the option “cancel” was added and the hours available were separated into buttons.
The final high-fidelity prototype presented a navigation consisted of "easy flow".
Final Look
Take - Aways
Impact:
The app makes users feel that this steakhouse app really thinks about how to meet their needs.
A quote from peer feedback: “The app has made it so easy and fun to make a reservation in a steakhouse.”
What I learned:
While designing this steakhouse app, I learned that the first ideas for the app are only the beginning of the process. Usability studies and peer feedback influenced each iteration of the app’s designs.
