Trem Velho

Restaurant Grill & Bar

Brand:

Trem Velho

Project:

Mobile app for take-away orders and reservations

Responsability:

UX Design | Webdesign

Summary:

TremVelho is a restaurant founded in 1973 located in downtown Cascais opposite the beach. It serves Portuguese food, grilled meats and shrimp specialties. Customers reserve their table via telephone and also have the possibility to place their orders for Take Away.

Project Overview

The product:

Trem Velho is a restaurant founded in 1973 located in downtown Cascais opposite the beach. It serves Portuguese food, grilled meats and shrimp specialties. Customers reserve their table via telephone and also have the possibility to place their orders for Take Away. The target customers are middle-class, upper-middle class, and young people, who work late, with no time to prepare their own meals.

Project duration:

May/21 to Jul/21

The problem:

People are ordering via phone, or in person on arrival at the restaurant, being forced to wait for the order to be ready. As the restaurant is very busy on some days of the week, receiving orders via telephone is complicated, causing a series of errors and misunderstandings. Also, large foreigner community in the village.

The goal:

The goal is to create an App in 2 languages, Portuguese and English that allows users to place the order, give an estimated time for completion and let the customer know at what time they can collect the order. Also, an app to reserve a table at the restaurant.

My role:

UX designer, designing an app for TremVelho –Restaurant Grill & Bar, from conception to delivery.

Responsabilities:

Conducting interviews, paper and digital wireframing, low and high-fidelity prototyping, conducting usability studies, accounting for accessibility, and iterating on designs.

Understanding the user

User Research – summary:

I’ve conducted unmoderated interviews and created empathy maps to understand the users I’m designing for. The first group of users identified through the survey were adult workers with no time to prepare their meals.
This group of users ended up confirming the initial assumptions, but came to reveal that the factor of not having time to cook at home is not the only one. People also order on their breaks and weekends and want to book their table at the restaurant more easily.

Time

Working adults are too busy to spend time preparing meals.

Contact

They want to order for pick-up on the way home, or reserve a table but not by phone.

Accessibility

Most of foreigner clients want to know what they are ordering.

IA

Text-heavy menus in apps and lake of images are often difficult to order from.

Persona: Lara

Problem statement:

Lara is a doctor at local hospital who needs to order food in English and visualize the meals because she is part of the large foreigner community in the village.

User journey map:

Mapping Lara’s user journey revealed how helpful it would be for users to have access to a dedicated TremVelho’s Ordering and Reservation app.

Starting the design

Paper wireframes

Initially, each application screen was draft on paper in order to ensure that the elements that will be digitally produced are aligned with the pain points. It was prioritized a quick and easy ordering process as well a reservation process to help users save time.

Digital wireframes:

During the initial phase, I made sure to base screen designs on feedback and findings from the user research.

Easy and clear navigation was a key user need to address in the designs, since we have two different services in the app, Ordering and Reservations.

Low fidelity prototypes:

Built a complete set of digital wireframes for a low fidelity prototype. The first prototype was making a reservation and ordering meals for take away, so the prototype could be used in a usability study.

ViewtheTrem Velho’s

Low fidelity prototype

Usability study: findings:

I conducted two rounds of usability studies. Findings from the first study helped guide the  designs from wireframes to mokups. The  second study used a high-fidelity prototype and revealed aspects of the mockups needed refining.

Round 1 findings

  1. Big images of the meals
  2. Pick dates from a calendar
  3. Simple checkout

Round 2 findings

  1. Able to change pickup time
  2. Map to easy drive to the restaurant

Refining the design

Mockups

Additional options to pick date and time were added after the usability study.
Design was reviewed in order to clear indicated
how to function with app.

The second usability study revealed frustrations for not being able to change the pickup time. So
was inserted a way to choose a convenient pickup time for the user.

Hight-fidelity prototype

The final high-fidelity prototype presented cleaner user flows for making a reservation as well to
order a meal. It also met user needs for a change reservation and change pickup time.

View Trem Velho

Hight-fidelity prototype

Accessibility considerations

Provide access to users who are vision impaired throught adding alt text to images for screen readers.

Used icons to help make navigation easier.

Used imagery of all meals to help all users to better understand what they are ordering.

Going forward

Takeaways

Impact

The app makes the users feel like Trem Velho really thinks about how to meet their needs.

What I learned

While designing the Trem Velho app, I learned that usability studies are the key for a good work.

Next steps

Let’s connect

Conduct another round of usability studies to validate the corrections made based on users pain points and check if their experience have been effectively addressed.

Conduct more user research to determine any new areas of need.

Thank you for your time reviewing my work on the Trem Velho app! If you need help or if you want to contact me, please send me a message.

Thanks You For Reviewing