UX Design For Yeat App Web Version

Timeline: December 2022- July 2023
Platform: Desktop and laptop
My Role: UX Designer

Table of Contents

Introduction

You’re craving a last-minute dinner out, but every restaurant seems fully booked. Frustrating, right? Yeat’s mobile app has been a game-changer for spontaneous diners, but it lacked a dedicated web version. That’s where we came in. As the UX designer for Yeat’s web version, I led a team to bridge this gap, creating a seamless web experience for quick table bookings and efficient restaurant management. We focused on user-centric design, conducting in-depth research to understand the needs of both diners and restaurant owners, leading to a highly intuitive interface. Our system allows restaurant owners to update availability in real-time, minimizing no-shows and maximizing efficiency. Additionally, we ensured cross-platform consistency, so whether users are on mobile or web, they enjoy a consistent, streamlined experience. These features make us stand out from the competition, enhancing the dining experience for everyone involved.

Problem

Yeat’s mobile app makes booking restaurants easy, but here’s the catch: they’re missing a special web app for foodies, concierges and hotel owners. That means these folks can’t manage bookings on their computers. Without this web app, it’s tough for them to make reservations, handle reservations and arrange seating. Fixing this is key to making Yeat even better for everyone involved!
Missing Web App for Foodies, Concierges and Hotel Owners

Yeat’s mobile app is fantastic for on-the-go restaurant bookings, but foodies, concierges and hotel owners don’t have a dedicated web app.
Imagine them juggling phones  just to manage bookings.
Difficulty in Handling Bookings on Computers
Without a web app, foodies, concierges and hotel owners are stuck managing bookings solely on their phones. Picture them squinting at tiny screens, trying to make sense of reservation details. It’s not practical at all!
Challenges in Reservation Management and Seating Arrangements
Managing reservations and seating without a dedicated web app is very impractical. Think of concierges and hotel owners scrambling to accommodate guests, all while missing the tools they need to do it efficiently.
 

Problem Statement


How might we create a dedicated web app for concierges and hotel owners on Yeat, making it easier for them to manage bookings and seating arrangements using their computers?

Goal

Let’s create a special webapp just for concierges and hotel owners on Yeat! This will help them easily manage bookings and seating plans from their computers.
Business Goal:
Our aim is to make Yeat even better! By giving concierges and hotel owners a web app, we’ll make operations smoother and keep customers happier, leading to more people using Yeat.
User Goal:
 It would be very useful for concierges and hotel owners to have a super easy web app to handle bookings and seating arrangements. That’s our goal – to make their lives easier and their experience with Yeat even more enjoyable!

Competitive Analysis

We did a competitive analysis for Yeat to see what other apps do well and where they fall short. This helped us spot opportunities to make Yeat better. Understanding our competitors ensures Yeat stands out with a user-friendly and efficient dining experience.
 

Persona

User Persona 1: Emily the Concierge

Background: Emily is a vibrant concierge at a luxurious hotel. With a constant stream of guests bustling in and out, Emily’s days are always filled with excitement and energy.
Needs and Challenges: But amidst the hustle and bustle, Emily faces a challenge: ensuring every guest’s dining experience is seamless and unforgettable. She needs a proper solution to manage restaurant bookings swiftly, navigating through a maze of last-minute requests with ease. Yet, time seems to slip through her fingers, leaving her handling countless reservations and struggling to keep up with sudden changes.

User Persona 2: Alex the Hotel Owner

Background: Alex is a proud owner of a charming boutique hotel. With a passion for hospitality and an eye for detail, Alex strives to create memorable experiences for every guest who walks through the door.
Needs and Challenges: However, behind the scenes, Alex faces a challenge of his own: optimizing restaurant seating and maximizing revenue. He yearns for tools that seamlessly integrate with his hotel’s management systems, providing insights and solutions to ensure every seat is filled without overbooking. Yet, in the fast-paced world of hospitality, visibility into restaurant availability remains elusive, leaving Alex grappling with uncertainty and missed opportunities.

User Persona 3: Sarah the Front Desk Manager

Background:  Sarah is a friendly front desk manager at a bustling business hotel. With a warm smile and a knack for multitasking, Sarah effortlessly juggles guest requests and administrative duties, ensuring everything runs like clockwork.
Needs and Challenges: But beneath her composed exterior, Sarah faces a challenge: managing restaurant reservations and communicating with staff seamlessly. She yearns for efficient tools that streamline the reservation process, allowing her to cater to guests’ needs with grace and ease. Yet, amidst the whirlwind of guest inquiries and phone calls, coordinating with restaurant staff becomes a daunting task, leaving Sarah feeling stretched thin and longing for a simpler solution.

