Loading

Fresco

Empowering restaurant staff to provide better customer experiences through smart design
Fresco Case Study

Designed and shipped a new ordering platform for staff, resulting in increased SPH and higher user satisfaction scores

Project Outcome: Successfully trialled and launched a new React Native ordering app which is now planned for a 2025 national rollout across 230 restaurants (Zizzi & ASK Italian).  Achieved commercial objectives (higher spend per head, reduced ordering times) whilst also creating something that restaurant team members said they’d love to use.

Company: Azzurri Group

Role: Lead and sole UX Designer

Duration: Jan 2023 – current

The Problem

In late 2022, Azzurri Group rolled out hundreds of new handheld devices to restaurants across their estate. Although these devices afforded waiters better mobility and task management throughout restaurants, they were still using an old and inefficient ordering platform. 

Azzurri Group wanted to explore the possibility of developing their own bespoke order-taking application for these handhelds. The goals were: to streamline efficiency, empower staff to provide better customer service, and open up integration opportunities with other digital products across the business.  

The First Question: Was there even a need for a new application?

Although this was the brief provided by Azzurri, the first thing I wanted to understand was whether restaurant teams even wanted to use a new application. The current POS was clunky but also arguably the most important piece of operational tech, and something that experienced waiters had been using for years. We would not be able to start designing without first thoroughly understanding current sentiment amongst teams, and the gaps and pain points within the current system. 

A 2-month discovery plan was mapped out and then delivered to answer these questions. The plan utilised the following methods: 

In-restaurant observational studies across 5 sites
23 qualitative interviews with restaurant staff (1:1, recorded sessions)
Surveys distributed via internal comms
Stakeholders interviews (Operations, Food, Brand, Quality & Safety, Engineering teams)
Data analysis of current check and POS data
Competitor analysis & other secondary research
Synthesising the Research

Interview and survey data was analysed and grouped until common patterns and pain points started to emerge. It was also clear that there were two main personas starting to emerge (General Managers, Front of House Team members) and that sentiment varied amongst both groups. 

Research Synthesis

Key Learnings

  • Following a history of landing operational tech with mixed success, waiters were understandably sceptical about the development of a new staff-facing application. Although the current ordering app had obvious drawbacks and usability issues, staff were concerned about the introduction of a new solution and what this might mean in terms of disruption to their operations. 
  •  New waiters (FOH Team Members) were frustrated with the current system. The UI was cramped and the cause of many errors, the menu IA non-intuitive and there was a lack of clarity around many of the functional buttons. Many recounted that it had taken them several weeks to get used to it, and during that time, they had made many mistakes in front of the customer and caused a lot of wastage. 
  • Waiters with longer service (GMs and AMs) had learnt to circumnavigate the current system’s limitations. “You just learn to work with it” was a popular sentiment. Yes the interface was clunky but the reason behind that was the flexibility and multitude of options that the system provided. Other positives noted were: speed and menu arrangement. 
  • Platform stability was one of the most important requirements for a new application, even more so than design. Waiters dreaded situations where they were stuck in front of customers unable to progress with an order due to platform outage or connection issues. This was fed back to our engineering teams. 
  • Overall though, staff did feel that there was opportunity for a more streamlined experience to speed up service, more prompts to help with customer engagement, and better integration between all the digital applications used throughout their shift. As long as the new system was fast, flexible and easy to use, there did exist appetite for trying out a new application.
Let's meet Chloe

I established a clear primary persona based off the qual/quant survey and interview data, and supplemented by demographics data provided by our restaurant HR teams. Chloe embodied some of the clearest themes/sentiment that had emerged from the research and her purpose was to build empathy, prevent self-referential thinking, and drive design and product decisions throughout the whole process. 

Bringing everyone along for the journey

Findings from Discovery were played back to key stakeholders in order to create a shared understanding of the project’s aims, build empathy for our key users (wait staff), and enhance support and collaboration for the project. 

Personal Reflection: In fact, this Discovery has been shared in multiple forums since the start of the project, including business check-ins, board meetings, Sprint Reviews and Team Away Days. In addition to opening up useful conversations and elevating the profile of UX & Product, I strongly believe that every business benefits from having a deep understanding of how their staff think and feel, and what concerns and problems they face on a daily basis.

Collaborative Ideation

Following Discovery, multiple workshops were held with key stakeholders and primary user groups to gather and prioritise ideal features for an MVP product. These were centered around several How Might We prompts which reflected the biggest pain points identified in Discovery.

A major goal of mine was to ensure that we gave General Managers as well as Front of House Staff the chance to share their ideas as well. Historically, the business had a tendency to make decisions on behalf of their operations team without thorough or only partial consultation of end users. Hence why multiple workshop sessions were run to allow multiple areas of the business to share their thoughts.  

Workshop Outcomes:
  • Gathered creative solutions for how to solve for largest user pain points
  • Further understood which features would be seen as an improvement over what was offered in the current system
  •  Got a sense from multiple stakeholders of which features would be most crucial in an MVP which I and my Product Manager then further validated with data
  • Through workshops, started building a culture of multi-level collaboration and transparent ideation which went a long way towards gathering support and buy-in for the project

