Guida passo passo alla creazione di un sistema di progettazione

Introduzione

Nell'era dell'accessibilità ovunque e dappertutto, l'ubiquità è diventata una norma. Tuttavia, è altrettanto noto che la coerenza è credibilità. Gli utenti sono ora più consapevoli. Un'esperienza rapida e fluida è un'aspettativa di base, indipendentemente dall'interfaccia.

Inoltre, il tempo è un bene che non potete permettervi di sprecare. Tutti questi elementi dovrebbero essere sufficienti per spingervi a fare di più con il vostro sito web o la vostra interfaccia. Tuttavia, cercare di essere coerenti con 50 diversi componenti del design senza errori è un'impresa ardua.

Il" Design System" è qui per semplificarvi la vita.

Che cos'è un sistema di progettazione?

Un sistema di progettazione è un ampio archivio di componenti riutilizzabili chiaramente documentati che il team di prodotto può sfruttare per creare esperienze digitali. In altre parole, i sistemi di progettazione sono la singola fonte di verità per un'azienda per quanto riguarda la progettazione.

Più che guide di stile o librerie di modelli, un sistema di design è in continua evoluzione. Questo ecosistema di linee guida relative a varie entità, tra cui il design UX, può essere utilizzato come struttura di blocchi di costruzione per qualsiasi progetto, per garantire che tutti i componenti siano coerenti e in linea con il branding.

Sebbene sia utile per le start-up, le aziende in crescita e le imprese, un sistema di progettazione diventa una risorsa essenziale e non negoziabile durante lo sviluppo di un prodotto. Può anche influenzare positivamente gli obiettivi aziendali, il flusso di lavoro, il lavoro di squadra, l'esperienza dell'utente e l'esperienza complessiva del marchio.

alt_text

Quali sono i vantaggi di un sistema di progettazione?

Alcuni dei vantaggi dell'implementazione di un progetto di sistema sono

Aumenta l'efficienza e riduce i tempi - Un vantaggio primario di qualsiasi sistema di progettazione è la capacità di creare e ricreare rapidamente il lavoro di progettazione e sviluppo. I team possono utilizzare elementi preconfezionati per ridurre la necessità di reinventare continuamente la ruota e ridurre il rischio di incoerenza.
Migliora la coerenza visiva tra le pagine e i canali - La mancanza di un sistema di design a livello di organizzazione può portare a immagini incoerenti, a un'esperienza utente frammentata o all'isolamento dal branding. Un insieme coeso di standard aiuta anche a gestire le riprogettazioni più importanti o i rebrand visivi su larga scala.
Promuove un linguaggio unificato - Un linguaggio di progettazione condiviso riduce la possibilità di sprecare tempo nella progettazione o nello sviluppo a causa di una comunicazione errata all'interno e tra team interfunzionali.
Permette di concentrarsi meglio su problemi più complessi - I team possono risolvere meglio problemi complessi, come la prioritizzazione delle informazioni, la gestione dei viaggi e così via, quando vengono creati componenti dell'interfaccia utente semplici e inequivocabili.
Serve come strumento di riferimento e di formazione per i collaboratori - Un sistema di progettazione facilita il processo di onboarding in caso di cambiamenti del personale. Inoltre, aiuta a facilitare l'ingresso di nuovi collaboratori nella progettazione UI UX o nella creazione di contenuti.
Contribuisce a creare un marchio forte e senza tempo - Lo scopo di un sistema di design è quello di comunicare un'identità e un design particolari dietro i prodotti che trasporta. Contribuisce a creare marchi d'impatto e aiuta le persone a ricordare l'esperienza del marchio. Questo fa sì che le persone si sentano più legate a un marchio e si fidino maggiormente di esso.

Guida in dieci passi alla costruzione di un sistema di progettazione

Abbiamo elaborato un processo in dieci fasi per aiutare la vostra azienda a creare un sistema di progettazione.

1. Analizzare a fondo il processo di progettazione esistente.

