Ana Pastelería is a real artisan bakery business. The brand already had a logo, a palette and customers on Instagram, but no space of its own to show the full catalogue and receive orders.
I started with desk research, 4 interviews and a Google Forms survey with 37 responses, in Argentina and Spain. From there I created Paula, my user persona, and her online shopping journey map.
81.1%
Rank quality as the most important factor when choosing an online bakery
Rank quality as the most important factor when choosing an online bakery
100%
Prefer artisan baking over industrial
→ A warm, handmade identity
59.5%
Would like special packaging as an extra service
→ Opportunity: baked goods as gifts
Google Forms survey · 37 responses · 4 interviews
"I prefer watching videos of how they make the products, and I read reviews before buying."
Florencia, interviewee
Fig. 02 · User persona: Paula
Fig. 03 · Paula's journey map: buying online
From research to decisions
01 · Ingredients and allergens came up in comments and interviews → allergens visible on every product.
02 · Photos and reviews weigh heavily before buying → large, prominent photos.
03 ·The brand had an identity, but only on Instagram → its palette on the website, with a role for each colour.
Decision 1
Allergens in plain sight
Problem
In the survey's open comments and in the interviews, ingredients and allergens came up as information people need to decide.
Decision
Each product shows its allergens next to the description, before the "Add to cart" button, without opening any dropdown.
Iteration
In the first version, allergens were inside the "Information" dropdown. An external review with AI, like one from a teammate, made me see that the most valued information was hidden, so I brought it into view.
Fig. 04 · Before and after: allergens, from "Information" into view
Decision 1
Allergens in plain sight
Problem
In the survey's open comments and in the interviews, ingredients and allergens came up as information people need to decide.
Decision
Each product shows its allergens next to the description, before the "Add to cart" button, without opening any dropdown.
Iteration
In the first version, allergens were inside the "Information" dropdown. An external review with AI, like one from a teammate, made me see that the most valued information was hidden, so I brought it into view.
Fig. 04 · Before and after: allergens, from "Information" into view
Decision 2
Photos sell the flavour
Problem
The journey map showed that, before buying, photos and other people's reviews matter enormously.
Decision
The website works as a digital shop window, with large, prominent photos that show the handmade quality of each product.
Fig. 05 · Home: photos lead the eye
Decision 2
Photos sell the flavour
Problem
The journey map showed that, before buying, photos and other people's reviews matter enormously.
Decision
The website works as a digital shop window, with large, prominent photos that show the handmade quality of each product.
Fig. 05 · Home: photos lead the eye
Decision 3
A warm, handmade identity
Problem
The brand already had a logo and palette, but they only lived on Instagram, with no space of its own to bring them together.
Decision
Bring the brand's real palette to the website and give each colour a role: blue for the brand, coral for actions and yellow to guide the menu. A neutral typeface, Roboto, lets the photos, logo and colour bring the warmth.
Fig. 06 · Identity: logo, palette and typefaces
Decision 3
A warm, handmade identity
Problem
The brand already had a logo and palette, but they only lived on Instagram, with no space of its own to bring them together.
Decision
Bring the brand's real palette to the website and give each colour a role: blue for the brand, coral for actions and yellow to guide the menu. A neutral typeface, Roboto, lets the photos, logo and colour bring the warmth.
Fig. 06 · Identity: logo, palette and typefaces
The web
A digital shop window with a catalogue, a product page with visible allergens, a quantity selector with a 44 px touch area and clear dropdowns for ingredients and details.
Fig. 07 · Catalogue: categories on the left, the full range in view
Fig. 08 · Journey: home, catalogue and product page
Metrics to track if the website launched
01 ·Add to cart from the product page: whether allergens help people decide.
02 ·Allergen questions on other channels: if they drop, the page does its job.
03 · Clicks from home to catalogue: whether the photos invite people to keep browsing.
What I learned
Reviewing my design with an outside perspective, AI as a teammate, showed me that the information users valued most was one click away. As a next step, I'd add ratings to the product page, because customers rely on them to decide.
