Update cookies preferences

Ask to Carmelo’s AI

👋 Hi! I'm Carmelo's AI assistant. I'm trained on his portfolio, case studies, and expertise in design and digital transformation. Ask me anything about his work, design process, or career!

This AI model is in beta and may not always be accurate.

Project information


Bottega dei Due Monti is a Sicilian shop of Nebrodi cheeses, cured meats and preserves. The family business began in 1970 in Montalbano Elicona. The shop today is in Capo d’Orlando, and the same products can be ordered online.

I built it end to end — the marketing homepage that earns the visit, the storefront that handles variable-weight products honestly, the email system that carries every order from request to payment, and the automations that let a small team run all of it without burning out on admin.

Marketing site

Before anyone sees a price, they need to understand what kind of place this is. The homepage earns that — dark surfaces, the bottega’s green and yellow, product photography that makes the Nebrodi feel close. «Mangia sano… Mangia Siciliano», the family story since 1970, the distinction between the Capo d’Orlando shop and the online store that ships across Europe.

It earns the order before asking for it. By the time a visitor reaches the catalogue, they already know who they are buying from.

Mobile experience — homepage through the shopping-list flow

The problem

A wheel of provola does not weigh the same as the next one. A portion is cut to order. The price on the product page is a price per kilo, and the piece the customer will receive does not exist yet.

A standard “pay now” checkout would charge the wrong amount. The bottega needs to take a request, weigh, confirm the real price, and only then send a payment link — or refuse, if the piece is unavailable. Shipping might wait until the customer says when the parcel should leave.

The design problem was making that hand-run process feel obvious to the customer — and giving the shop a clear action for every step of it.

Storefront UX

The storefront carries the same visual identity as the marketing homepage — the bottega’s green, yellow accents, near-black surfaces. Nothing changes on the way from brand story to product page. The site runs in Italian, English and German.

The hardest UX problem is on the product page itself. The customer needs to pick a cut — 250 g, 500 g, a whole piece — see an honest price estimate, and add it without committing to a charge. The button says “Aggiungi alla lista”, not “Buy”. Because this step is a request.

The cart is the shopping list, and it says so. A persistent notice explains that weights vary and that every price shown is an estimate — the shop will confirm the real amount before any money moves. Checkout runs in four steps: shopping list, order details, order sent, order ready. Delivery or pickup.

Product catalogue of Bottega dei Due Monti in a desktop browser
Catalogue on desktop
Provola fresca product page in a desktop browser
Provola fresca — portion, estimate, add to list

Experience reasoning

Every decision in the interface traces back to one fact: the shop does not know the weight until it cuts the piece. That constraint drives the customer path, the order states, and the automation layer. These three diagrams make the reasoning explicit.

Customer journey workflow: choose cut, shopping list, send request, shop confirms, pay and ship
Customer journey — estimate and request first, payment only after the real weight
Shop operations swimlane: customer, shop and email across request, confirm, decision, payment and shipping
Shop operations — one purchase-order state machine shared by customer, shop and email
Automation workflows for product publishing from chat, social content and multilingual newsletters
Automations — AI drafts and publishes; humans approve before anything goes live

Purchase orders and email

Nothing is charged at checkout. The gateway is labelled “Pagamento alla conferma” because that is exactly what happens — the order lands as a request the shop can confirm, refuse, or hold.

From the admin order screen the shop can:

  • Send the confirmed purchase order to the customer, with accept and reject links
  • Refuse a new request and notify the customer
  • Send a payment reminder after the customer has accepted
  • Resend the matching emails when needed

Each status change reaches the customer as a branded email — not a WooCommerce default notice. The customer opens a signed page to accept, modify or cancel the confirmed order. The whole decision path runs through the inbox.

I built the HTML email system from scratch — YITH quote overrides and custom Bottega templates. The shop manages the full order lifecycle from the inbox: the initial estimate, the confirmation where the real weight price sits next to the struck-out estimate, the refusal, the payment reminder with a secure link, payment received, shipped, pause when stock is short, holiday windows, and cancellation. Italian is the source language; English and German follow.

Branded email: purchase order request received with estimate
Request received — estimate, not a charge
Branded email: purchase order ready with accept, modify or cancel
Order ready — confirm, modify or cancel
Branded email with Biagio's photo: order temporarily on hold
On hold — Biagio explains, order waits safely

The customer clicks the link in the order-ready email and lands on a signed page — desktop or mobile — to accept, refuse or request a change. No account needed; the decision lives in the inbox.

Order-decision page on desktop: table of confirmed weights and prices, three action buttons — accept, refuse, modify
Order ready on desktop — accept, refuse or modify
Order-decision page on mobile: confirmed prices with strikethrough estimates, accept / refuse / modify
Order ready on mobile — the same decision, optimised for the phone
Shopping list in a desktop browser
Shopping list on desktop
Checkout in a desktop browser
Checkout — ship or pick up

Mobile UX

