top of page

Nando's | Re-platform and design system

Brief

The brief from Nandos was to lead the build out of their own ordering platforms across three channels; delivery, collect and eat in.  Alongside this, I was tasked with the creation and upkeep of a new web design system. 

​

See live work through this ordering flow: https://www.nandos.co.uk/order/search

dark copy 4.png
dark.png
dark copy 3.png

My role

As the lead UX/UI Designer I was responsible for;​
​
  • Managing 2 designers within my team

  • Working closely with the product manager to scope features and the direction of the products 

  • Created and maintained a new design system 

  • Oversaw other domain teams work to ensure the alignment of work with the overall direction of the product and design system

  • Introduced library work flows 

  • Ran various workshops across multiple projects 

  • Managed relationships with senior stakeholders

  • Managed a second stream of work around A/B testing across all products driving incremental traffic and revenue

  • Worked closely with the design manager to help create work processes and team structures

  • Lead on large discovery projects from start to finish 

  • Implemented a test and learn approach

Ordering platform

 Beginning with delivery as Nando's had begun to transition to a new delivery partnership with Deliveroo, this required starting from scratch to build upon a mixture of our own new APIs and Deliveroo's APIs. 

​

I began by creating a large design planning Miro board that was broken into research, experience mapping, existing customer feedback, teams questions and concerns, and requirements from the business. I then went on to create a feature list, using workshops with the team to discuss and decide the feature priorities in order to build out an MVP version of the journey, as well as keeping track of future releases. This also included sessions with stakeholders to agree a final feature list. 

​

From the began the building out of the basic building blocks for the new design system loosely based off the existing sites and the digital guidelines. Once agreed we began to wireframe the entire journey, with additional user testing where it was necessary to make improvements from the existing site. Testing included a mixture of remote user testing, surveys and eventually A/B testing.

​

Screenshot 2022-07-13 at 11.22.18.png
Screenshot 2022-07-13 at 11.22.13.png
Nandos eat in.png
Nandos delivery.png
Nandos collect.png

The team took the approach to build a thin slice version of the entire journey, which meant the developers building out the entire site in wireframe form, pulling through all the APIs to ensure we could place an order. This enabled the ability to flag any issues or concerns that then could be pulled back into the designs to find a solution around the problem. 

​

This process worked really well and we continued to use this with the other 2 ordering platforms we build (eat in and collect).

Features

Here are some of the main features implemented;

​

Guest checkout for Eat in

Allows users to have the option to checkout without logging in. This eases in restaurant low staffing issues whilst saving costs and provides a quicker and smoother experience for customers.

(Release date 10/2022)

Nandos guest checkout.png

Menu filter

This allowed users to filter allergens, dietary requirements and hide calories from the menu.

(Released)

Nandos filter 1.png
Nandos filter 2.png
Nandos address lookup 1.png
Nandos address lookup 4.png

Full address lookup

Allows customers to search their location using alternative search methods Ie. town, postcode, full address. This allows customers to search differently depending on their chosen fulfilment, it also will improve the accuracy of the customers location for the Deliveroo drivers when receiving a delivery .

(Release date 10/2022)

​

And many more... 

Component library

Alongside designing the entire ordering platforms, this was the perfect opportunity to build out a new design system within Figma. This enabled me to streamline the work flow by accounting for all component variants so they could be re-used. Also allowing other designers in the domain teams to work with my autonomy as they had access to all existing components being built, that could be re-used throughout the sites. The design system took an atom structure which allowed for more flexibility when building out new components. 

Screenshot 2022-07-14 at 11.04.37.png
Screenshot 2022-07-14 at 11.03.39.png
Screenshot 2022-07-14 at 11.02.52.png

Success metrics

Delivery

Coming soon

Collect

~32% increase in conversion
~13% increase in RPV (revenue per user)

Eat in

Coming soon

​

Processes

Within my time at Nandos, I also created various processes and templates to help streamline the whole UXD teams workflow across adding to the design system, to presenting to stakeholders and others within the business. 

​

Design Articulation Template Deck

Due to Nandos been new to digital design it was key to create constancy in the way all the designers communicated with the wider business. This helped give the business more of an insight into what UXD could achieve and give a better understanding to the benefits of our work. Alongside the researcher we created various adaptations of a design articulation template deck, which could be easily adapted to present work at various points in a project and also adapted to the audience they were presenting too. 

Screenshot 2022-08-01 at 12.19.14.png
Screenshot 2022-08-01 at 12.19.22.png
Screenshot 2022-08-01 at 12.19.06.png
Screenshot 2022-08-01 at 12.19.00.png
Menu - fees.png

A/B test results

Here are a few of the test results from some of the tests ran throughout my time at Nandos.

Mobile Basket fees 

Hypothesis - By not showing the order fess until the basket is open, users will see an accurate total of their food & drink bill. Thereby reducing abandonment from the menu and increase AOV. 

Results - +£2.5k additional delivery sales/quarter +£173.5k additional delivery revenue/quarter 

© Adaptive Creations 2025. All rights reserved.

bottom of page