restaurant lauching app

The first end-to-end restaurant launch app

The first end-to-end restaurant launch app

The first end-to-end restaurant launch app

ROLE

UX Designer

UX Designer

UX Designer

EXPERTISE

UX/UI Design

UX/UI Design

UX/UI Design

YEAR

2024

2024

2024

Weather app image
Weather app image
Weather app image
Weather app image
Weather app image
Weather app image

Project description

Project description

Project description

The process of opening a new restaurant requires a checklist longer than Santa’s naughty list, but that doesn’t stop restaurateurs from pursuing their dream. However there is a lack of guidance on where to start, what to accomplish next, and if they’re on the right track. There is no all-in-one solution today that new owners can use to track everything. That’s where this solution comes in. The idea to is create an app that helps guide and facilitate the entire process as if they had a consultant working side-by-side.

The process of opening a new restaurant requires a checklist longer than Santa’s naughty list, but that doesn’t stop restaurateurs from pursuing their dream. However there is a lack of guidance on where to start, what to accomplish next, and if they’re on the right track. There is no all-in-one solution today that new owners can use to track everything. That’s where this solution comes in. The idea to is create an app that helps guide and facilitate the entire process as if they had a consultant working side-by-side.

The process of opening a new restaurant requires a checklist longer than Santa’s naughty list, but that doesn’t stop restaurateurs from pursuing their dream. However there is a lack of guidance on where to start, what to accomplish next, and if they’re on the right track. There is no all-in-one solution today that new owners can use to track everything. That’s where this solution comes in. The idea to is create an app that helps guide and facilitate the entire process as if they had a consultant working side-by-side.

Problems

Over 50,000+ new restaurants open a year, yet 80% of those fail in the first 5 years with 60% failing in the first year.

Restaurants take around 6 months to open with most owners running out of savings halfway through.

63% new owners have a food industry background yet only a fraction have any business experience.

Proposed Solution

The ideal solution is to have one app to help new restaurant owners facilitate the entire process of opening a restaurant to increase success rates, decrease time to open, and fill in knowledge gaps.

Process

Process

Process

This category details the step-by-step approach taken during the project, including research, planning, design, development, testing, and optimization phases.

This category details the step-by-step approach taken during the project, including research, planning, design, development, testing, and optimization phases.

This category details the step-by-step approach taken during the project, including research, planning, design, development, testing, and optimization phases.

Research & Planning

Conducted market research to identify existing scheduling challenges and user preferences. Defined target audience segments and outlined key features based on user needs and market trends.

Design & Prototyping

Collaborated with designers to create intuitive user interfaces and interactive prototypes. Iteratively refined designs based on user feedback to enhance usability and visual appeal.

Development & Implementation

Leveraged agile development methodologies to build the scheduling app from the ground up. Prioritized feature development based on user feedback and technical feasibility. Implemented AI algorithms to analyze user behavior and optimize scheduling recommendations.

Testing & Optimization

Conducted rigorous testing across various devices and platforms to ensure compatibility and performance. Gathered user feedback through beta testing and iteratively optimized the app based on usability metrics and user satisfaction.

Research

Research

Research

Research enables me to dig deep into my understanding of users - not only their immediate frustrations, but also their hopes, fears, abilities, limitations, reasoning, and goals. It lays essential foundations for creating solutions in later stages

Research enables me to dig deep into my understanding of users - not only their immediate frustrations, but also their hopes, fears, abilities, limitations, reasoning, and goals. It lays essential foundations for creating solutions in later stages

Research enables me to dig deep into my understanding of users - not only their immediate frustrations, but also their hopes, fears, abilities, limitations, reasoning, and goals. It lays essential foundations for creating solutions in later stages

Secondary Research

Secondary Research

Market Research

It is important to get a big picture of the market by starting with market research - to get a sense of what we know and don't know yet, who the audience are, as well as what the recent trends or news are. The insights gathered from market research will help me frame provisional personas and ask meaningful questions in primary research.

Competitive Analysis

My research first centered around the competition landscape. By capitalizing on competitors' weaknesses and acknowledging their strengths, Sizzle can find its unique competitive advantage. Over 5 user interviews were conducted that helped understand their unique pain points and what they’re hoping to resolve. There were no direct competitors but dozens of indirect competitors. To filter down, I assumed key features and arrived at 3 main competitors that each do something a little different.

Findings

Findings

