Gousto

Data-Driven Prototyping

/

Meal Kit Delivery

/

4 Weeks

Simulating future experiences with thousands of customers.

Montage of individual recipe modules with delicious food from burgers to bakes set on a peach coloured background.
We explored what meaningful choice means to customers.

Challenge

Our challenge was to emulate a highly personalised experience using real data, capture statistically significant quantitative data, and provide powerful no-code prototyping tools for the wider product team. In order to foresee any future problems when Gousto scaled their menu offering we needed to simulate a scaled menu experience.

Outcome

The menu simulation provided vital evidence for the product discovery and delivery strategy. It gave the product teams confidence that they were solving the right problems because it was supported by analytical data at a large scale. The prototyping tools are being reused by the Gousto product team to emulate other solutions to rapidly innovate without interrupting the core business services.

  • Data from 6000 customers that could be used to inform the product strategy.
  • Introduced a suite of easy-to-use prototyping tools for the internal design team to continue the innovation stream connecting to real data and powered by React.

“The menu simulation tool is incredibly valuable. It’s given us evidence to refine our product strategy and given us the knowledge and tools to build data driven prototypes. We can now test solutions more quickly and accurately than ever before whilst capturing quantitative insight, and with very little development support or impact on our live product.”

A profile image of Dominic Sando, the Head of Product for Menu at Gousto.
Dominic Sando - Head of Product, Gousto

Approach

Three mobile mockups showing the user journey for Gousto’s menu experience from menu exploration to checkout.
Framer empowered us to simulate the menu with little dependency on the development team.

Used data-driven coded prototypes to replicate the live Gousto app UI.

Framer and their community have some powerful out the box data components for us to build our experiences on. It’s intuitive split between their code and design canvas made it an easy choice for a tool that would be easy to adopt and adaptable enough to suit our needs.

Split screen of two screenshots. The left image shows the recipe modules in Framer. The right image shows the underlying recipe data connected to Framer through Airtable.
Framer’s integration with real data was a key to our rapid simulation and testing.

Integrated real recipe data to quickly and accurately populate the prototypes.

Utilising the scripts and automation within Airtable we were able to quickly import and optimise exports directly from Gousto database of recipes. After connecting Framer’s data component to Airtable we could save hours of manual work populating the experience by utilising real data in the prototype. All with almost no dependency from the development team.

Montage of three colourful columns (light red, light blue and light green) demonstrating the various taste profiles used in the prototype.
Participants expected a highly personalised experience, making personalisation a key benchmark for accurate test results.

Customised each experience for taste profiles using artificial intelligence.

Working closely with Gousto’s data science team and using their taste-profile algorithm we were able to create a relevant experience for the users. This was critical in gathering accurate results from our tests as users were accustomed to a very high level of personalisation.

Illustration on a black background shows the underlying code of a mobile prototype and how it measures the scroll depth of the user testing.
We tracked a number of key behaviours, one of which was scroll depth.

Developed a bespoke data analytics component in order to track user behaviour.

In order to capture meaningful insights from the prototype's analytics we had to create a custom analytics component that could capture the specific and detailed events and interactions we needed. Our development team created a replicable tool from React that was relatively easy for the wider product team to adopt and reuse. This custom solution is something that had never been done before within Framer.

Solutions

Screenshot of a black table with white text with multiple columns from the database platform Supabase.
Supabase’s intuitive system enabled us to capture analytics data with minimal effort.

Gathered key analytics data from over 3000 participants in an unmoderated test.

Our menu simulation successfully gathered data from over 5000 unmoderated testing sessions. We filtered out inaccurate tests and were able to gather data from what users added to their carts and when to how far they would scroll in the experience.

Split screen showing reports from analytics platforms Supabase and Google Data Studio.
Google Data Studio helped us to share the data with Gousto so they could perform their own analysis.

Produced a reusable analytics dashboard along with synthesised recommendations.

The analytics dashboard enabled the wider product team within Gousto to analyse the data to find insight that would be useful for their work outside of our brief. They were able to split the data by customer segment, sort columns and interrogate the underlying data across the key metrics.

Montage of the menu simulations digital product strategy documentation highlighting the key figures derived from the testing.
 Clear signals from the analytical data informed the product roadmap.

Derived valuable insight to inform near-term product development decisions.

We were able to identify relatively accurate observations of how far we can push the menu experience using the current  user interface on mobile devices. This evidence gave both the product team and their stakeholders confidence in the best route forward with a deeper understanding of the potential problems.

Summary

Activities

  • Data-driven coded prototyping
  • Data analytics
  • Backend data services
  • Insights synthesis
  • Quantitative usability testing
  • Opportunity analysis
  • Product management & strategy
  • Programme management

Impact

Engaged with 6,000 customers in the test.

 

Generated 14 re-usable prototypes for differing taste profiles.

 

Clear understanding of the customer behaviour, problems and opportunities.

 

Next Project
A black icon of an arrow pointing to the side.
AXA IM — Digital Product Design

Building a customer experience programme for a global asset manager

Fancy a free workshop?