Process

Gathering the Team:

A team of diverse talents meet on a regular basic.  Designers, developers, product managers, and stakeholders assembled, each bringing their unique skills and perspectives to the table. Their mission? To turn dreams into delicious realities for Yeat users. For discussion and team building, the team meet weekly and bi weekly.

Design Sprint

Yeat’s design sprint unfolds in the virtual realm, where our team converges online to tackle the challenges of restaurant reservations. Picture us gathered around our screens, with Miro boards as our digital canvas and collaboration tool. Together, we brainstorm ideas, sketch out designs, and build prototypes in the virtual space, seamlessly collaborating despite the distance. It’s an exhilarating journey of creativity and innovation, as we race against time to create solutions that will enhance the Yeat experience for us.

User Flow

Yeat’s design sprint unfolds in the virtual realm, where our team converges online to tackle the challenges of restaurant reservations. Picture us gathered around our screens, with Miro boards as our digital canvas and collaboration tool. Together, we brainstorm ideas, sketch out designs, and build prototypes in the virtual space, seamlessly collaborating despite the distance. It’s an exhilarating journey of creativity and innovation, as we race against time to create solutions that will enhance the Yeat experience for us.

Information architecture

Let me tell you why information architecture is crucial for Yeat. Picture me at my desk, sketching and organizing like a culinary maestro. It’s all about creating a seamless experience for our users. Think of it like arranging a perfect menu – everything in its place, making it easy to find and enjoy. So, the next time you’re browsing restaurants on Yeat, remember the magic of information architecture working behind the scenes to make your experience delightful.

Please Click here to see the full map

Early Design: Sketching 

When it came to sketching for Yeat, I took a practical approach. Armed with pencil and paper, I started by jotting down rough ideas and concepts. Then, I moved on to more detailed sketches, focusing on key elements like layout and navigation. Throughout the process, I used a method called rapid prototyping, which involves quickly iterating on designs to explore different possibilities. This allowed me to experiment with various layouts and features, helping to refine the overall design of the app.

Part I. Wireframing with crazy Eight

When I chose the Crazy Eight method for sketching in this process because it is a powerful technique that promotes rapid ideation and creative thinking. By challenging myself to produce eight distinct sketches in just eight minutes, I was able to quickly explore a wide range of design possibilities without overthinking. This method encouraged me to push past my initial ideas and consider more innovative solutions, ultimately helping to identify the most effective and user-friendly design for Yeat’s web app. The diversity of concepts generated through Crazy Eight provided a strong foundation for further refinement and development.
Part II. Finalise one of them
After generating multiple ideas using crazy eight method, I carefully reviewed each sketch to identify the most promising design element. I evaluated them based on key criteria such as usability, simplicity, and alignment with user needs. I also sought feedback from my team to ensure a well rounded perspective. Through this collaborative evaluation, we identified the design that best meet our goals. I then refined this chosen concept, incorporation additional insights and making necessary adjustments to enhaance its functionality and visual appeal. This iterative process ensured that the final design was both effective and user-friendly.

Part III: Made a primary user flow 

After generating multiple sketches using the Crazy Eight method, I moved on to the process of finalizing one design concept. I began by carefully reviewing all the sketches, considering factors such as usability, simplicity, and alignment with Yeat’s brand identity. I then conducted feedback sessions with stakeholders and team members to gather diverse perspectives and insights. Based on this feedback and my own evaluation, I selected the sketch that best addressed the needs of concierges and hotel owners while aligning with Yeat’s goal of simplicity and user-friendliness. I further refined this chosen design through iterative prototyping and testing, ensuring that it met the functional requirements and provided an intuitive experience for users managing restaurant reservations and seating arrangements. This iterative approach allowed me to hone in on the optimal design solution that would enhance the overall dining experience for Yeat’s target audience.
 
 

Usability Testing & Customer Interviews

To validate our designs or test prototypes, we did testing with real users, our customer interviews are done remotely.
We’ve tested the prototype with 17+ people in a controlled testing environment. 

Prototyping in Visily

I began sketching and wireframing, exploring different layouts and navigation structures to find the optimal design solution. By investing time in early design iterations, I aimed to create a solid framework that would guide the development process and ensure alignment with user expectations. Ultimately, this proactive approach to early design helped set a clear direction for the project and lay the groundwork for a successful user experience.

Final Design