Restaurant Industry & Existing Solutions

Overall: the restaurant industry has remained steady since the first so-called restaurant in 1765. That said, the technology hasn’t evolved with industry.

Over the years, the restaurant industry has proven to be a massive market with new restaurant openings up 40% since 2019 (Axios).

However, the market isn’t always kinds with unforeseen challenges when it comes to opening a restaurant. There is currently no one single solution on the market that guides new restaurant owners through the process from conception to grand opening.

Demographics

Overall: People of all incomes and ages have dreams of starting their own restaurant; from ex-Wall Street investors to your local waiter at the diner down the road.

Men tend to be opening more restaurant compared to women (54% to 46%) with the average age being around 39 years old.

Where you start to see a big shift is in race with Caucasian making up 55% of the market with the next biggest group being Hispanics at 18% (Zippia).

Competitors

No product exists that fully competed with Sizzle. Most products that do exist are point solutions that only solve a single issue rather than the entire problem.

Primary Research

Primary Research

User Interviews

Building on a general understanding of the market and the audience, I continued to dive deeper and build a real connection with our users, to gain direct insights on them by primary research.

I created an interview guide to facilitate the user interview process, with 10 open-ended questions listed to invite the participants to share their experiences and stories.

In total, 5 participants were interviewed about their experience opening restaurants.

Findings

Findings

Key Motivations

Superficially it might seem that everyone is interested in the same thing: Saving time… but upon closer inspection, user research made it clear that there were divergent motivations.

One interviewee, 30 male, didn't care about saving time as much as it was money deduction in any area; permit fees, finding the right vendors, and seeking legal help.

Another interviewee, 55 female, who opened a fine dining restaurant back in 2018 and didn't care about saving money. As she put it, "I only have a couple decades left to launch my dream. I didn't want to waste anytime in achieving that."

Synthesis

Synthesis

How Might We & POV

To define the problem I am going to solve, I create Point-of-View (POV) Statements that allow me to ideate in a goal-oriented manner, and How-Might-We (HMW) Questions to frame the ideation in the brainstorm session for solutions. The statements and questions are generated based on the insights and needs I gathered in my synthesis.

Persona

Persona

Final Peersona

Creating personas helped bring clarity to those divergences, which became important reference points as functions developed.

As I continued to conduct research and proceeded with design, I focused primarily on one persona because they represented the power user and a heavy emphasis of key functions: filling in knowledge gaps, facilitating the process of funding and permits, and the need to only use one platform.

Structure

Structure

Structure

Now it was time to organize the application's content and features effectively. Expect a user-friendly layout that seamlessly guides users through essential areas like the fundings, their dashboard, and core functionalities, ensuring an intuitive navigation and efficient task completion experience.

Now it was time to organize the application's content and features effectively. Expect a user-friendly layout that seamlessly guides users through essential areas like the fundings, their dashboard, and core functionalities, ensuring an intuitive navigation and efficient task completion experience.

Now it was time to organize the application's content and features effectively. Expect a user-friendly layout that seamlessly guides users through essential areas like the fundings, their dashboard, and core functionalities, ensuring an intuitive navigation and efficient task completion experience.

Sitemap

‍After setting up the product goals and deciding what features to include, I wanted to continue building up the structure of Sizzle using a site map, which helped me to visualize the relationship between the content and examine the hierarchy.

User Flows

I mapped user flows whose scenarios correspond to the established tasks. This process helps me walk in an individual user's shoes, and think through different scenarios that this user might encounter. Below is the user flow for Mark when he wants to create a new project. A link to all user flows can be found here.

Design

Design

Design

I started with low-fidelity prototyping and testing that allowed me to better understand how users expected to complete the tasks I was focusing on. By studying their touch and swipe gestures — and more importantly, having a dialogue with them about what they expected and when — I knew which adjustments needed to be made to lay the foundation for a more fully realized high fidelity prototype. Small details such as actionable and consistent iconography, and consistent paths to get back, would become important elements of the design system.

I started with low-fidelity prototyping and testing that allowed me to better understand how users expected to complete the tasks I was focusing on. By studying their touch and swipe gestures — and more importantly, having a dialogue with them about what they expected and when — I knew which adjustments needed to be made to lay the foundation for a more fully realized high fidelity prototype. Small details such as actionable and consistent iconography, and consistent paths to get back, would become important elements of the design system.

