Gift card, dal sito di vendita alla dashboard
Dashboard B2C e B2B e siti di vendita consumer per il leader italiano di carte di credito e loyalty: circa 500.000 titolari assistiti.
Il problema
Le dashboard di gestione mostravano tutto il dato disponibile e nulla di decisivo: i clienti aziendali non riuscivano a leggere le performance dei programmi loyalty senza assistenza commerciale.
Il mio ruolo
Ho progettato end-to-end tre prodotti collegati: la dashboard B2C dove i titolari attivano e gestiscono le carte, la dashboard B2B dove le aziende clienti seguono i loro programmi e i siti di vendita consumer come MyGiftCard, gerarchizzando i dati intorno alle decisioni reali. In parallelo ho introdotto metodologie di lavoro più snelle tra design, marketing ed engineering.
L’impatto
Meno ticket di assistenza e meno rilavorazioni sulle schermate dopo il rilascio. I clienti aziendali leggono le performance del proprio programma loyalty senza passare dal commerciale, e le call di onboarding si sono accorciate. I siti prodotto ridisegnati convertono più della versione precedente, e la libreria UI condivisa ha ridotto i tempi di lancio di una nuova campagna da settimane a giorni.
Dalla prima intervista al rilascio
I due lati di un ticket
Interviste con titolari di carte reali e con il customer care interno di Epipoli.
Prima le tre domande
Con il commerciale, le tre domande che ogni cliente aziendale fa davvero.
Tre prodotti, una struttura
Area titolari, dashboard aziendale e siti di vendita, mappati insieme.
Flussi, schermate, una libreria
Un compito per schermata e una libreria UI condivisa da B2C e B2B.
Meno ticket, meno rilavorazioni
Sono calati i ticket di assistenza e le rilavorazioni sulle schermate dopo il rilascio.
Ricerca: le persone ai due lati di un ticket
Ho intervistato titolari di carte reali, per vedere come attivano davvero una carta, controllano il credito e la ricaricano, e il customer care interno di Epipoli, che risponde quando uno di questi passaggi va storto. Sentire lo stesso percorso dai due lati ha mostrato quali momenti diventavano richieste di assistenza.
Sul lato aziende ho lavorato con il commerciale sulle domande che i clienti continuavano a fargli. Da lì è nato il brief dei tre prodotti: prima la risposta per cui le persone arrivano, e ogni passaggio che generava un ticket o sparisce o ha il suo aiuto al posto giusto, prima dell’errore.
Tre prodotti, una struttura
Ogni pubblico ha il suo prodotto e la sua navigazione, costruiti con gli stessi componenti: una modifica alla libreria arriva a tutti e tre.
- Attivazione
- Codice carta
- Documento d’identità
- Carta attiva
- Carte attive e scadute
- Saldo e limite di ricarica
- Dati della carta, dietro un’azione esplicita
- Movimenti, per mese
- Wallet: credito e ogni ricarica
- Carte, per sede
- Ricariche: a mano o da template
- Operatori
- Notifiche
- Assistenza
- Prima i servizi: attivare una carta, verificare il credito
- Gift card dei grandi marchi, prezzo da
- Business: la gamma è la navigazione
- Carte prepagate, gift, multibrand e welfare
- Attivazione e aiuto nella stessa barra
Una sola libreria UI condivisa dai tre prodotti: stessi componenti e stesso linguaggio visivo, flussi pensati per ogni pubblico.
Attivazione carta: un compito per schermata
Il flusso che un titolare segue per attivare una MyGiftCard. Ogni passaggio chiede una cosa sola: il codice carta di 16 caratteri, poi il documento d’identità richiesto dalle norme antiriciclaggio, poi una conferma che porta subito alla carta invece di chiudere il percorso. L’aiuto sta accanto al campo che spiega, prima dell’errore, e quello che serve è elencato prima che il modulo cominci. Desktop e mobile usano gli stessi componenti.
- Passo 1
Codice carta
16 caratteri, con l’aiuto prima di qualsiasi errore.
- Passo 2
Documento d’identità
Perché serve e cosa preparare, prima del modulo.
- Passo 3
Carta attiva
Il percorso non finisce qui: un pulsante apre la carta.
- Passo 4
La tua carta
Saldo, ricarica e movimenti nella prima schermata.
Dashboard B2B: operazioni massive, senza sorprese
La dashboard con cui le aziende gestiscono le carte che distribuiscono: un wallet con il credito disponibile e ogni ricarica, l’elenco delle carte per sede con azioni sulle righe selezionate, e le ricariche massive inserite a mano o caricate da template. Ogni pagina si apre con una riga che dice a cosa serve, il totale da ricaricare resta in vista mentre lavori, e le carte che non si possono ricaricare restano in elenco, disattivate, così niente sparisce.
- Passo 1
Wallet
Si parte dal credito disponibile.
- Passo 2
Carte per sede
Si selezionano le righe su cui agire.
- Passo 3
Ricarica
A mano o da template, con il totale sempre in vista.
- Passo 4
Conferma
Una sola conferma, poi il wallet mostra cosa è uscito.
Ricostruzione schematica, non uno screenshot
Siti di vendita: prima i servizi, poi il negozio
I siti di vendita condividono il design system delle dashboard. Su MyGiftCard, il negozio consumer, i servizi per cui si torna, attivare una carta o verificare il credito, stanno sopra tutto il resto, e subito dopo vengono le gift card dei grandi marchi, ognuna con il prezzo di partenza e una sola azione di acquisto. Su MyGiftCard Business, il sito per le aziende, la navigazione è la gamma stessa, dalle carte prepagate alle welfare card, con attivazione e aiuto nella stessa barra.
Alternative a confronto: tutti i dati, o prima le tre domande
Come doveva aprirsi la dashboard aziendale, deciso con il commerciale e il cliente.
Tutti i dati disponibili
Come funzionavano le vecchie dashboard.
- Completa, ma niente di decisivo
- I clienti avevano bisogno del commerciale per leggere il proprio programma
Prima le tre domande
Ogni vista si apre su quello che i clienti chiedono davvero; il resto passa in secondo piano.
- Dato principale, andamento, dettaglio: lo stesso ordine in ogni vista
- Ogni pagina si apre con una riga che dice a cosa serve
I clienti aziendali leggono le performance del proprio programma senza passare dal commerciale, e le call di onboarding si sono accorciate.
Decisioni chiave
Partire dalle domande, non dai dati.
Ho definito con il commerciale le tre domande che ogni cliente fa davvero, e la dashboard è stata costruita per rispondere a quelle; il resto è passato in secondo piano.
Una gerarchia sola, ripetuta.
Stesso schema in tutte le viste (indicatore, andamento, dettaglio): così chi impara una schermata ha imparato tutte le altre.
Un design system solo, due esperienze distinte.
B2C e B2B condividono componenti e linguaggio visivo, ma i percorsi sono progettati sul target: sui siti consumer conta la scelta rapida del prodotto, sulle piattaforme aziendali il controllo e la lettura dei dati.