In the final design of Yeat’s web app, we focused on simplicity and efficiency. Collaborating closely with our team, we crafted an intuitive interface tailored for concierge services and restaurant/hotel owners. With easy navigation and seamless functionality, users can now manage reservations and seating effortlessly. It’s not just a design – it’s a solution that enhances the dining experience for all involved.
Figure: Few Pages from the final webapp, designed in figma. To see the full prototype Click here

Design System

In creating Yeat’s web app, we established a design system to ensure consistency and efficiency. This system includes predefined styles, components, and guidelines that streamline the design process and maintain a cohesive look and feel across the platform. With the Yeat design system in place, we can quickly iterate on designs, maintain brand consistency, and deliver a seamless user experience for concierge services and restaurant/hotel owners alike.

Potential Design

We have done numerous brainstorming session with the stakeholders and whole design team. We have come up with different design idea and this below idea was one of the potential design solution we have come through. Although we were found of the design, we decided to go more minimalistic as the goal of the client is making as simple and user friendly design as possible. So on the later stage, we have finalised it more alligned with the mobile app and maake it simple, easy and usable.
Finishing design was not only the end goal. We worked closely with the developer team and try to asist him in the whole process even the design part has ended. 

What I have learned

In the final design of Yeat’s web app, we focused on simplicity and efficiency. Collaborating closely with our team, we crafted an intuitive interface tailored for concierge services and restaurant/hotel owners. With easy navigation and seamless functionality, users can now manage reservations and seating effortlessly. It’s not just a design – it’s a solution that enhances the dining experience for all involved.

Unraveling the User’s Narrative:

In our quest to craft the perfect dining experience with Yeat’s web app, we embarked on a journey of discovery. Through countless user interviews and feedback sessions, we uncovered invaluable insights into what truly matters to our users. From the importance of clear navigation to the significance of seamless transitions between devices, every revelation brought us closer to our goal. We learned that simplicity reigns supreme and that guiding users through the reservation process with clarity and ease is paramount. These insights became the guiding stars that illuminated our path towards creating a web app that puts the user first.

Collaboration and Iteration:

As we navigated the twists and turns of design and development, one thing became abundantly clear: collaboration is key. With each brainstorming session and design review, our diverse team of developers, designers, and stakeholders brought their unique perspectives to the table. We learned to embrace the power of iteration, eagerly refining our ideas based on feedback from users and team members alike. Through this iterative process, we discovered that the journey is just as important as the destination – and that the pursuit of perfection is a collective endeavor that knows no bounds.

Brand Enhancement Strategies:

In our quest to elevate the Yeat brand, we embarked on a transformative journey of self-discovery. With every stroke of the pen and hue of color chosen, we sought to convey the essence of Yeat in its purest form. Through trial and error, we learned the art of visual storytelling – how a simple logo or color palette can evoke emotions and forge connections with our audience. We discovered that consistency is the cornerstone of effective branding, ensuring that every interaction with Yeat leaves a lasting impression. And as we unveiled our refreshed brand identity to the world, we knew that we had embarked on a journey that would forever shape the way Yeat is perceived and experienced.
 

Design System

In creating Yeat’s web app, we established a design system to ensure consistency and efficiency. This system includes predefined styles, components, and guidelines that streamline the design process and maintain a cohesive look and feel across the platform. With the Yeat design system in place, we can quickly iterate on designs, maintain brand consistency, and deliver a seamless user experience for concierge services and restaurant/hotel owners alike.


Overcoming Challenges

Despite obstacles, our team rallied with determination and ingenuity. We embraced the constraint of free software by finding creative workarounds and exploring alternative tools. Effective time management and strategic prioritization optimized our workflow. By focusing on key priorities and leveraging our collective strengths, we successfully navigated the project scope, ensuring targeted and impactful efforts. 
 


Personal Takeaway

Reflicting on this project, I’ve learned to embrace challenges as opportunities for creativity and innovation. Collaborating with my team highlighted the power of diverse perspectives and open communication. This deepened my understanding of user-centered design, emphasizing empathy and intuition in creating solutions. Gaining confidence in tackling complex challenges, I’m excited to apply these learnings to future projects, driven by a passion for exceptional user experiences.
 

Next Steps…

What is expected...

In future YEAT focus on enhancing user personalization and integrating AI to provide tailored restaurant recommendations. Additionally, expanding the web app’s features for better reservation management and introducing real-time availability updates will further streamline the dining experience for users.

Do You Have Any Questions about this project? Please feel free to ask.