I started with low-fidelity prototyping and testing that allowed me to better understand how users expected to complete the tasks I was focusing on. By studying their touch and swipe gestures — and more importantly, having a dialogue with them about what they expected and when — I knew which adjustments needed to be made to lay the foundation for a more fully realized high fidelity prototype. Small details such as actionable and consistent iconography, and consistent paths to get back, would become important elements of the design system.

Wireframing

Wireframing

Wireframing

Low-Fi

Low-fi prototypes were created to understand what’s going resonate and empower users. This step allowed me to garner valuable user feedback, initiate the design direction is correct, and make sure time is well spent. This ensured the final design would be more polished and user-centric.

  • Dashboard

    The launchpad that gives an overview of progress, upcoming tasks, and pending applications, permits, and loans.

    Weather app image
  • New Project

    The most important step - the beginning of the project. Straightforward and easy to get started that helps guide along the way.

    Weather app image
  • Property Search

    Seamless integration with leading property data sites like Zillow to pull real-time data about available properties.

    Weather app image
  • Property Overview

    This screen will give all the details that a new restaurant owner will care about from price to growth margins to seasonal fluctuations.

    Weather app image
  • business plan

    Notion-like editing platform using AI to draft up a professional business plan that can be used to secure funding and permits.

    Weather app image
  • Dashboard

    The launchpad that gives an overview of progress, upcoming tasks, and pending applications, permits, and loans.

    Weather app image
  • New Project

    The most important step - the beginning of the project. Straightforward and easy to get started that helps guide along the way.

    Weather app image
  • Property Search

    Seamless integration with leading property data sites like Zillow to pull real-time data about available properties.

    Weather app image
  • Property Overview

    This screen will give all the details that a new restaurant owner will care about from price to growth margins to seasonal fluctuations.

    Weather app image
  • business plan

    Notion-like editing platform using AI to draft up a professional business plan that can be used to secure funding and permits.

    Weather app image

The Sizzle Brand

The Sizzle Brand

The Sizzle Brand

Visually articulating all the potential aspects of the Sizzle brand meant defining a baseline design system that identified key elements of its visual vocabulary. The goal was to make Sizzle's visual design refer back to its core mission: Empowering restaurant owners to open their new restaurant successfully.

Visually articulating all the potential aspects of the Sizzle brand meant defining a baseline design system that identified key elements of its visual vocabulary. The goal was to make Sizzle's visual design refer back to its core mission: Empowering restaurant owners to open their new restaurant successfully.

Sizzle's brand values can be summed up in the following 4 words: Guidance, Innovation, Support, and Success.

Visually articulating all the potential aspects of the Sizzle brand meant defining a baseline design system that identified key elements of its visual vocabulary. The goal was to make Sizzle's visual design refer back to its core mission: Empowering restaurant owners to open their new restaurant successfully.

Visually articulating all the potential aspects of the Sizzle brand meant defining a baseline design system that identified key elements of its visual vocabulary. The goal was to make Sizzle's visual design refer back to its core mission: Empowering restaurant owners to open their new restaurant successfully.

Sizzle's brand values can be summed up in the following 4 words: Guidance, Innovation, Support, and Success.

Visually articulating all the potential aspects of the Sizzle brand meant defining a baseline design system that identified key elements of its visual vocabulary. The goal was to make Sizzle's visual design refer back to its core mission: Empowering restaurant owners to open their new restaurant successfully.

Visually articulating all the potential aspects of the Sizzle brand meant defining a baseline design system that identified key elements of its visual vocabulary. The goal was to make Sizzle's visual design refer back to its core mission: Empowering restaurant owners to open their new restaurant successfully.

Sizzle's brand values can be summed up in the following 4 words: Guidance, Innovation, Support, and Success.

UI Kit

The UI Kit is a compilation of existing UI elements on the website that provides references for future design and collaboration for the design team. It is also a living document and will be updated whenever there is an iteration of the design. Below is a part of the Sizzle UI Kit.

Testing

Testing

Testing

Before usability testing, it is important to set up test objectives, subject, methodology, tasks, and rubrics for measuring the result of the testing before conducting a test. Therefore, I wrote a usability testing plan to define what and why I want to test and get prepared for the test.


For all the tests, I expected a 100% completion rate since all tasks are straight forward and refined from low-fi testing. That said, I expect a 80% error-free rate due to prototype limits and unavailable features.