Il primo passo per la definizione di una strategia e l'avvio di un processo è la comprensione della situazione attuale. Rivedere e analizzare l'attuale processo di progettazione della vostra organizzazione può aiutarvi a comprendere meglio il design del sistema più adatto al vostro marchio. Ponetevi le seguenti domande:

Qual è l'attuale approccio progettuale della vostra organizzazione?
Quali sono gli strumenti esistenti che la vostra organizzazione utilizza?

Assicuratevi di valutare il livello di maturità progettuale del team di prodotto. Questo vi aiuterà ad accedere in modo approssimativo al tempo necessario per implementare il nuovo sistema nella vostra organizzazione.

2. Determinare l'alfabeto del marchio

Determine your Brand's Alphabet

L'alfabeto di un marchio porta all'identità del marchio, cioè ai valori del marchio e del prodotto e al linguaggio del marchio. Il linguaggio del marchio comprende forme, caratteri, colori, animazioni, voce e tono.

I designer utilizzeranno un linguaggio visivo definito dall'alfabeto del marchio. Rivedere le linee guida del marchio e parlare con gli stakeholder può aiutare a comprendere l'identità e il linguaggio del marchio.

3. Conduzione dell'audit per l'attuale prodotto AI

La verifica dell'interfaccia utente (UI) del prodotto attuale vi aiuterà ad affrontare una delle principali sfide del design del prodotto: la duplicazione del design. L'audit mira a raggiungere due obiettivi

Richiamare l'attenzione sulle aree del prodotto che presentano incongruenze significative.
Individuare gli elementi più utilizzati ed essenziali del prodotto.

La verifica dell'interfaccia utente è un processo a più fasi. È fondamentale identificare e analizzare le principali proprietà dell'interfaccia utente e il loro utilizzo nei componenti. Si possono utilizzare gli strumenti disponibili per vedere il numero di colori e caratteri unici nei fogli di stile. È quindi possibile scomporre ulteriormente il design di ogni sito web in singoli elementi.

4. Stabilire i principi di progettazione del sistema

Per creare un'esperienza utente eccellente, è indispensabile comprendere le ragioni alla base delle decisioni di progettazione. Inoltre, una serie di obiettivi chiari facilita la definizione dei principi di progettazione e il coordinamento con i team.

Volete avere un processo di progettazione di sistema? Iniziate con queste domande:

Cosa state creando
Perché lo stai facendo
Come lo costruirete

I principi del design devono riflettere i valori e la visione del marchio.

5. Creare una libreria di componenti

Conosciuta anche come libreria di modelli, questa dovrebbe includere tutti gli elementi funzionali e decorativi dell'interfaccia utente. Valutate i componenti in base al progetto, alle esigenze degli utenti e agli obiettivi aziendali e scegliete quelli necessari.

Build a Component Library

6. Stabilire le regole

I sistemi di progettazione non sono costruiti per limitare i progettisti a una specifica direzione di progettazione. Al contrario, si suppone che forniscano a progettisti e sviluppatori un quadro fondamentale che estende la direzione creativa e lascia spazio all'innovazione.

Si tratta di due approcci alle regole del sistema di progettazione, come indicato nel libro di Alla Kholmatova:

Regole rigorose - Progettisti e sviluppatori seguono un processo rigoroso per introdurre nuovi modelli o componenti.
Regole non rigide - Queste regole consentono ai designer e agli sviluppatori di creare senza attenersi a vincoli rigidi, se ritengono che ciò porti a un design migliore.

Come per molti altri aspetti della vita, è essenziale trovare il giusto equilibrio tra queste regole, in modo che il prodotto possa essere coerente e allo stesso tempo creativo.

7. Scegliere il modello di governance

Sistemi di progettazione dinamici e in continua evoluzione richiedono un processo semplice di approvazione e implementazione delle modifiche. Esistono tre modelli di governance:

