https://embeds.beehiiv.com/347938a9-c21b-4b92-a85c-da517db028cf
top of page
header 2.jpg
PROJECT: Zeet
DURATION: April - June 2021
ROLE: Concept, Research, Visuals

Project overview

The product:

Zeet is a fancy restaurant, they strive to deliver quality and healthy food. Their focus is on quality customer service. Their target customers have a busy lifestyle and they don’t have the time or ability to prepare a family dinner.

Project duration:

April 2021 to June 2021

The problem:

Busy workers and commuters lack the time necessary to prepare a meal.

zeet first page.png

The goal:

Design an app for the restaurant that enables users to quickly and easily make a reservation or place an order for delivery.

My role:

I led the Product Design - User Experience (UX) and User Interface (UI) - of this project. I also receive constructive feedback from other designers in order to improve and get other perspectives about what I was designing.

Responsibilities:

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

User research

Summary:

I conducted interviews and created empathy maps to understand the users needs that I am designing the app for. A primary user group identified through the research was working adults who don’t have time to cook their meals.

 

These researched user groups confirmed the initial assumptions about the restaurant’s customers, but it also revealed that time was not the only factor stopping users from cooking at home. 

Other user problem included obligations, interests, or finding a quiet place where they can bring their work if needed.

Pain points:

Time

Working adults who don’t have time to cook or shop for groceries.

Accessibility

Platforms for ordering food are not equipped with assistive technologies

Complexity

Users are not tech savvy, the UI is hard to navigate and a busy screen interface prevents them from quickly finding what they want.

Noisy

Problems finding quiet tables to continue working remotely.

Persona: Fabien

Problem statement:

Fabien is a busy director who needs easy access to healthy food at a quiet restaurant because he finds it too time consuming to do groceries and cook.

Copy of Google UX Design Certificate - P

User journey map:

Mapping Fabien’s user journey reveals how helpful it would be for users to have access to Zeet’s booking app.

Copy of Google UX Design Certificate - U

Paper wireframes

Taking time to draft iterations of each screen of the app on paper ensured that the elements that made it to digital wireframes would be well-suited to address user pain points. 

I prioritized a quick and easy way for ordering and making reservations directly on the home screen.

paper wireframes.jpg

Digital wireframes

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

This button gives users an easy option if they want to order food for delivery.

zeet lofi.png

This button provides users with an easy option to make a reservation.

Facilitating a simple visual for choosing a time and date for their booking.

Two buttons for adding drinks or modifying the reservation.

zeet lofi2.png

Low-fidelity prototype

Using the completed set of digital wireframes, I created a low-fidelity prototype. The primary user flow I connected was making a reservation and ordering for delivery, so the prototype could be used in a usability study. 

View the Zeet’s App

Low-Fi prototype

lofi prototype.jpg

Usability study findings:

Two rounds of usability studies were conducted. My findings from the first study helped guide the designs from wireframes to mockups. The second study based on a high-fidelity prototype revealed what aspects of the mockups needed refining.

Round 1 findings

1

Users want to have options for a quiet table when they book.

2

Users want to be able to make a reservation quickly.

3

Users want a user-friendly interface.

Round 2 findings

1

The review page has too many unnecessary steps.

2

Users want to be able to choose from a calendar when they make a reservation.

3

Users want an easy way to modify a reservation after it was made.

Mockups

Early designs didn’t have an option to search as an alternative,
but after the usability studies, I added a search bar at the top of the home screen.

Before usability study

After usability study

zeet lofi.png
zeet first page.png

The second usability study revealed frustration with the Review page. To streamline this flow, I took out the “Edit button” because by pressing the “Week review” the user could go back and edit on the full calendar view. 

I also added a progress timeline so the users know how many steps remain.

Another thing I noticed, was that users didn't find the 'add drink' button very useful. If they are in the rush or they don't know exactly what drink they would order, they found very frustrated and sometimes they would postpone the booking. 

Before usability study

zeet2.png

After usability study

zeet1.png
zeet3.png

The final design

zeet first page.png
zeet3.png
zeet1.png
zeet4.png

High-fidelity prototype

The final high-fidelity prototype presented cleaner user flows for booking a table. It also met users needs for ‘quiet table’ or ‘water for table’ option.

High-Fi prototype

hifi prototype.jpg

Accessibility considerations

