Ferragamo MTO: la borsa HUG TH XS in alligatore verde nel configuratore, con la cartella colori a destra

Case study

Ferragamo MTO: il configuratore su ordinazione parte dalle fotografie

Ferragamo MTO è un configuratore Made-to-Order per la pelletteria e le calzature del programma Ferragamo Unico. In boutique l'addetto sceglie con il cliente pelle, colore, minuteria e iniziali, vede ogni scelta sulle fotografie di studio del prodotto, ottiene il prezzo calcolato dal server e salva una proposta con un link da mandare al cliente. La stessa proposta diventa un ordine, con foglio d'ordine in PDF ed email.

Ho seguito tutto: product design, UX/UI, sviluppo full-stack, modello dati, integrazione con il modello immagine, infrastruttura e rilascio. Go live in un mese, sviluppo e fix compresi, con un catalogo di 41 prodotti in cinque categorie, borse e calzature, ai prezzi reali di listino.

Il problema

Un prodotto su ordinazione di lusso ha migliaia di combinazioni e poche fotografie: una borsa sola arriva a 1.426 combinazioni di pelle, colore e minuteria. Il catalogo vive in file Excel e cartelle di scatti, e in boutique nessuno può aprirli davanti a un cliente che vuole vedere la sua borsa in verde con il palladio.

Cosa doveva fare lo strumento:

Mostrare qualsiasi combinazione con la fedeltà di una fotografia di studio, anche dove la fotografia non esiste
Tenere prezzo, vincoli tra le opzioni e ordine affidabili quanto il listino
Essere usabile da un addetto di boutique, su tablet, senza formazione

Passo 1 del configuratore: scelta del materiale della HUG TH XS, con prezzo e numero di colori per ogni pelle

Fotografie reali e generazione on the fly

Il configuratore parte dalle fotografie di studio e non da una ricostruzione 3D. I modelli 3D dei prodotti non erano disponibili, e rifarli per tutto il catalogo avrebbe spostato il rilascio di mesi: l'AI è stata la scelta più veloce. Ogni scatto è il riferimento, e le varianti che non sono state fotografate vengono generate al momento dallo scatto reale: la pelle, la tinta, la minuteria, il punto di vista. Materiali, luce e inquadratura restano quelli della fotografia.

I tempi reggono l'uso in boutique: il modello risponde in circa dieci secondi e il ciclo completo, immagine pronta in galleria, chiude in circa ventidue. Un'immagine generata una volta resta disponibile per tutti i clienti successivi, e le anteprime delle iniziali già viste non vengono rigenerate. Il costo è di pochi centesimi per immagine, senza canone: si paga solo ciò che si genera. In gestione le immagini mancanti si generano in lotto, in parallelo.

In vetrina ogni immagine generata è dichiarata come tale, e dove una combinazione non ha ancora la sua immagine il configuratore mostra un segnaposto esplicito e la genera alla prima richiesta.

Il flusso in boutique

Un wizard di cinque passi, con il prezzo sempre visibile e la fotografia che cambia a ogni scelta:

Materiale: le pelli del prodotto, con prezzo base e numero di colori
Colore: solo le colorway ammesse per quella pelle; un puntino oro segna quelle già coperte da un'immagine
Hardware: galvanica più decorazioni facoltative, crystal e pietre, con il sovrapprezzo di ognuna
Iniziali: testo con validazione live, posizione, targhetta, finitura e anteprima applicata allo scatto reale
Riepilogo: le scelte con i loro importi, il modulo d'ordine della boutique e due esiti, salva la proposta oppure crea l'ordine

I passi che un prodotto non ha non compaiono. Il prezzo viene ricalcolato dal server al salvataggio, in più valute al cambio BCE. La galleria risponde a un gesto solo: trascinare sfoglia le viste, pinch e rotellina ingrandiscono verso il punto puntato.

Il cambio di minuteria e i controlli di fedeltà

Cambiare la sola minuteria a una borsa fotografata è il caso più delicato: una chiusura è piccola, e un modello generico tende a ridisegnarla. Qui la minuteria viene trasformata pezzo per pezzo nella finitura scelta, Giove, Palladio, crystal o pietre, e tutto il resto dello scatto rimane originale. Lo stesso vale per le altre viste della stessa configurazione: la galleria resta coerente da ogni angolo.

Nessuna immagine arriva in galleria senza un controllo. Ogni generazione passa da verifiche automatiche di fedeltà, sulla forma del prodotto e sulla posizione e la misura della minuteria. Una generazione che non supera i controlli viene scartata e rifatta, e se continua a non passare diventa un errore leggibile in gestione: un'immagine sbagliata non viene mai salvata né mostrata a un cliente.

