How do you build an e-commerce for a bakery that bakes once a week?

How do you build an e-commerce for a bakery that bakes once a week?

Type

Portfolio Project

Client

El Hormiguero

Role

UX/UI Designer

Tools

Figma, Notion, Miro

A self-initiated project for a real artisan bakery — researched with real users, designed end-to-end, and built as a portfolio case study.

No budget, one baker, one baking day per week, no existing digital system.

El Hormiguero is a Colombian artisan bakery run by a single baker, Liz. She bakes once a week in small batches using sourdough and natural ingredients — and built her entire customer base through Instagram, word of mouth, and sheer passion for her craft.

Type

Portfolio Project

Client

El Hormiguero

Role

UX/UI Designer

Tools

Figma, Notion, Miro

A self-initiated project for a real artisan bakery — researched with real users, designed end-to-end, and built as a portfolio case study.

No budget, one baker, one baking day per week, no existing digital system.

El Hormiguero is a Colombian artisan bakery run by a single baker, Liz. She bakes once a week in small batches using sourdough and natural ingredients — and built her entire customer base through Instagram, word of mouth, and sheer passion for her craft.

1
2
3
4

Discovery

Carolina is a loyal artisan bakery customer who needs a clear, organized way to browse products and place weekly orders because she currently depends on Instagram stories to know what's available, and misses out when she doesn't see them in time.

The real challenge

This wasn't a website problem. It was a systems problem. One baking day, limited inventory, rotating menus, and one owner managing everything through Instagram DMs. The challenge was designing one system that worked for two completely different users — the customer trying to order, and the owner trying to run a business.

Before a Design, I Listened

I started by talking to real customers and to Liz before touching Figma. Three in-depth interviews, one stakeholder session, and a 26-person survey.

"A website gives me so much more confidence than WhatsApp."

— Carolina

"I missed out on the bread because there was no notification."

— Diana

"I take a screenshot of the menu, paste it on WhatsApp, pay on Nequi, and send the receipt."

— Carolina

96.2%

Wanted to see clear prices

92.3%

Wanted product photos

84%

Wanted order notifications

84.6%

Were comfortable paying online and valued seeing real-time product availability

Users weren't frustrated that the bakery only bakes once a week. They were frustrated because they never knew what was available, when to order, or if their order went through.

Ideation & Design

With the system fully mapped, I moved to Procreate to sketch each screen. This let me test layout and hierarchy quickly before touching Figma.

With the system fully mapped, I moved to Procreate — a lightweight sketching tool — to sketch each screen. This let me test layout and hierarchy quickly before touching Figma.

Decision 1: Every product card shows real-time availability status, and a countdown banner at the top tells customers exactly how long the menu stays open. I considered hiding sold-out items entirely to keep the menu clean — but that would have made the bakery feel smaller than it is. Users needed to see the full offering to build trust. Showing availability and time remaining upfront removes anxiety before they even click.

Decision 2: Automatic order confirmation is sent after every purchase. A manual confirmation from Liz wasn't a real option — she's one person managing baking, packaging, and delivery alone. Automation wasn't a nice-to-have. It was the only solution that worked at her scale.

Decision 1: Every product card shows real-time availability status, and a countdown banner at the top tells customers exactly how long the menu stays open. I considered hiding sold-out items entirely to keep the menu clean — but that would have made the bakery feel smaller than it is. Users needed to see the full offering to build trust. Showing availability and time remaining upfront removes anxiety before they even click.

Decision 2: Automatic order confirmation is sent after every purchase. A manual confirmation from Liz wasn't a real option — she's one person managing baking, packaging, and delivery alone. Automation wasn't a nice-to-have. It was the only solution that worked at her scale.

Decision 3: The "How it works" steps were originally near the top of the homepage. An A/B test showed users converted better when the menu was the first thing they saw — so I moved the process explanation further down and kept the "View Menu" CTA in the hero.

Decision 3: The "How it works" steps were originally near the top of the homepage. An A/B test showed users converted better when the menu was the first thing they saw — so I moved the process explanation further down and kept the "View Menu" CTA in the hero.

Usability Testing

Did it work? I tested it with real users to find out.

Purchase 1 Focaccia with Delivery and complete the checkout.

I tested with 3 real users in Colombia. All completed the task — with an average time of 1m 23.4s.

Users immediately clicked on the availability badge ("Only 5 left") and the "Add to Order" button — confirming that scarcity messaging was noticed and drove action.

Most users navigated directly from the homepage to checkout without friction.

The core flow worked — users understood the weekly model, found products easily, and completed checkout confidently.

Solution

Customers can now browse that week's menu, add items, and pay online — without touching Instagram or WhatsApp. Availability is visible in real time. Orders are confirmed automatically.

Reflection

Looking Back: Self-initiated work doesn't mean hypothetical work. Without a client brief or a budget, I conducted real interviews, ran a real survey, and tested with real users. AI was part of the process from the start — I used it to build proto personas before fieldwork, understand behavioral patterns in research data, and get feedback on UX writing and design decisions. The real challenge was translating user pain points into visual and functional decisions — making invisible frustrations like uncertainty and lack of transparency feel resolved through the interface. The research also gave the bakery owner something she didn't have before: a clear picture of who her customers are and what they actually need.

Looking Forward: The admin dashboard for Liz is the natural next step — a separate case study for the other side of the same system. I'm looking to bring this same approach to a team: starting from real user needs, making decisions backed by research, and designing experiences that solve problems people actually have.

Looking Back: Self-initiated work doesn't mean hypothetical work. Without a client brief or a budget, I conducted real interviews, ran a real survey, and tested with real users. AI was part of the process from the start — I used it to build proto personas before fieldwork, understand behavioral patterns in research data, and get feedback on UX writing and design decisions. The real challenge was translating user pain points into visual and functional decisions — making invisible frustrations like uncertainty and lack of transparency feel resolved through the interface. The research also gave the bakery owner something she didn't have before: a clear picture of who her customers are and what they actually need.

Looking Forward: The admin dashboard for Liz is the natural next step — a separate case study for the other side of the same system. I'm looking to bring this same approach to a team: starting from real user needs, making decisions backed by research, and designing experiences that solve problems people actually have.

© 2026 Camila Díaz

︴cami.diaz.96@hotmail.com

︴📍Huntington Beach, CA

© 2026 Camila Díaz

cami.diaz.96@hotmail.com

📍Huntington Beach, CA