3

  1. Provided access to users to a search bar that includes a voice command.

  2. The use of icons to help make navigation easier

  3. Provided access to users who are visually impaired through adding alt text to images for screen readers

  1. Screen reader compatibility: The app should be compatible with screen reader software to enable users with visual impairments to access the content of the app.

  2. Color contrast: The app's color contrast should be adjusted to meet accessibility standards, making it easier for users with visual impairments to read text and distinguish between different elements.

  3. Font size and type: The font size and type should be adjustable to allow users with visual impairments to customize the display to their needs.

  4. Keyboard navigation: The app should be designed to be navigable using a keyboard, to accommodate users who have difficulty using a touch screen.

  5. Alternative text for images: All images used in the app should include alternative text, which describes the image, making it accessible to users with visual impairments.

  6. Captioning and audio description: If the app includes video or audio content, it should include closed captioning or audio descriptions to make it accessible to users with hearing impairments.

  7. Inclusive language: The app's language should be inclusive and avoid using ableist or discriminatory language.

  8. User testing with people with disabilities: Finally, it is important to conduct user testing with people with disabilities to identify any barriers to accessibility and make any necessary improvements to the app.

By incorporating these accessibility features, you can ensure that your booking app for a restaurant is inclusive and accessible to users with disabilities, providing an equal opportunity for everyone to enjoy the benefits of the app.

Key Takeaways and what I learned

  1. User research and testing are critical to designing a user-centered experience. By conducting user research and testing, we were able to identify pain points and make iterative improvements to the design.

  2. Collaboration is key to a successful project. Working closely with stakeholders and developers helped us ensure that everyone was aligned on the project goals and vision.

  3. Prioritization is important. In designing the booking flow, we had to carefully consider which information and actions were most important to users and prioritize them accordingly.

  4. A visually appealing and cohesive design can enhance user engagement. We chose a modern and minimalistic aesthetic with a bold color palette that reflected the high-end restaurants featured on the app.

  5. Designing for mobile apps requires unique considerations. We had to ensure that the design was optimized for mobile devices, with a focus on simplicity and ease of use.

This is my first-ever UX project! I'm grateful to have been through an entire UX process so I can see what it's like. 

While designing the Zeet booking 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.

Working on this project taught me a lot about UX design, from the importance of user research and testing

Thanks to the restaurant booking app project, I was able to grow as a UX designer and develop new skills and insights that I can apply to future projects.

Next steps

If this would be a real project I would use these steps:

  1. Launch the app: The first step would be to launch the app on the app store, making it available to users.

  2. Promote the app: Promotion is essential to attract users to the app. Promotion could include digital marketing, social media, and email campaigns.

  3. Collect feedback: After the launch, the next step would be to collect feedback from users to identify any areas that need improvement or enhancement. Feedback could be collected through surveys, app store reviews, or feedback forms within the app.

  4. Analyze app performance: It would be important to analyze the app's performance metrics, such as user engagement, retention, and conversion rates, to evaluate its success and identify areas for improvement.

  5. Make ongoing improvements: Based on the feedback and performance data, the app would need ongoing improvements and enhancements to ensure that it continues to meet the needs of users and achieve its goals. This could involve adding new features, improving existing features, or fixing bugs.

  6. Partner with more restaurants: To increase the app's popularity and user base, it could be beneficial to partner with more restaurants and expand the range of options available to users.

  7. Plan for future releases: Depending on the scope of the project, there may be additional features or functionality that could be added in future releases. Planning for these releases would involve prioritizing features and identifying resources needed to develop and implement them.

  8. Support and maintenance: After the app is launched, ongoing support and maintenance would be needed to address any technical issues or bugs that arise and ensure that the app continues to function as intended.

Overall, the next steps would involve ongoing monitoring, analysis, and improvements to ensure that the app continues to meet the needs of users and achieve its goals, while also expanding its user base and increasing its popularity.

1

Conduct another round of usability studies to validate whether the pain points users experienced have been effectively addressed.

2

Continue to find gaps in the market of customers needs and find a way to seamlessly implement them in the app in the future.

3

Further research the way information flows between users and the staff that carry out the bookings and food orders to find more areas of development.

Other Projects

logo ok.png

A responsive website for pet adoption

logo.png

An app to help communities in extreme heat.

LOGO.png

A banking app.

bottom of page