Abbiamo realizzato il
Geico Design System.
L’obiettivo del Geico Design System è fornire regole e linee guida per la creazione delle interfacce GeicoTaikisha su tutti i touchpoint.
Il Design System può essere utilizzato per progetti interni ed esterni e come linea guida per i fornitori di GeicoTaikisha nelle fasi di procurement.
Il risultato sarà la standardizzazione dell’esperienza utente per una maggiore usabilità ed una maggiore semplicità nell’utilizzo delle soluzioni software adottate da GeicoTaikisha.
Abbiamo scelto il design atomico come nostra metodologia per creare un sistema di progettazione ben strutturato e sostenibile, basato su cinque distinti tipi di elementi di crescente complessità: atomi, molecole, organismi, modelli e pagine. Il Design System riguarda principalmente i comportamenti e le interazioni dell’utente. Il Design System pertanto non riguarda solo le linee guida di stile.
Il progetto ha visto una prima fase dedicata all’assessment dell’esistente eco-sistema di applicativi. Questa attività ha consentito di definire il perimetro iniziale del Design System, le tipologie di utenti presenti ed i touchpoints di riferimento. In questa fase sono stati definiti anche il concept e l’architettura di base del Design System.
Durante la fase due, a seguito di una valutazione congiunta Enhancers\GeicoTaikisha, si è tracciata una roadmap di progetto per il rilascio del Design System.
Enhancers si è occupata della realizzazione di linee guida per ogni elemento core del design system come la definizione dei colori, dandone un’organizzazione logica e funzionale, ha poi definito una scala tipografica e fornito delle linee guida in modo da rendere l’informazione accessibile ad ogni tipo di utente.
Ma non solo, sono state fornite anche linee guida in merito alla griglia e al layout, alla leggibilità del testo, fino alla definizione della dimensione degli elementi come input field, empty state, notifications etc.
L’utilizzo di un Design System non solo armonizza tutti gli elementi del prodotto digitale aumentando la riconoscibilità del brand e migliorando l’esperienza utente ma in ultima analisi semplifica anche il lavoro degli sviluppatori.
L’adozione di un Design System porterà quindi a un risparmio sui costi di progettazione e sviluppo, grazie all’utilizzo di elementi di design standardizzati e alla riduzione del tempo e delle risorse necessarie per lo sviluppo.
Un primo esempio di applicazione del Geico Design System si può vedere nella creazione e applicazione degli stati degli action buttons. In questo caso sono stati creati 5 diversi stati dei pulsanti in base alle azioni da compiere in un preciso momento della navigazione: enabled, disabled, hover, focus, pressed. L’utilizzo dell’elemento button viene esteso anche per migliorare la navigazione dell’utente che potrà utilizzarlo per cambiare vista spostandosi da un’area all’altra della piattaforma.
J-Detect è un progetto che ha visto l’utilizzo del Geico Design System per la definizione delle nuove interfacce. Gli elementi come bottoni e input field sono stati pensati ed organizzati in modo che l’esperienza utente risulti il più fluida possibile.
Il contrasto dei colori è stato studiato per migliorare la leggibilità degli elementi e stabilire una scala gerarchica in base alla funzionalità e importanza di ciascun elemento.
Il Geico Design System ha visto la sua applicazione anche nel progetto Adamos dove sono state create delle interfacce custom in base alle esigenze dei diversi utenti: operatore, supervisor, manager.
In questo caso l’interfaccia è stata pensata per il manager che, attraverso l’area di data visualization, potrà monitorare le performance della macchina in modalità overview o dettagliata.
ATTIVITÀ
Cosa abbiamo fatto.
