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 improved efficiency and higher user satisfaction scores

Project Outcome: Achieved commercial objectives (higher spend per head in trial site), higher usability scores compared to benchmarks, successful MVP trial resulting in additional funding for subsequent phases. 

Company: Azzurri Group

Role: Lead and sole UX Designer

Duration: Jan 2023 – current

The Brief

Following a successful hardware roll-out to over 150 restaurants under the Azzurri Group portfolio, the hospitality group wanted to explore the possibility of developing their own bespoke order-taking application. The aim was to improve efficiency in restaurants via a more streamlined ordering experience, empower staff to provide better customer service whilst also opening up integration opportunities with other digital products across the business.  

A research and user-focused approach

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. 

Discovery has always been the most crucial stage of the Design Process (in my opinion), but it took on even greater significance in this project as I was determined to not repeat the mistakes of previous endeavours. Whichever new solution we were designing, we had to thoroughly understand the needs of our users which meant spending time directly in restaurants to observe, listen and empathise.

During Discovery, I conducted:

In-restaurant observational studies across 5 sites
23 qualitative interviews with restaurant staff (1:1, recorded sessions)
Surveys distributed via internal comms
Competitor analysis & other secondary research
Synthesising the Research

There was a lot of data to sift through, and depending on experience level, background, length of service, and position, opinions could be quite varied. However, after consolidating the qual and quant insights, clear themes did start to emerge:

  •  There was a common view that: service time and errors were currently very high due to the clunkiness of the current system (a key hypothesis validated)
  • Certain aspects of the ordering journey were extremely time consuming to perform in the current system (i.e. dish modifications), leading to lower customer satisfaction
  • Staff felt that there was a lack of integration between all the digital applications used throughout their shift which was causing friction
  • Most importantly, there did exist appetite to try out a new ordering system 
Research Synthesis
Establishing our Primary Persona

I established a clear primary persona to help prevent self-referential thinking, and drive design and product decisions throughout the whole process. The primary persona was established through quantitative data supplied by our HR teams and qualitative insights from surveys and interviews. 

Primary persona
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 has grown and following presentations to the board and other key stakeholders, we now have 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 planning more trials for 2024, this time on a larger scale to test the product’s stability and measure across a wider range of business metrics. 

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