Portfolio > Caso studio
eCommerce
/
Checkout data-driven potenziato dall'AI e design conversazionale
Come 50 feedback utente sono diventati un checkout stabile e rassicurante
PANORAMICA
Piattaforma e-commerce B2C in procinto di lanciare una flash sale stagionale, penalizzata da un alto tasso di abbandono in fase di checkout.
Utenti in fase d’acquisto, due profili opposti: chi cerca trasparenza e velocità senza vincoli e chi ha bisogno di rassicurazione.
IL BUSINESS PROBLEM
Survey, interviste e user story avevano fatto emergere frizioni concentrate nelle fasi di pagamento e conferma dell’ordine, ma mancava un criterio per stabilire quali affrontare prima della vendita promozionale imminente.
SOLUZIONE
Un checkout ridefinito sui 3 problemi prioritari: costi poco trasparenti, instabilità percepita durante il pagamento, sovraccarico informativo nella review e conferma dell’ordine.
Il costo è sempre chiaro
Sconti, spedizione, tasse e totale sono visibili dal carrello fino alla conferma.
Le modifiche non sono distruttive
Ogni sezione è modificabile senza perdere dati o interrompere il funnel.
Lo stato della transazione è esplicito
Un feedback di sistema durante l’elaborazione rende visibile ciò che sta accadendo e riduce l’incertezza.
Nessun upsell che introduce nuove decisioni
La conferma dell'ordine è focalizzata sul completamento e sul tracking senza distrazioni promozionali.
Assistente AI su bisogni misurati
I 3 intenti ad alta frequenza Coupon, Pagamento e Tracking sono gestiti con percorsi conversazionali dedicati.
Il processo di design AI-enhanced
FRAMEWORK IA
Come ho usato l'AI Generativa
Ho analizzato prima i dati utente.
Ho dato all'AI prompt strutturati arricchiti con dati + vincoli + contesto + istruzioni di design.
Ho valutato criticamente ogni output e scartato i risultati non connessi ai dati.
Motivo? L'AI supporta sia divergenza che convergenza, ma le decisioni finali restano del designer.
Perché Non voglio risultati generici e inutilizzabili. Mi servono output aderenti alle regole che ho impostato. Più preciso è il prompt, più efficace sarà il risultato.
ANALISI DEI DATI
50 feedback, 5 giorni e un problema concentrato in 3 cluster
Avevo dati qualitativi da survey e note di interviste con una deadline limitata per inquadrare il problema e risolverlo.
Ho promptato l'AI per estrarre pattern e raggruppare semanticamente i feedback utente in categorie a cui ho assegnato frequenza e severità.
Alta frequenza + alta severità = priorità
Sono emersi 8 cluster di pain point, ma solo 3 combinavano entrambi i criteri. Su questa base ho costruito la gerarchia:
Stabilità di pagamenti e moduli - Frequenza: 11 | Criticità: Alta
Tasse, sconti e trasparenza prezzi - Frequenza: 10 | Criticità: Alta
Review e conferma ordine - Frequenza: 9 | Criticità: Alta
PERSONAS
Archetipi costruiti sui pattern emersi dalla ricerca
David Miller "Guest esitante"
Voglio solo comprare velocemente questo articolo. Se mi obblighi a creare un account o mi becco costi di spedizione a sorpresa proprio alla fine, chiudo la scheda.
Sarah Jenkins "Planner ansiosa"
Quando lo schermo si blocca dopo che clicco 'Procedi al pagamento', vado nel panico. Ho pagato due volte? L'ordine è andato a buon fine? Ho bisogno di continue rassicurazioni.
CUSTOMER JOURNEY
Mappare percorsi e touchpoint per definire le funzionalità di prodotto
David e Sarah incontrano frizioni negli stessi momenti del checkout: pagamento, review e conferma.
I journey hanno evidenziato che l'interfaccia non comunica chiaramente costi, stato della transazione e possibilità di modificare i dati inseriti.
PRIORITIZZAZIONE FUNZIONALITÀ
Cosa e come ho reso azionabili le opportunità emerse
Ho convertito i punti critici dei customer journey in feature, prioritizzandole sulla base di:
impatto sull'utente, misurato da frequenza e severità dei cluster
fattibilità tecnica.
30 user story, tradotte in prototipi e collegate in flussi
WIREFRAME
Allineare il design ai bisogni utente
A questo punto, ogni screen aveva una funzione precisa nel ridurre l’incertezza d’acquisto.
Ho formulato un prompt per generare 6 wireframe allineati alle user story, completi di moduli, pulsanti, microcopy e logiche di interazione.
Ho poi verificato che ciascun deliverable fosse collegato a una o più user story, mantenendo ogni elemento UX ancorato ai dati.
UI REFINE & PROTOTIPAZIONE
Dal wireframe al prototipo hi-fi in 10 minuti
Con l'AI ho accelerato l'ottimizzazione del checkout: posizionamento, leggibilità e spaziatura degli elementi e generato le interazioni.
Ottimizzato positioning, spacing e accessibilità
Ho introdotto un colore di accento (con contrasto conforme agli standard WCAG) per rafforzare la brand identity e creare un segnale visivo coerente per elementi interattivi e informazioni finanziarie prioritarie.
Una bottom bar sticky mantiene sempre visibili il totale corrente e la CTA principale anticipa lo step successivo.
Gli elementi interattivi rispettano un target touch di 44×44 pt.
Migliorato leggibilità e gerarchia delle informazioni
Ho definito una scala tipografica: Barlow per headline e CTA, Roboto per body, microcopy, link, form e testi di aiuto.
Reso espliciti i campi obbligatori tramite asterisco (*) e helper text e introdotto messaggi di errore azionabili, evitando feedback generici.
UI CONVERSAZIONALE
Un assistente conversazionale che riconosce l'intento
Ho progettato e testato un assistente AI che riconosce l’intento dell’utente e attiva un percorso dedicato per i 3 scenari chiave del checkout:
Utilizzare un coupon (flusso verde)
Effettuare un pagamento (flusso blu)
Tracciare un ordine (flusso rosa)
Punto di partenza:
Ciao! Sono il tuo assistente per il checkout. Posso aiutarti con i codici promozionali, i problemi di pagamento o a tracciare il tuo ordine. Di cosa hai bisogno?
Attende l'input utente.
Scenario 1
Utilizzare un coupon
Il flusso riconosce keyword e sinonimi e guida l’utente nell’applicazione del codice, gestendo entrambi gli esiti:
Valido: conferma lo sconto applicato e aggiorna il totale.
Non valido: propone di riprovare o proseguire al prezzo corrente.
Test con codice valido
Test con codice non valido
Scenario 2
Effettuare un pagamento
Il flusso riconosce l’intento legato al pagamento e propone alternative in caso di frizione.
Express Checkout: Apple Pay, Google Pay o PayPal.
Riprova con carta: reindirizza al sistema di pagamento sicuro.
Test per checkout express
Test per carta di debito
Scenario 3
Tracciare l'ordine
Il flusso riconosce l’intento e guida l’utente nel recupero dello stato della spedizione.
L'assistente richiede e valida il numero d'ordine:
Valido: conferma stato, data di consegna e notifiche email.
Non valido: segnala l'errore e permette di riprovare.
Test per n° ordine valido
Test per n° ordine non valido
CONSIDERAZIONI FINALI
Dove, come e quando uso l’AI
Integro l’AI generativa in fase UX e UI: ricerca utente e analisi competitor, personas e user journey, prioritizzazione delle feature, wireframe e prototipazione.
Con un metodo sviluppato attraverso una specializzazione in "Generative AI for UI UX Design", un certificato in "Prompt Engineering" e relative credenziali digitali IBM.
Analizzo i dati prima di promptare.
Conduco la mia ricerca, individuo competitor, utenti e studio le informazioni disponibili.
Questo mi permette di valutare criticamente ciò che l’AI produce: riconoscere risultati non collegati ai dati forniti e decidere cosa includere, scartare o approfondire.
La parte più insidiosa è creare un prompt efficace.
In base all’obiettivo e alla fase progettuale, uso il prompt engineering per divergere, esplorando alternative e convergere sulle direzioni più rilevanti.
Applico diverse tecniche di prompting arricchite di dati contestuali per ottenere risultati pertinenti e ridurre il rischio di "allucinazioni dell’AI".