Before usability testing, it is important to set up test objectives, subject, methodology, tasks, and rubrics for measuring the result of the testing before conducting a test. Therefore, I wrote a usability testing plan to define what and why I want to test and get prepared for the test.


For all the tests, I expected a 100% completion rate since all tasks are straight forward and refined from low-fi testing. That said, I expect a 80% error-free rate due to prototype limits and unavailable features.

Before usability testing, it is important to set up test objectives, subject, methodology, tasks, and rubrics for measuring the result of the testing before conducting a test. Therefore, I wrote a usability testing plan to define what and why I want to test and get prepared for the test.


For all the tests, I expected a 100% completion rate since all tasks are straight forward and refined from low-fi testing. That said, I expect a 80% error-free rate due to prototype limits and unavailable features.

The Test

I conducted remote usability testing with 5 participants, and created transcripts for each participant based on my observation of their interaction with the prototype. I jotted down their mistakes, slips, and confusions they expressed in the process. This transcript is a perfect raw material for summarizing the patterns of user’s interaction with the prototype.

Iterations

Iterations

Iterations

Surfacing New Issues

The high-fidelity prototype brought test users closest to the real experience yet, and it revealed some key issues that needed to be addressed. While some users were able to complete the flows, UX heuristics needed to be improved. Adding progress bars to help users understand their place and simplified colors and icons.

Other issues included unclear button placement when selecting a restaurant location and confusion language when developing a business plan.

Testers were also able to verbalize a need they haven’t thought about before this iteration: Could the app also allow me to apply for permits and licenses directly rather than managing that separately through local government websites.

Visual Design

Using data from my research participants, I needed to figure out how to incorporate needed data and a visually appealing and meaningful way. One example is where users are selecting their property, they are able to see a graph of the growth potential, marked with the Sizzle brand. Another example is with the interactive progress bar. This gamified the process, giving the user a great sense of achievement when a step was completed.

  • Dashboard

    A streamlined dashboard groups action items and adds icons for easy navigation. Secondary information have been moved to a hamburger menu to declutter the space.

    Weather app image
  • New Project

    Minimalistic design with bold drop-shadow buttons keeps the user centered the next steps. Ongoing projects will be listed here with the option for franchising.

    Weather app image
  • Property Search

    Properties results now include important "at-a-glance" info like growth rates, number of offers and views, and Sizzle ratings based on Google.

    Weather app image
  • Property Overview

    New integration with Google Maps gives the user access to "find on map" feature. AI pulls in data from a variety of sources to the most up to date property data.

    Weather app image
  • business plan

    Business plan now incorporates tool tips and AI suggestions based on actions elsewhere within the app like loans and property selection(s).

    Weather app image
  • Dashboard

    A streamlined dashboard groups action items and adds icons for easy navigation. Secondary information have been moved to a hamburger menu to declutter the space.

    Weather app image
  • New Project

    Minimalistic design with bold drop-shadow buttons keeps the user centered the next steps. Ongoing projects will be listed here with the option for franchising.

    Weather app image
  • Property Search

    Properties results now include important "at-a-glance" info like growth rates, number of offers and views, and Sizzle ratings based on Google.

    Weather app image
  • Property Overview

    New integration with Google Maps gives the user access to "find on map" feature. AI pulls in data from a variety of sources to the most up to date property data.

    Weather app image
  • business plan

    Business plan now incorporates tool tips and AI suggestions based on actions elsewhere within the app like loans and property selection(s).

    Weather app image

The Sizzle Experience

The Sizzle Experience

The Sizzle Experience

Final Prototype

The final prototype allowed users to experience guiding themselves from restaurant conception to grand opening - all in one place.

Conclusion

Conclusion

Conclusion

Key Takeaways

I went into this project assuming that Sizzle would only provide new restaurant owners with a guide for a few key steps in the opening process. I learned quickly however how "sticky" and content heavy this app will become - from restaurant conception to grand opening.


My original intent for Sizzle was to be a guide or a reference point for new restaurant owners to use, but the would need to go external to complete steps like financing, permits, and marketing. However, through user testing, owners found that Sizzle would be more useful through integrations and features that allowed them to stay within Sizzle through the whole process.

Next Steps

Since the design has been tested and revised, it is ready to enter the development phase. In order to effectively communicate the design to developers, I redlined and organized my design deliverables using Figma for handoff, and prepared to assist with any follow-up questions.