Product Design

Design system: cos’è e a cosa serve

9 Febbraio 2023

4 min lettura

Il modo in cui le aziende sviluppano i prodotti sta cambiando rapidamente, sempre più persone utilizzano i prodotti digitali e vi accedono in più modi che mai. Basti pensare con quale estrema facilità passiamo dal guardare un contenuto sullo smartphone alla Smart TV. Tutti questi nuovi punti di contatto che si creano fra utente e […]

Denis Simeon

Il modo in cui le aziende sviluppano i prodotti sta cambiando rapidamente, sempre più persone utilizzano i prodotti digitali e vi accedono in più modi che mai.

Basti pensare con quale estrema facilità passiamo dal guardare un contenuto sullo smartphone alla Smart TV.

Tutti questi nuovi punti di contatto che si creano fra utente e azienda richiedono un ritmo più veloce nell’innovazione e nella creazione dei prodotti, nonché un maggiore bisogno di coerenza da parte del brand.

Per fare ciò le aziende utilizzano i design system.

Che cos’è il design system?

Il design system è un potente strumento composto da una raccolta di componenti, principi e linee guida destinato alla progettazione di prodotti digitali.

Esso garantisce benefici all’azienda e al team di sviluppo, finendo anche per assicurare un’esperienza coerente all’utente finale, indipendentemente dal dispositivo o dalla tecnologia utilizzata.

Spesso però abbiamo un’idea sbagliata dei sistemi di progettazione, ovvero li consideriamo come solo un set Lego di assets e componenti da utilizzare per costruire un prodotto.

A nostro avviso, il design system è l’incarnazione stessa di un sistema di concetti che definiscono un brand, stiamo parlando quindi non solo di linee guida e principi, ma anche di filosofia e linguaggi di un brand.

A cosa serve il design system?

I design systems servono come riferimento per i diversi team coinvolti nella progettazione di prodotti digitali e per migliorare la comunicazione fra i reparti, non solo designer e sviluppatori quindi ma anche ad esempio copywriter, project manager o CEO.

Utilizzare un design system accende i riflettori su come un team progetta, è uno strumento ideale che ha come obiettivo la progettazione su larga scala, portando alla creazione di un linguaggio condiviso e una coerenza visiva tra i diversi elementi del layout.

Le componenti dei systems design

Come abbiamo detto prima, i design systems sono molto di più di librerie di componenti, andiamo perciò a vedere quali sono gli elementi più comuni che compongono un sistema di progettazione:

1. Libreria di componenti

Conosciuto meglio come UI Kit, questa libreria contiene una raccolta di componenti di User Interface come button, form, menù, checkbox e così via. 

2. Libreria dei pattern

È una raccolta di soluzioni di design ricorrenti progettate sui modelli mentali del pubblico.

Per esempio, un menù verticale a drop down è utilizzato per mostrare un elenco di opzioni. 

3. Brand guidelines

Le brand guidelines sono delle regole che governano non solo come un brand deve apparire ma anche come comunicare.

Solitamente dirigono quali colori e font utilizzare, oppure lo stile delle immagini e come deve essere usato il logo.

Queste guidelines sono molto importanti per mantenere una coerenza nella comunicazione, di qualsiasi tipo essa sia.

4. Brand values

I valori del marchio sono le convinzioni e i principi che un’azienda rappresenta e desidera comunicare ai propri clienti e al pubblico.

Questi valori vengono utilizzati per guidare il processo decisionale dell’azienda e modellare i suoi messaggi.

5. Design principles

I design principles sono un insieme di valori che mantengono l’intero team sullo stesso percorso durante il processo di progettazione.

I principi di progettazione dovrebbero essere specifici, sfumati e utilizzabili.

Ad esempio i design principles di Spotify è TUNE (tone, usable, necessary, emotive).

6. Libreria di icone

È una raccolta di icone in diversi formati e stili che possono essere utilizzate nei progetti digitali.

7. Content guidelines

È comune trovare nei design system anche le linee guida per i contenuti.

Aiutano a garantire coerenza e qualità in tutti i contenuti, oltre ad allinearli al marchio. 

8. Accessibility guidelines

Le linee guida sull’accessibilità sono un insieme di standard e raccomandazioni che contribuiscono a garantire che tutti gli utenti, indipendentemente dalle loro capacità, possano accedere e utilizzare il prodotto.

7. Design tokens

I design token usano nomi con valori codificati che rappresentano elementi dell’interfaccia come colori, caratteri, spaziatura, animazioni e così via, per la creazione di interfacce multipiattaforma, consentendo una comunicazione più veloce fra developer e designer.

I vantaggi del system design

Un design system professionale è in grado di fare la differenza, infatti grazie ad esso traggono vantaggio sia il team che gli utenti.

Per il team, si riduce la tempistica dello sviluppo con la possibilità di concentrarsi su problemi di maggiore importanza, piuttosto che su semplici elementi dell’interfaccia.

L’azienda vede diminuire i costi di sviluppo del prodotto e l’aumento di utenti grazie al miglioramento della UX e alla coerenza fra le diverse piattaforme.

Per gli utenti, ci sarà un’elevata fruibilità d’uso, un’esperienza di navigazione semplice e veloce e una sensazione di familiarità nell’utilizzo del servizio o prodotto digitale.

Esempi di successo di systems design

Nel corso degli ultimi anni il numero e la velocità con cui si progettano le interfacce è aumentato drasticamente.

Tutte le grandi digital company hanno investito nella creazione del loro design system, qui di seguito i design system migliori:

  • Material Design: sviluppato da Google, questo è uno degli scrigni per la progettazione di design semplici ed eleganti;
  • Human Interface Guidelines: Apple fornisce una serie di risorse pratiche e linee guida visive, costruite sui principi di design di Steve Jobs;
  • Fluent Design System: sviluppato da Microsoft, questo design system è molto innovativo e in linea con i trend del momento;
  • Atlassian Design System: uno dei migliori in termini di completezza; 
  • IBM Carbon Design System; brilla con le sue caratteristiche principali, offrendo numerosi strumenti e risorse visive per i designer e gli sviluppatori di Adobe, Axure e Sketch;
  • Polaris: fornisce una guida per la progettazione della piattaforma Shopify;
  • Uber: il colosso dello spostamento ci regala un impeccabile design system;
  • Airbnb Design System: il linguaggio di Airbnb per costruire esperienze impeccabili;
  • Designers Italia: è il punto di partenza sviluppato per la creazione di prodotti digitali per le pubbliche amministrazioni in Italia. Ideato per garantire servizi digitali semplici, accessibili, equi e inclusivi per tutti i cittadini;
  • Sirio: il design system costruito per INPS (Istituto Nazionale della Previdenza Sociale).

Se ti va di approfondire ti consigliamo di visitare anche ADELE, una repository pubblica gratuita fornita da UXPin, con tantissimi altri design system di grandi aziende in tutto il mondo.

Conclusioni

Ora hai imparato come il Design System può rivoluzionare il modo in cui si progettano prodotti digitali e come questi possono crescere nel tempo.

Se hai bisogno di un supporto con il tuo prodotto digitale, puoi contattarci oppure approfondire e migliorare le sue competenze nei nostri corsi di formazione.


Denis Simeon

UX/UI Designer

Su di me:

freccia arancione che indica il titolo della sezione

Mettiamoci al lavoro

Hai un’idea pazzesca?Trasformiamola in realtà.

Prenota una call con il team

Diventa la persona più
informata sul design

Più di 15 mila iscritti alla newsletter che in soli
10minuti a settimana si aggiornano con
tante novità e consigli sul mondo della UX/UI
design e product design. Non male, vero?