Design Sprint
THE STORY OF THE SPRINT
A 'Design Spring' for a mobile-first grocery app that helps shoppers discover where their food comes from, explore its journey and make more informed purchasing decisions.
——>
01 - Understanding The Problem
A grocery store wanted to become more sustainable, but didn't have a website or app and wasn't sure how to achieve that sustainability in a way that would be useful to its customers.
?
The question I started with:
How might I use digital design to help a grocery store become more transparent and help customers make more informed choices?
02 - Research
What I learned
What came through in the research was that people do care about making more responsible choices, but weren't always able to trust what they were being told.
Rather than telling users what the "green" choice was, I wanted Greenleaf to provide specific, tangible information that allowed people to make their own decisions.
This shifted the focus from:
"How sustainable is this product?"
to:
"Where did this come from, and who is behind it?"
ECO · Organic
Carrots from
Müller's Farm
Organic · 500 g bunch · Rhine Valley, DE
Arrived: 3 Jul 2026
Bunched carrots, freshly harvested from Müller's Farm in the Rhine Valley. Certified organic, unwashed, 500 g per bunch. Naturally sweet with a firm texture.
Product history
Harvested
28 Jun 2026 · Müller's Farm, Rhine Valley
Sorted & packed
1 Jul 2026 · On-farm packing facility
Delivered to Greenleaf Berlin
3 Jul 2026 · Distribution hub, Wedding
Müller's Farm
About
Müller's Farm has been family-run since 1978. Located near Bingen am Rhein, they supply Greenleaf with seasonal vegetables year-round. All produce is certified organic under EU regulation 2018/848.
View Müller's Farm profile
03 - The Concept
From information to story
One of the things I wanted to establish quite early was an editorial feel.
Rather than making Greenleaf feel like a typical grocery app or sustainability dashboard, I wanted it to feel more like a calm, informative publication, something that tells the story behind the product.
I treated provenance as a story that could be progressively explored.
This is reflected in the typography:
Inter → factual information
Fraunces → storytelling and editorial moments
04- the Experience
Making provenance explorable
The product page prioritises the information someone needs immediately:
• What is it?
• Where did it come from?
• When did it arrive?
From there, users can progressively explore the product history and the supplier behind it.
I deliberately used a lot of negative space because there is potentially a lot of information to communicate. I didn't want the provenance information to feel like a dashboard of data. I wanted it to feel calm, readable and something users could explore at their own pace
The space gives the information hierarchy and reinforces the calm, editorial feeling.
Saved
Müller’s Farm
Bingen am Rhein, Germany
About
Müller’s Farm has been family-run since 1978. Located near Bingen am Rhein, they supply Greenleaf with seasonal vegetables year-round. All produce is certified organic under EU regulation 2018/848.
Products from Müller’s Farm
Carrots
500 g bunch · weekly
Beetroot
500 g · weekly
Kale
250 g bag · twice weekly
Parsnips
1 kg bag · seasonal
View all products
05 - Visual and Interaction Decisions
Creating trust without looking "eco"
I avoided the usual sustainability clichés and instead used:
Warm cream
→ Calm foundation
Deep green
→ Trust and brand identity
Muted sage
→ Subtle secondary colour
The intention was for the interface to feel trustworthy and grounded, rather than overly "eco".
I also differentiated the interactions:
Bookmark → Product
Heart → Supplier
The bookmark represents saving something I might want to buy again, while the heart represents following or favouriting a producer.
This helps create a relationship between the consumer and supplier, rather than treating the supplier as anonymous information in the background.
Dark mode →
Saved
Saved products
Carrots
500 g bunch · weekly
Beetroot
500 g · weekly
Kale
250 g bag · twice weekly
Favourite suppliers
Müller's Farm
Bingen am Rhein, Germany
Hof Schneider
Freiburg im Breisgau, Germany
06 - Iteration
Adding the homepage
Later in the process, I added the homepage.
Originally, the experience was centred around the QR scan. But as the prototype developed, I felt the finished product needed a clear starting point and somewhere for the wider Greenleaf experience to exist beyond an individual product scan.
The homepage gave the experience a broader context and made the navigation feel more complete.
Saved
Know what you’re buying.
Greenleaf helps you discover the people, places and journeys behind your food.
Scan a product
Point your camera at any product QR code
Scan a receipt
Explore products after you’ve been shopping
Recently explored
Carrots from Müller's Farm
Organic · 500 g bunch · Rhine Valley, DE
Beetroot
500 g · weekly
Müller's Farm
Bingen am Rhein, Germany
07 - Prototype and Reflections
Learning from the limitations
One of the more useful learning experiences came right at the end when I ran out of Figma Make credits.
Rather than moving the prototype into Figma Design and risking losing the interactions, I went into the generated code and made the final visual refinements manually.
This gave me useful insight into:
• How Figma Make constructs a prototype
• Basic code language and structure
• The limitations of AI-generated design tools
• My own limitations when working directly with code
08 - Greenleaf at a Glance
A lightweight companion for making informed decisions while shopping.
I also had the opportunity to take one of the Greenleaf screens and rethink it for Apple Watch.
Rather than simply shrinking the mobile experience, I started thinking about what the watch could actually do better than the phone.
Because Greenleaf is designed around making decisions while shopping, I think the watch makes most sense as a quick-glance companion.
Phone → Explore
• Scan products
• Explore provenance
• Discover suppliers
• Read the full story
Watch → Decide
• Check origin
• Check freshness
• Check supplier
• Access saved products
• Make a quick decision without taking out your phone
Favourited Supplier:
Müller's Farm
New delivery today!
Beetroot
Carrots
Kale
Carrots
from Müller's Farm
Organic · 500 g bunch · Rhine Valley, DE
Arrived: 3 Jul 2026
Product history
View Müller's Farm profile
Delivery
Last delivery:
Monday, 7 Jul 2026
Previous delivery:
Monday, 30 Jun 2026
Next expected:
Monday, 14 Jul 2026
Frequency:
Weekly (Mondays)
Müller's Farm
Bingen am Rhein, Germany
About
Müller's Farm has been family-run since 1978. Located near Bingen am Rhein, they supply Greenleaf with seasonal vegetables year-round. All produce is certified organic under EU regulation 2018/848.
All products
Product history
Harvested
28 Jun 2026 · Müller's Farm, Rhine Valley
Packed
1 Jul 2026 · On-farm packing facility
Delivered
3 Jul 2026 · Distribution hub, Wedding
Favourited Supplier:
Müller's Farm
New delivery today!
Beetroot
Carrots
Kale
09 - Reflection
Overall, I think the strongest part of Greenleaf is turning provenance into something you can explore rather than just read.
Designing the Apple Watch experience reinforced the importance of considering the specific context, constraints and capabilities of each device, rather than simply scaling an existing interface down.
If I continued the project, I'd want to test it with real shoppers and find out whether this information actually helps them make decisions without making the shopping experience more complicated.
01 - Understanding The Problem
A grocery store wanted to become more sustainable, but didn't have a website or app and wasn't sure how to achieve that sustainability in a way that would be useful to its customers.
?
The question I started with:
How might I use digital design to help a grocery store become more transparent and help customers make more informed choices?
02 - Research
What I learned
What came through in the research was that people do care about making more responsible choices, but weren't always able to trust what they were being told.
Rather than telling users what the "green" choice was, I wanted Greenleaf to provide specific, tangible information that allowed people to make their own decisions.
This shifted the focus from:
"How sustainable is this product?"
to:
"Where did this come from, and who is behind it?"
ECO · Organic
Carrots from
Müller's Farm
Organic · 500 g bunch · Rhine Valley, DE
Arrived: 3 Jul 2026
Bunched carrots, freshly harvested from Müller's Farm in the Rhine Valley. Certified organic, unwashed, 500 g per bunch. Naturally sweet with a firm texture.
Product history
Harvested
28 Jun 2026 · Müller's Farm, Rhine Valley
Sorted & packed
1 Jul 2026 · On-farm packing facility
Delivered to Greenleaf Berlin
3 Jul 2026 · Distribution hub, Wedding
Müller's Farm
About
Müller's Farm has been family-run since 1978. Located near Bingen am Rhein, they supply Greenleaf with seasonal vegetables year-round. All produce is certified organic under EU regulation 2018/848.
View Müller's Farm profile
03 - The Concept
From information to story
One of the things I wanted to establish quite early was an editorial feel.
Rather than making Greenleaf feel like a typical grocery app or sustainability dashboard, I wanted it to feel more like a calm, informative publication, something that tells the story behind the product.
I treated provenance as a story that could be progressively explored.
This is reflected in the typography:
Inter → factual information
Fraunces → storytelling and editorial moments
04- the Experience
Making provenance explorable
The product page prioritises the information someone needs immediately:
• What is it?
• Where did it come from?
• When did it arrive?
From there, users can progressively explore the product history and the supplier behind it.
I deliberately used a lot of negative space because there is potentially a lot of information to communicate. I didn't want the provenance information to feel like a dashboard of data. I wanted it to feel calm, readable and something users could explore at their own pace
The space gives the information hierarchy and reinforces the calm, editorial feeling.
Saved
Müller’s Farm
Bingen am Rhein, Germany
About
Müller’s Farm has been family-run since 1978. Located near Bingen am Rhein, they supply Greenleaf with seasonal vegetables year-round. All produce is certified organic under EU regulation 2018/848.
Products from Müller’s Farm
Carrots
500 g bunch · weekly
Beetroot
500 g · weekly
Kale
250 g bag · twice weekly
Parsnips
1 kg bag · seasonal
View all products
05 - Visual and Interaction Decisions
Creating trust without looking "eco"
I avoided the usual sustainability clichés and instead used:
Warm cream
→ Calm foundation
Deep green
→ Trust and brand identity
Muted sage
→ Subtle secondary colour
The intention was for the interface to feel trustworthy and grounded, rather than overly "eco".
I also differentiated the interactions:
Bookmark → Product
Heart → Supplier
The bookmark represents saving something I might want to buy again, while the heart represents following or favouriting a producer.
This helps create a relationship between the consumer and supplier, rather than treating the supplier as anonymous information in the background.
Dark mode →
Saved
Saved products
Carrots
500 g bunch · weekly
Beetroot
500 g · weekly
Kale
250 g bag · twice weekly
Favourite suppliers
Müller's Farm
Bingen am Rhein, Germany
Hof Schneider
Freiburg im Breisgau, Germany
06 - Iteration
Adding the homepage
Later in the process, I added the homepage.
Originally, the experience was centred around the QR scan. But as the prototype developed, I felt the finished product needed a clear starting point and somewhere for the wider Greenleaf experience to exist beyond an individual product scan.
The homepage gave the experience a broader context and made the navigation feel more complete.
Saved
Know what you’re buying.
Greenleaf helps you discover the people, places and journeys behind your food.
Scan a product
Point your camera at any product QR code
Scan a receipt
Explore products after you’ve been shopping
Recently explored
Carrots from Müller's Farm
Organic · 500 g bunch · Rhine Valley, DE
Beetroot
500 g · weekly
Müller's Farm
Bingen am Rhein, Germany
07 - Prototype and Reflections
Learning from the limitations
One of the more useful learning experiences came right at the end when I ran out of Figma Make credits.
Rather than moving the prototype into Figma Design and risking losing the interactions, I went into the generated code and made the final visual refinements manually.
This gave me useful insight into:
• How Figma Make constructs a prototype
• Basic code language and structure
• The limitations of AI-generated design tools
• My own limitations when working directly with code
08 - Greenleaf at a Glance
A lightweight companion for making informed decisions while shopping.
I also had the opportunity to take one of the Greenleaf screens and rethink it for Apple Watch.
Rather than simply shrinking the mobile experience, I started thinking about what the watch could actually do better than the phone.
Because Greenleaf is designed around making decisions while shopping, I think the watch makes most sense as a quick-glance companion.
Phone → Explore
• Scan products
• Explore provenance
• Discover suppliers
• Read the full story
Watch → Decide
• Check origin
• Check freshness
• Check supplier
• Access saved products
• Make a quick decision without taking out your phone
Favourited Supplier:
Müller's Farm
New delivery today!
Beetroot
Carrots
Kale
Carrots
from Müller's Farm
Organic · 500 g bunch · Rhine Valley, DE
Arrived: 3 Jul 2026
Product history
View Müller's Farm profile
Delivery
Last delivery:
Monday, 7 Jul 2026
Previous delivery:
Monday, 30 Jun 2026
Next expected:
Monday, 14 Jul 2026
Frequency:
Weekly (Mondays)
Müller's Farm
Bingen am Rhein, Germany
About
Müller's Farm has been family-run since 1978. Located near Bingen am Rhein, they supply Greenleaf with seasonal vegetables year-round. All produce is certified organic under EU regulation 2018/848.
All products
Product history
Harvested
28 Jun 2026 · Müller's Farm, Rhine Valley
Packed
1 Jul 2026 · On-farm packing facility
Delivered
3 Jul 2026 · Distribution hub, Wedding
Favourited Supplier:
Müller's Farm
New delivery today!
Beetroot
Carrots
Kale
09 - Reflection
Overall, I think the strongest part of Greenleaf is turning provenance into something you can explore rather than just read.
Designing the Apple Watch experience reinforced the importance of considering the specific context, constraints and capabilities of each device, rather than simply scaling an existing interface down.
If I continued the project, I'd want to test it with real shoppers and find out whether this information actually helps them make decisions without making the shopping experience more complicated.
01 - Understanding The Problem
A grocery store wanted to become more sustainable, but didn't have a website or app and wasn't sure how to achieve that sustainability in a way that would be useful to its customers.
?
The question I started with:
How might I use digital design to help a grocery store become more transparent and help customers make more informed choices?
02 - Research
What I learned
What came through in the research was that people do care about making more responsible choices, but weren't always able to trust what they were being told.
Rather than telling users what the "green" choice was, I wanted Greenleaf to provide specific, tangible information that allowed people to make their own decisions.
This shifted the focus from:
"How sustainable is this product?"
to:
"Where did this come from, and who is behind it?"
ECO · Organic
Carrots from
Müller's Farm
Organic · 500 g bunch · Rhine Valley, DE
Arrived: 3 Jul 2026
Bunched carrots, freshly harvested from Müller's Farm in the Rhine Valley. Certified organic, unwashed, 500 g per bunch. Naturally sweet with a firm texture.
Product history
Harvested
28 Jun 2026 · Müller's Farm, Rhine Valley
Sorted & packed
1 Jul 2026 · On-farm packing facility
Delivered to Greenleaf Berlin
3 Jul 2026 · Distribution hub, Wedding
Müller's Farm
About
Müller's Farm has been family-run since 1978. Located near Bingen am Rhein, they supply Greenleaf with seasonal vegetables year-round. All produce is certified organic under EU regulation 2018/848.
View Müller's Farm profile
03 - The Concept
From information to story
One of the things I wanted to establish quite early was an editorial feel.
Rather than making Greenleaf feel like a typical grocery app or sustainability dashboard, I wanted it to feel more like a calm, informative publication, something that tells the story behind the product.
I treated provenance as a story that could be progressively explored.
This is reflected in the typography:
Inter → factual information
Fraunces → storytelling and editorial moments
04- the Experience
Making provenance explorable
The product page prioritises the information someone needs immediately:
• What is it?
• Where did it come from?
• When did it arrive?
From there, users can progressively explore the product history and the supplier behind it.
I deliberately used a lot of negative space because there is potentially a lot of information to communicate. I didn't want the provenance information to feel like a dashboard of data. I wanted it to feel calm, readable and something users could explore at their own pace
The space gives the information hierarchy and reinforces the calm, editorial feeling.
Saved
Müller’s Farm
Bingen am Rhein, Germany
About
Müller’s Farm has been family-run since 1978. Located near Bingen am Rhein, they supply Greenleaf with seasonal vegetables year-round. All produce is certified organic under EU regulation 2018/848.
Products from Müller’s Farm
Carrots
500 g bunch · weekly
Beetroot
500 g · weekly
Kale
250 g bag · twice weekly
Parsnips
1 kg bag · seasonal
View all products
05 - Visual and Interaction Decisions
Creating trust without looking "eco"
I avoided the usual sustainability clichés and instead used:
Warm cream
→ Calm foundation
Deep green
→ Trust and brand identity
Muted sage
→ Subtle secondary colour
The intention was for the interface to feel trustworthy and grounded, rather than overly "eco".
I also differentiated the interactions:
Bookmark → Product
Heart → Supplier
The bookmark represents saving something I might want to buy again, while the heart represents following or favouriting a producer.
This helps create a relationship between the consumer and supplier, rather than treating the supplier as anonymous information in the background.
Dark mode →
Saved
Saved products
Carrots
500 g bunch · weekly
Beetroot
500 g · weekly
Kale
250 g bag · twice weekly
Favourite suppliers
Müller's Farm
Bingen am Rhein, Germany
Hof Schneider
Freiburg im Breisgau, Germany
06 - Iteration
Adding the homepage
Later in the process, I added the homepage.
Originally, the experience was centred around the QR scan. But as the prototype developed, I felt the finished product needed a clear starting point and somewhere for the wider Greenleaf experience to exist beyond an individual product scan.
The homepage gave the experience a broader context and made the navigation feel more complete.
Saved
Know what you’re buying.
Greenleaf helps you discover the people, places and journeys behind your food.
Scan a product
Point your camera at any product QR code
Scan a receipt
Explore products after you’ve been shopping
Recently explored
Carrots from Müller's Farm
Organic · 500 g bunch · Rhine Valley, DE
Beetroot
500 g · weekly
Müller's Farm
Bingen am Rhein, Germany
07 - Prototype and Reflections
Learning from the limitations
One of the more useful learning experiences came right at the end when I ran out of Figma Make credits.
Rather than moving the prototype into Figma Design and risking losing the interactions, I went into the generated code and made the final visual refinements manually.
This gave me useful insight into:
• How Figma Make constructs a prototype
• Basic code language and structure
• The limitations of AI-generated design tools
• My own limitations when working directly with code
08 - Greenleaf at a Glance
A lightweight companion for making informed decisions while shopping.
I also had the opportunity to take one of the Greenleaf screens and rethink it for Apple Watch.
Rather than simply shrinking the mobile experience, I started thinking about what the watch could actually do better than the phone.
Because Greenleaf is designed around making decisions while shopping, I think the watch makes most sense as a quick-glance companion.
Phone → Explore
• Scan products
• Explore provenance
• Discover suppliers
• Read the full story
Watch → Decide
• Check origin
• Check freshness
• Check supplier
• Access saved products
• Make a quick decision without taking out your phone
Favourited Supplier:
Müller's Farm
New delivery today!
Beetroot
Carrots
Kale
Carrots
from Müller's Farm
Organic · 500 g bunch · Rhine Valley, DE
Arrived: 3 Jul 2026
Product history
View Müller's Farm profile
Delivery
Last delivery:
Monday, 7 Jul 2026
Previous delivery:
Monday, 30 Jun 2026
Next expected:
Monday, 14 Jul 2026
Frequency:
Weekly (Mondays)
Müller's Farm
Bingen am Rhein, Germany
About
Müller's Farm has been family-run since 1978. Located near Bingen am Rhein, they supply Greenleaf with seasonal vegetables year-round. All produce is certified organic under EU regulation 2018/848.
All products
Product history
Harvested
28 Jun 2026 · Müller's Farm, Rhine Valley
Packed
1 Jul 2026 · On-farm packing facility
Delivered
3 Jul 2026 · Distribution hub, Wedding
Favourited Supplier:
Müller's Farm
New delivery today!
Beetroot
Carrots
Kale
09 - Reflection
Overall, I think the strongest part of Greenleaf is turning provenance into something you can explore rather than just read.
Designing the Apple Watch experience reinforced the importance of considering the specific context, constraints and capabilities of each device, rather than simply scaling an existing interface down.
If I continued the project, I'd want to test it with real shoppers and find out whether this information actually helps them make decisions without making the shopping experience more complicated.