Scroll to explore. Artefacts include: output from an ideation exercise, example of How Might We brainstorming & example of a prioritisation exercise

Personal Reflection: The biggest challenge at this stage was ensuring that we had the right mix of stakeholders, engineering teams and primary users present in these workshops. It was a constant juggling act throughout the whole project to balance commercial objectives against the needs and wants of our primary users and so we had to provide avenues for multiple groups to voice their opinions throughout the entire process.

Wireframing & Rough Prototyping

Ideas were then further developed and refined through the process of wireframing and prototyping. This process spanned several months and included rounds of requirements gathering, in-restaurant user testing and stakeholder input. Several features and ideas were designed, tested and at times discarded.

Mid-fi wireframes
Mid-fi Wireframes
The Solution:

Although specific project details can’t be shared externally yet, at a high level, our solution tried to improve efficiency and empower staff to provide better customer experiences through the following things:

Our app provided a more streamlined interface which would allow staff to quickly and intuitively locate, edit and modify menu items. UI incorporated search functions, smart filtering and a menu IA which more closely mirrored that which was provided on physical menus

I designed several suggestive selling prompts that would fit seamlessly into the ordering journey to help remind and train staff to sell. The challenge here was to ensure that these would be perceived as useful and not disruptive to the overall flow.

Where staff had highlighted key pain points during Discovery (specifically in regards to dish modifications) I designed feature flows that reduced steps significantly whilst also retaining the flexibility required to provide great customer experience.

Working closely with our engineers and developers, we ensured that the solution would be properly integrated with our newest systems, including our menu data backend and payment app. This meant that in future, we would also be able to leverage more data points and explore a broader range of functionality.

Designing for Delivery

After thoroughly testing our prototype, we then moved into Delivery. My development team and I had 3 months to build an MVP version of the React Native app which would then be trialled in restaurants. Throughout the 3 months, I worked extremely closely with the developers to hand off pixel-perfect designs, workshop approaches to different bits of functionality and ensure that everyone was aligned on the vision and comfortable with the approach. 

Personal Reflection: One of the biggest challenges of this project was in delivering “an MVP that wasn’t technically an MVP”. By definition, an MVP is a version of a product with just enough features to be usable by early adopters. However, considering the context of our app being used by waiters in restaurants, the complexity of taking orders for customers and multiple scenarios that could occur, defining a strict feature set for an MVP was extremely challenging. My Product Manager and I went through several months of scoping, descoping, playbacks to Ops teams and technical discussions before we finally felt like we had something that would be able to be used by staff with minimal disruption.

Setting up a Design System

To ensure consistency across the app as well as facilitate better collaboration between design and development, I set up a design system in Figma based on the framework of Atomic Design

All components were properly linked within final designs and also adhered to Accessibility standards, including sufficient colour contrast, adequate font sizing as well as be usable for waiters with different levels of digital literacy. 

Fresco Design System
Example of Design Handover
Effective Design Handover

Care was taken to provide as much clarity as possible during design handover, including:

  •  Providing annotations and comments for specific design elements
  • Clarifying interactions, behaviours and functionality (as well as providing prototypes)
  • Including developer notes where possible
  • Taking part in refinements, workshops and retros (which was already an established part of our ways of working)

Trial & Results

After three months of intensive development effort, Fresco was launched and trialled at one of our high profile London sites. Over a period of four weeks, it was used by staff members on shift to serve customers. Results were monitored using a variety of reporting tools and compared against benchmarks we had established for the previous ordering platform. Due to the internal nature and commercial sensitivity of this project, I am unable to provide detailed metrics and results on this site. However, please reach out privately if you would like to learn more.

Topline Results

Compared to the previous ordering platform used by wait staff, our app saw:

  • Higher spend-per-head per customer (based on the inclusion of prompts in our UI / measured via Qlik business analytics)
  • Higher self-reported usability scores (measured via ASQ surveys)
  • Faster times to complete a basic order and send it to the kitchen 
  • Higher accuracy in orders placed (based on manual experiments conducted during the trial)
  • Usage on >60% of orders in the last week of the trial (a successful result seeing as this was an MVP version that did not include full functionality to cover all order-taking scenarios)

Scroll to explore images and results

Personal Reflection: Throughout the trial, we worked very closely with the restaurant team to improve and iterate upon the product. We went in every week, sometimes with members of the development team, to observe its usage. Through this, we were able to rapidly roll out performance and UI improvements within the 4 week period which, from feedback from our staff, went a long way towards building user confidence and support.

Project Outcome

Following the success of the MVP trial, we were able to secure additional funding for a Phase 2 and Phase 3 of the project. Internal interest in the project grew and following presentations to the board and other key stakeholders, we recruited a larger team to support, test and provide business requirements for Fresco. 

Major discovery is underway for upcoming complex features, and we are also looking into payment integration so that an entire customer journey can be completed on the app. We are now working towards some final trials for 2024  (to test product stability) and then a subsequent national roll out to 230 restaurants by early 2025. 

If you would like to know more about this project and the design methodology behind it, please don’t hesitate to reach out. 

Fresco sign in page
Back To Top