Modello solitario - Un individuo o un gruppo di individui "governa" direttamente il processo del sistema di progettazione.
Modello centralizzato - Un team è responsabile e guida l'evoluzione del sistema.
Modello federato - Più persone di diversi gruppi guidano il processo di progettazione del sistema.

Ognuno di questi modelli ha i suoi pro e i suoi contro, ma soprattutto il modello solitario può portare l'individuo incaricato a diventare un collo di bottiglia per l'esecuzione di molti compiti. La cosa migliore è utilizzare una combinazione di modelli diversi, in linea con le vostre esigenze.

8. Definire la struttura dei componenti

La duplicazione dei componenti funzionali è una sfida significativa nei sistemi di progettazione. Ciò si traduce in un sistema poco flessibile e richiede ai progettisti (e agli sviluppatori) di creare nuovi elementi ogni volta che si presenta un nuovo scenario.

I progetti di sistema di successo sono altamente riutilizzabili e consentono agli utenti di usarli come base per i loro prodotti. Si raccomanda quindi di sviluppare elementi che possano essere riutilizzati in diversi contenuti.

Criteri per componenti riutilizzabili e scalabili:

Modulare - Componenti indipendenti ed elementi intercambiabili.
Composable - Fondere i componenti esistenti per crearne di nuovi
Personalizzabili - Componenti personalizzabili che funzionano in una moltitudine di contesti.

9. Assicurarsi che tutti i team utilizzino un linguaggio unificato

Lo scopo di un sistema di progettazione è facilitare il lavoro di squadra senza soluzione di continuità. Pertanto, l'integrazione del sistema nel flusso di lavoro dei team è fondamentale. Aumenta la produttività e fornisce valore ai membri del team.

Una migliore comprensione del modo in cui le varie persone utilizzano il sistema di progettazione nel processo di integrazione iniziale può aiutare a modificare il sistema di conseguenza.

10. Convogliare regolarmente i cambiamenti

Il processo di un sistema di progettazione si evolve con l'organizzazione e non può essere statico. Pertanto, dopo aver introdotto il sistema nell'organizzazione, è essenziale comunicare tutte le modifiche e tenere aggiornata l'organizzazione.

Un changelog conciso e ben curato può aiutare gli utenti a capire i vari aggiornamenti e il loro impatto sul lavoro.

Tre esempi esemplari per cominciare

Sistema di progettazione Atlassian