Le immagini di variante non si combinano mai tra loro: ogni immagine parte dallo scatto reale e cambia un aspetto. Su un prodotto di lusso un dettaglio alterato vale come un errore di catalogo, e il sistema è costruito per non produrne.

Regole, prezzo e link condiviso

Le regole di compatibilità si scrivono con sole tendine, in una frase che si legge come si parla: se Pelle è uguale a Alligatore Millennium, allora per Colore consenti solo Nero e Rosso. Nel wizard ciò che è escluso non compare, e il server le fa rispettare anche al salvataggio, insieme al prezzo.

Il link /c/codice è la stessa pagina vista da due persone: l'addetto collegato la riapre modificabile, il cliente la vede in sola lettura, senza i propri dati di contatto. Configurazione e ordine sono la stessa riga in due momenti: confermare assegna un numero e cambia lo stato, e il link continua a funzionare.

Tutta l'applicazione sta dietro l'accesso, vetrina compresa, e non è indicizzabile. Gli accessi si aprono a mano, senza registrazione.

Area gestione: una regola di compatibilità scritta con tendine, se Targhetta è uguale a Internal Metal Tag allora per Finitura iniziali escludi

L'area di gestione

Stessa palette e tipografia della vetrina, tutto dimensionato per il dito. La scheda prodotto si salva da sola a ogni modifica ed è divisa in Dati, Fotografie, Configurazioni, Combinazioni, Regole e Modulo d'ordine. Le fotografie si caricano come sono, anche da tablet, e vengono normalizzate in automatico.

La generazione lavora in lotto, con avanzamento riga per riga e stop a metà; un'immagine che fallisce non ferma le altre e la causa arriva in interfaccia con il suo rimedio. Il catalogo si esporta e si reimporta in Excel con tendine e validazione cella per cella. Gli ordini hanno ricerca istantanea, foglio d'ordine in PDF con la fotografia della configurazione, email al cliente ed export.

Stack

Next.js e React in TypeScript, Tailwind, Postgres e storage su Supabase, un modello immagine di Google per la generazione, PDF ed Excel generati sul server, email transazionali. La logica di prezzo, regole e ordini ha i suoi test automatici.

Desktop a due colonne, foto a sinistra e pannello a destra; su tablet e mobile la foto sta sopra e il pannello scorre sotto, con la call to action fissa e i target touch da 44 pixel in su.

Il configuratore su mobile: fotografia sopra, cartella colori sotto e pulsante Continua fisso

Prossimo passo: il 3D

Il passo successivo è il configuratore 3D, a partire dai file CAD dell'ufficio prodotto: rotazione libera, zoom sui dettagli e materiali resi in tempo reale, con le fotografie di studio e la generazione AI che restano il riferimento per le viste e per le combinazioni. Regole, prezzo e ordini non cambiano: sono già indipendenti da come viene mostrato il prodotto.

In sintesi

Ferragamo MTO è un configuratore Made-to-Order che parte dalle fotografie di studio e genera al momento le combinazioni che non sono state fotografate, con controlli automatici di fedeltà prima che un'immagine entri in galleria. L'ho progettato e sviluppato per intero, con prezzo e regole calcolati dal server, link condivisibile per il cliente e area di gestione per la boutique. Go live in un mese, sviluppo e fix compresi.

Domande frequenti

Cos'è Ferragamo MTO?

È un configuratore Made-to-Order per la pelletteria e le calzature del programma Ferragamo Unico: in boutique l'addetto sceglie con il cliente pelle, colore, minuteria e iniziali sulle fotografie di studio, ottiene il prezzo calcolato dal server e salva una proposta che diventa ordine con foglio PDF ed email.

Come vengono mostrate le combinazioni che non hanno una fotografia?

Vengono generate al momento con l'AI a partire dallo scatto reale. Il modello risponde in circa dieci secondi, il ciclo completo chiude in circa ventidue, il costo è di pochi centesimi per immagine e ogni immagine generata resta disponibile per i clienti successivi.

Come si evita che l'AI alteri il prodotto?

Ogni generazione passa da controlli automatici di fedeltà sulla forma del prodotto e sulla minuteria. Un'immagine che non li supera viene scartata e rifatta, e se continua a non passare diventa un errore in gestione: un'immagine sbagliata non viene mai salvata né mostrata a un cliente.

← Torna ai progetti