di Francesco Improta

Come designers di interfacce per il web ci siamo abituati per anni a progettare pagine.

La pagina è stata una metafora fondamentale per consentire alle persone di familiarizzare con Internet i primi anni (pensiamo a parole come paginazione, segnalibro, etc).
Ma al tempo stesso ha condizionato il nostro modo di lavorare.

Progettare per il web di oggi non può essere fatto con metodologie e flussi di lavoro incentrati sulle pagine ma piuttosto su un sistema di elementi che sia fruibile da qualunque device.
Anche quello non ancora sul mercato.

Dobbiamo ripensare il nostro processo di lavoro.

Siamo nell’era post-PSD già da qualche anno.

Il che non significa soltanto che Photoshop non sia lo strumento ideale per progettare interfacce. Non è questo il problema. Bensì il messaggio che passa quando si presenta un mockup ad un cliente perché stai dicendo “Questo è come tutti vedranno il tuo sito”.

Ma sappiamo che non è la realtà. Sarà piuttosto il modo in cui “alcuni utenti vedranno il tuo sito con un determinato device, in un determinato contesto”.
E non lo stiamo comunicando bene.

Come settore, abbiamo venduto siti web come dipinti. Invece dovremmo “vendere” la possibilità di fruire dei contenuti in modo semplice, veloce, indipendentemente dal dispositivo, dalla dimensione dello schermo e dal contesto d’uso.
Se riesci a convincere il tuo cliente a credere in questo processo, l’aspetto finale del sito non sarà l’unico argomento di discussione.

Cos’è un Design Systems

Tra tutte le definizioni di Design Systems quella che trovo più efficace viene raccontata da Josh Clark:

“Design systems are containers for institutional knowledge.”

Josh Clark, project manager e UX designer che ha seguito progetti come Techcrunch, Time, Exxon e molti altri, afferma che i design systems sono fondamentali perché contengono tutta la conoscenza necessaria per soluzioni reali a problemi di design.
Quando queste soluzioni sono tenute insieme inoltre da un linguaggio visivo consistente, da guidelines per la UX e per lo sviluppo, allora rappresentano veramente cosa un buon design deve essere per un’azienda, aiutando a riconoscere i problemi da risolvere.

Cosa c’è in un Design System

Un design system può contenere molte informazioni tra cui:

• Design Principles
• UX guidelines
• Development guidelines
• UI patterns
• Page templates
• Design tools
• Code repository
• Voice & Tone guidelines
• Writing guidelines
• Processes(contributing, maintenance, etc.)
• Resources(design files, external links, etc.)

La scelta di cosa inserire spetta al team responsabile della sua creazione. Esistono diversi esercizi di team che aiutano ad identificare quali sono gli quelli fondamentali per il progetto, uno di questi si chama People, Parts, Processe Exercise.

Vantaggi di un Design System

Realizzare un Design System:

• Promuove la coerenza visiva del nostro prodotto;
• Velocizza i tempi di produzione favorendo rilasci frequenti di nuove funzionalità;
• Crea un vocabolario condiviso, facilitando la collaborazione tra team e cliente e tra componenti dello stesso team;
• Diventa punto di riferimento essenziale per l’azienda e/o i prodotto/i a cui si rivolge (vedi ad esempio Material Design di Google);
• e Future friendly, evolve nel tempo adattandosi ai cambiamenti.

Cosa ci aspetta nel prossimo futuro

La creazione di Design Systems ci dà la flessibilità di cui abbiamo bisogno per lavorare con i dispositivi sconosciuti del futuro.
Comporta un cambiamento nelle metodologie e negli strumenti di lavoro, ma non nel modo di pensare.

Dobbiamo continuare a sperimentare e comunicare, in particolare nel settore del design, poiché le buone esperienze degli utenti sono il vero segno del successo dei nostri prodotti.

Vuoi imparare a creare un design language per prodotti digitali? Iscriviti al corso Design Systems di Francesco Improta a Roma e Milano!