Atlassian Design System (https://atlassian.design/)

Atlassian Design System, una famosa azienda australiana di software aziendale, mira a fornire una collaborazione senza soluzione di continuità tra team agili e dispersi in tutto il mondo.

Trello e Jira, due dei più diffusi strumenti di collaborazione di Atlassian, riflettono appieno la filosofia progettuale dell'azienda. Questa filosofia consiste nello sfruttare l'esperienza digitale per aumentare la produttività e il potenziale complessivo dei team e dei singoli membri del team.

Detto questo, Atlassian Design System offre tecniche agili e un monitoraggio efficace di ogni singola fase di un progetto, dalla pianificazione del prodotto alla consegna. Questo produce in ultima analisi risultati positivi nella creazione e nella consegna dei prodotti. Il loro sistema di progettazione comprende principalmente:

Linee guida per la progettazione
Standard del marchio
Prodotto
Illustrazione
Prototipazione
Marketing
Personalità

Sistema di progettazione IBM

IBM Design System (https://carbondesignsystem.com/migrating/guide/design)

IBM è un ottimo esempio di grande azienda IT che opera a livello globale e segue un proprio sistema di progettazione.

Le loro capacità includono tutto, dalla consulenza aziendale al finanziamento, dalla creazione di software all'hosting/gestione IT e alle soluzioni che collegano il software all'hardware.

Il principio fondamentale di IBM è quello di guidare costantemente il progresso, sia esso della società umana o di un marchio, utilizzando la scienza, la ragione e l'intelletto.

Secondo IBM, avere un buon design non è solo una necessità, ma anche un impegno nei confronti degli utenti. Ecco alcune delle caratteristiche principali del Carbon Design System, che offre a sviluppatori e designer che lavorano con Adobe, Axure e Sketch una grande quantità di strumenti e risorse:

Visualizzazione dei dati
Modelli
Componenti
Linee guida
Tutorial

Sistema di progettazione Uber

Uber Design System (https://baseweb.design/)

Tutti noi abbiamo preso almeno una volta un Uber. L'azienda tecnologica americana si basa sul movimento, tra cui la consegna di cibo, il ride-hailing, il ridesharing peer-to-peer e la micromobilità con scooter e biciclette elettriche.

Uber ha bisogno di un sistema di progettazione efficiente per far sì che questo tipo di servizio funzioni in modo impeccabile in tutti i sottomarchi, quelli interni, i prodotti e i progetti.

Gli attributi principali di Uber Design System sono:

Architettura del marchio
Composizione
Tono di voce
Movimento
Illustrazione
Fotografia
Iconografia
Colore
Logo
Tipografia

Suggerimenti da conoscere prima di creare il vostro primo sistema di progettazione

1. Una comunicazione chiara e tempestiva è il vostro nuovo migliore amico

Può essere complicato coinvolgere subito i consumatori interni. In effetti, il loro feedback può ostacolare il processo se è ambiguo, se viene fornito troppo presto in un ciclo di rilascio alfa o beta o se non è utile.

Dite ai vostri clienti, gli utenti del sistema di progettazione, di cosa avete bisogno per assicurarvi di ricevere un feedback costruttivo. Se siete in un ciclo iniziale di pre-rilascio, siate onesti e chiari sull'esatto input che volete. Questo indica che state cercando i difetti più significativi del prodotto e non critiche ad alta fedeltà.

Fate attenzione a non pensare troppo, a non far appassire la vostra mente, ma non esitate a comunicare troppo.

2. I vostri passi non sono l'unica cosa da tracciare

Un elemento cruciale che manca alla definizione delle priorità è spesso il monitoraggio dell'utilizzo dei sistemi di progettazione. È fondamentale capire dove viene utilizzato il sistema, da chi, con quale frequenza e la frequenza degli aggiornamenti.

L'implementazione di una raccolta statistica giornaliera su quali team utilizzano esattamente quali versioni della libreria consente di comprendere il tasso di adozione, aggiornamento e declassamento.

Quando si identificano i team che aggiornano raramente, è possibile individuare i problemi che bloccano l'aggiornamento e quindi risolverli.

3. I meccanismi di feedback sono sottovalutati quanto Rhaeghal di GOT

Per garantire che il vostro sistema non sia solo prezioso per gli utenti, ma anche qualcosa di cui si sentano parte e a cui abbiano contribuito attivamente, è fondamentale disporre di modi semplici e diretti per fornire feedback (Slack, e-mail, ecc.) e contribuire al sistema.

Fornite sempre istruzioni su come e dove fornire feedback nel maggior numero possibile di aree e non date mai per scontato nulla, soprattutto che l'utente lo trovi nella posizione che ritenete più ovvia.

Un sistema di progettazione è la stella polare di cui la vostra organizzazione ha bisogno

A Design System is the North Star Your Organization Needs

Un sistema di design ben realizzato e di successo diventa parte integrante della struttura portante di un'azienda, dando vita a esperienze coerenti e amplificate. Inoltre, i progettisti e gli sviluppatori hanno l'opportunità di comunicare meglio lo scopo del prodotto, invece di limitarsi a mettere insieme gli elementi di base.

Qualsiasi generalista può essere il vostro partner nella realizzazione di un progetto, ma solo uno specialista del design identifica i problemi, le sfide e le aspirazioni attuali per creare un sistema di design, appositamente per voi. Non è il momento di aspettare. Con questa guida completa su come creare un sistema di progettazione, vi manca solo un'iniziativa per trasformare completamente il vostro processo produttivo.