News News

DeSI, il Design System di Italgas

Data di pubblicazione:
DeSI è il kit di elementi pronti all’uso e di linee guida di design per costruire interfacce digitali, che permette di sviluppare al meglio la presenza digitale del Gruppo Italgas. DeSI garantisce una brand experience uniforme su siti e app del Gruppo, per un'esperienza digitale che mette al centro l'utente e le sue esigenze. 

Prima in Italia e terza in Europa, Italgas guarda al futuro. Con oltre 180 anni di storia nella distribuzione di gas naturale, infatti, la società lavora, con costanza e passione, per migliorare sempre di più i rapporti con i propri utenti. Come? Utilizzando le tecnologie allo scopo di rendere sempre più efficaci i servizi, siano essi interni o esterni, e di continuare senza sosta nel processo di digitalizzazione e innovazione.  

LA NOVITÀ DEL DESIGN SYSTEM 

In quest’ottica, Italgas ha deciso di mettere a punto il proprio Design System: DeSI. Il progetto è stato portato avanti grazie alle competenze del team di Experience Designdella Digital Factory di Bludigit, società del gruppo che si occupa di innovazione e digitalizzazione. 

Si tratta più in generale di un sistema che mette a disposizione una libreria con una serie di componenti e linee guida per sviluppare prodotti digitali in linea con l’identità digitale del brand: siti e app rivolti all’interno, come l’Intranet o i portali per l’approvazione di richieste, ma anche siti e app rivolti all’esterno, come i portali dedicati ai clienti o i siti istituzionali. 

Con due elementi irrinunciabili: mantenere coerenza e continuità all’interno dell’ecosistema digitale aziendale; fornire regole di utilizzo e di accessibilità da rispettare per lo sviluppo di nuove piattaforme digitali. Fattori, questi ultimi, che guardano ovviamente da una parte all’interno del Gruppo stesso, dall’altra agli utenti e utilizzatori esterni, per rendere loro un’esperienza intuitiva, efficace e riconoscibile. 

DESI, I MOTIVI CHE LO RENDONO IMPORTANTE 

Con DeSI, Italgas offre una “cassetta degli attrezzi digitale a tutti i suoi interlocutori per supportarli nelle loro attività di progettazione e di sviluppo. Il Design System, infatti, include una serie di componenti che sono a disposizione di designer e sviluppatori per realizzare siti e applicativi. 

Una vera e propria libreria che ha diversi aspetti positivi. Oltre a una user experience gradevole ed efficace, DeSI crea in questo modo un linguaggio condiviso, che migliora la comunicazione, permette di restare costantemente allineati sulle nuove implementazioni, e riduce tempi e costi, includendo e rispettando i principi di usabilità e gli standard di accessibilità.

USABILITÀ E ACCESSIBILITÀ, ELEMENTI IMPRESCINDIBILI 

Ogni utente ha una diversa capacità sensoriale e cognitiva durante la fruizione di un sito web o di un’app. Per questo, occorre rendere quanto più inclusivi i servizi e le informazioni offerte. DeSI abilita e promuove i principi che sono alla base di questo ragionamento: l’usabilità e l’accessibilità. 

Per usabilità di un sito o di un app si intende la proprietà che lo rende comprensibile e facile da usare per chiunque lo incontri navigando in rete. Soddisfare agevolmente i bisogni dell’utente con semplicità, efficacia ed efficienza è l’obiettivo da raggiungere.
 Il principio di accessibilità nasce per rimuovere le barriere che in rete non consentono l’accesso alla fruizione delle informazioni o ai contenuti ad utenti con disabilità sensoriali (come visive o uditive), motorie o cognitive. Progettare interfacce accessibili significa quindi renderle disponibili a tutte le tipologie di utenti, mediante precisi accorgimenti progettuali (quali ad esempio: il contrasto fra testo, segni grafici e sfondo; l’utilizzo di specifici font, con dimensioni e interlinee ben specifiche...).

Con DeSI è possibile costruire un ecosistema digitale usabile e accessibile che rispetta la diversità di fruizione di ognuno. 

UNO STRUMENTO DINAMICO CHE GUARDA AL FUTURO 

DeSI sarà in continua  evoluzione, accogliendo non solo gli aggiornamenti proposti ed elaborati dal team interno, ma anche i feedback dai colleghi e dagli utilizzatori.

Nei prossimi mesi, DeSI guiderà il restyling e la progressiva riprogettazione degli asset digitali del Gruppo. Precursore di questo programma di lavoro è stato il sito ideas4italgas, la call permanente dedicata alle start up che puntano su progetti legati all’innovazione e alla sostenibilità. 

Noi – spiega Marco Barra Caracciolo, Ceo di Bludigit puntiamo molto su un progetto fondamentale per garantire un experience unica per le applicazioni del Gruppo e assicurare efficacia ed efficienza nelle fasi realizzative dei progetti digital. I prossimi passi prevedono l’allargamento della libreria di componenti sia nel numero, in base alle esigenze che emergeranno, sia nella tecnologia, sviluppando quegli stessi componenti nei principali framework utilizzati dagli applicativi del Gruppo Italgas. 

Infine, ma tema fondamentale, attraverso DeSI, l’obiettivo che ci siamo posti è quello di favorire l’inclusione attraverso l’innovazione e la digitalizzazione, elementi che rendono anche gli ambienti di lavoro più partecipativi e coesi, oltre ad assicurare un servizio semplice, intuitivo e accessibile a tutti i nostri clienti.

DeSI dunque guarda al futuro, con regole ben precise e un obiettivo altrettanto chiaro: offrire un sistema vivo che abbia la capacità di cambiare a seconda delle esigenze. Ma soprattutto che rispetti le abilità digitali di ogni utente, garantendo un’esperienza efficace e gradevole.  

FOCUS: IL METODO UTILIZZATO PER COSTRUIRE IL DESIGN SYSTEM 

L’atomic design è alla base di DeSI: si tratta di una metodologia modulare. 

Si parte dagli atomi (ad es. un link) che sono gli elementi più piccoli e indivisibili dell’interfaccia, per poi arrivare alle molecole, che sono la somma di più atomi e che funzionano insieme come un’unità specifica (ad es. il menu di navigazione di un sito, composto da più link). Gruppi di molecole danno vita agli organismi, una sezione relativamente complessa e distinta di un’interfaccia (ad es. l’intestazione di un sito, che comprende logo, menù, ricerca ecc.). Infine, più organismi combinati assieme creano i template: è in questo momento che si inizia a vedere il layout completo della pagina web o della schermata di un’app.