Agents Area Illumia

PROBLEMA CENTRALE

Un sistema che tutti usavano e che nessuno aveva progettato

Il portale agenti di Illumia era la spina dorsale operativa dell'intera organizzazione di vendita e post vendita: ogni contratto, ogni ricerca cliente, ogni azione sulle fatture passava di lì. Ma era cresciuto senza una direzione di design. Una navigazione che portava le persone nel posto sbagliato, form che cancellavano i dati senza avvisare, nessun dialogo di conferma prima delle azioni distruttive, un modello di permessi complesso tra canali e ruoli, e oltre 15 nuove funzionalità da progettare in parallelo al redesign stesso. Non era un progetto greenfield. Era il redesign di un sistema vivo da cui centinaia di agenti dipendevano ogni giorno.

DISCOVERY

Analisi AS-IS

Prima di toccare una schermata ho analizzato ogni flusso esistente, come login, creazione contratti, ricerca cliente, gestione ordini, fatturazione e gestione documentale, etichettando ogni osservazione come pain point, nota o vincolo di sviluppo. Quelli che sembravano bug isolati si sono rivelati tre fallimenti sistemici che si ripetevano su tutta la piattaforma: assenza di dialoghi di conferma prima delle azioni distruttive, mancanza di feedback sullo stato dei form (CTA sempre attive, errori senza indicazioni per risolverli) e navigazione a step non funzionante (il tasto indietro riportava alla home, gli step completati non erano navigabili). Ho usato l'AI per raggruppare centinaia di osservazioni dell'audit per tipo di interazione, trasformando una lunga lista di note in una diagnosi chiara che ha orientato direttamente il lavoro successivo.

I requisiti del cliente

Il cliente aveva raccolto i requisiti attraverso interviste interne con agenti e manager. L'intuizione strutturale decisiva. La piattaforma serve due tipi di canale profondamente diversi. I canali con consulenti hanno accesso completo, quindi al flusso di order entry, alla ricerca cliente completa, alle viste dati differenziate per ruolo. I canali senza consulenti (teleselling) hanno una superficie ridotta, con azioni limitate. Non era un problema di permessi, richiedeva un'architettura dell'informazione diversa per ogni contesto.

Ho usato l'AI per condurre una gap analysis tra l'inventario delle funzionalità esistenti e i nuovi requisiti, individuando quali flussi andassero estesi, quali richiedessero un redesign completo e quali avessero dipendenze back-end ancora aperte. Questo ha evitato di iniziare a progettare funzionalità non ancora pronte.

DECISIONI UX

Dalla struttura alla schermata

L'architettura dell'informazione è stata ricostruita attorno a un principio: l'interfaccia deve comunicare che tipo di strumento è, non limitarsi a organizzarne i contenuti. La nuova navigazione laterale ha introdotto due zone esplicite, un Sales Hub (order entry, ricerca offerte, bozze, offerte in attesa di firma) e un Centro clienti (ricerca clienti, pratiche, fatture, clienti cessati, documenti), che rispecchiano le due modalità mentali in cui lavorano gli agenti. I canali senza consulenti non vedono affatto il Sales Hub, non ne vedono una versione disattivata.

La pagina di dettaglio cliente è diventata un hub operativo a tab, con un header persistente che mostra scoring del cliente, segmento, numero di contratti e stato dei pagamenti. Il wizard di creazione contratto è stato unificato in un solo flusso a 6 step per gas, luce e fibra, con pannello di riepilogo sempre visibile, validazione in tempo reale e possibilità di salvare e uscire a ogni step.

Prima di disegnare un wireframe ho usato l'AI per simulare i percorsi di 8 profili di agente attraverso l'architettura proposta, facendo emergere due lacune strutturali che sono state risolte prima che venisse progettata qualsiasi schermata.

IMPLEMENTAZIONE

Concept design

I wireframe annotati coprivano ogni flusso primario, con la documentazione esplicita di regole di business, edge case e comportamento dei componenti direttamente sul canvas. Il wizard di creazione offerta richiedeva di gestire una matrice combinatoria di tipi di utility × segmento × prestazione × modalità di sottoscrizione × permessi di canale. Ho usato l'AI per generare la matrice completa degli edge case, sostituendo giorni di mappatura manuale della logica. Su oltre 60 schermate, una revisione del microcopy assistita dall'AI ha segnalato incoerenze di tono, etichette non allineate ed empty state mancanti. Il risultato è entrato a far parte del pacchetto di handoff.

Visual design

La UI è stata costruita in continuità diretta con la Customer Area di Illumia, il portale B2C che avevo progettato in precedenza (lo trovi tra i miei progetti), così gli agenti che passano da una superficie all'altra condividono lo stesso linguaggio visivo. Il design system è stato esteso con componenti specifici per il B2B: tabelle dense e ordinabili con menu contestuali, layout di wizard con pannelli di riepilogo sempre visibili, badge di stato delle offerte e una shell di navigazione consapevole del ruolo.

La copertura responsive è stata progettata per intero, dal mobile a 375px al tablet fino al desktop più ampio, con decisioni esplicite a ogni breakpoint su quali colonne nascondere, su come collassa la navigazione e su come i flussi di azioni dispositive restano usabili quando gli agenti assistono i clienti di persona.

RETROSPETTIVA

La maggior parte dei problemi emersi nell'AS-IS non erano difetti isolati dell'interfaccia, erano punti in cui regole di business complesse non erano mai state progettate per essere comunicate con chiarezza. I momenti assistiti dall'AI in questo progetto non sono stati scorciatoie. Sono stati un modo per gestire la complessità analitica di un incarico di 8 mesi affrontato da sola, a una scala che normalmente richiederebbe un team.