Most orders come in on a phone. The same flow holds — pick a cut, see an estimate, add to the list, send the request — and the constraint of a small screen made every element earn its place.

Mobile shop catalogue with category cards
Shop on mobile — categories first
Mobile product page with portion, 250 g and estimated price
Portion, 250 g, estimated price, add to list
Mobile shopping list with estimated-price notice
Shopping list with the estimated-price notice
Mobile checkout with ship or pick up at the shop
Ship, or pick up at the shop

Shop operations

Paying doesn’t mean the order ships immediately. The bottega decides when. The customer gets an email with signed links — ship now or postpone — and the order waits for their reply. If the shop goes on holiday, new requests get an automatic notice without blocking checkout.

Packlink handles the carrier side: door-to-door delivery, goods insurance, and a delivered status that matches how the bottega tracks parcels.

Every edge case — hold, pause, holiday window, shipping delay — was designed so a small team can manage the whole store by hand, without improvising outside the system.

Automations and AI

A Telegram bot is the control room. Commands route into n8n workflows; the team never touches the backend directly.

Product publishing from chat

A photo in Telegram starts a product draft. Gemini proposes name, category, price and variants. One approval and it’s live on WooCommerce.

Content and social

A brief or a catalogue item becomes a multi-channel post: AI copy, Gemini images, optional Veo video — reviewed on Telegram via the BD2M Automatron bot and staged in Notion, then scheduled to Facebook, Instagram, Pinterest, LinkedIn, Telegram and the blog. A separate poller tracks Veo jobs through to reels and posts.

Product imagery

Consistent, appetising photography is a real cost for a small artisan producer. For the Bottega, Gemini generates campaign visuals and product imagery directly from catalogue briefs — product name, category, mood reference. The output is cropped and refined in Figma before it goes anywhere. Marketing assets that used to need a photoshoot come out of a Gemini pipeline — same brand palette, same tone, at catalogue scale.

AI-generated campaign visual for Bottega dei Due Monti — hero product imagery
Campaign imagery — generated from catalogue brief, refined in Figma
AI-generated brand story visual for Bottega dei Due Monti — consistent palette and tone
Brand story visual — consistent palette, same pipeline as social
Contacts and newsletters

WhatsApp and Messenger contacts land in a shared store for approved chat broadcasts. Weekly newsletters pull from the catalogue, generate multilingual copy with Gemini, wait for approval on Telegram via the BD2M Automatron bot and in Notion, then send through MailPoet in Italian, English and German.

Leads

A separate pipeline finds B2B and HORECA contacts, scores them and drafts follow-up sequences. Sending is off by default until someone reviews.

Outcome

The bottega can now take orders online the same way it always took them in person — by hand, at honest prices. Customers know they are not paying until the piece is cut. The shop has a clear action for every step: confirm, refuse, hold, ship, postpone.

Publishing, social, newsletters and leads run from Telegram through n8n, reviewed before anything goes out. One person, or two, can manage the whole operation — online sales, marketing, and customer communication — without getting buried in admin.

5

Countries — Geographic reach: IT, DE, SE, DK, FR

+80%

Order growth

~88%

Fulfillment rate — 14 delivered/completed out of 16 operational orders (excluding 2 refused quotes); 1 postponed, 1 cancelled

Want to know more?

Request the full business case study or working files to explore how I deliver exceptional value. Discover the impact firsthand!

Other case studies

Ticketmaster concept
TICKETMASTER

A concept for finding the show and choosing the seat

BD2M Digital Enablement ecommerce
BD2M Digital Enablement

Ecommerce, communications and operations

pronto-nts
PRONTO NTS

Building UX from the ground up inside Australia's leading ERP platform

mint
MINT

Automated Ad-Ops with MINT - An integrated design approach

generali
GENERALI

Build In-House design excellence through Scalable, Cost-effective solutions

Show More
mint
MINT

Automated Ad-Ops with MINT - An integrated design approach

generali
GENERALI

Build In-House design excellence through Scalable, Cost-effective solutions

pronto
PRONTO

Driving scalable and balanced innovation by transforming Pronto Xi

banco
BANCO BPPM

Applied framework for YouBusiness Web plug-in design to foster user satisfaction

accenture
ACCENTURE

Enhancing interaction design management

intesa
INTESA SAN PAOLO

New credit granting experience for InBiz

job-card
PEDDERS

Re-thinking Electronic Job Card experience

lorraine
LORRAINE LEA

Bespoke E-business solution B2C and B2B website, CRM and sales portal

pronto-suite
PRONTO SUITE

Transforming Pronto’s app suite

hmi-manufacturing
HMI FOR MANUFACTURING

User-centered design for industrial HMI systems

polestar-hmi
POLESTAR HMI

A confident, human interface led by UX

Ask to Carmelo’s AI

👋 Hi! I'm Carmelo's AI assistant. I'm trained on his portfolio, case studies, and expertise in design and digital transformation. Ask me anything about his work, design process, or career!

This AI model is in beta and may not always be accurate.