Condividi tramite


Bilanciamento dello stile e della coerenza

Nota: questo articolo è una bozza anticipata per Windows 10 RS2. I nomi delle funzionalità, la terminologia e la funzionalità non sono finali.

Quando si progetta un prodotto, si è l'avvocato per il cliente. Tutti cerchiamo di creare il design migliore appropriato e vero per il nostro intento. Questo articolo illustra l'equilibrio tra le convenzioni seguenti per creare un'esperienza utente coerente rispetto alla creazione di funzionalità ed esperienze univoche che differenziano l'app.

L'importanza della coerenza

Perché la coerenza è importante? La coerenza può semplificare l'uso di un'app. Una parte fondamentale del buon design è l'apprendimento; avere una progettazione coerente tra le app riduce il numero di volte in cui l'utente finale deve "riapprendo" come usarli. Guarda gli esempi reali: un pedale a gas è sempre a destra, una manopola porta ruota sempre in senso antiorario per aprire, un segno di stop è sempre rosso.

Rendere coerente un'app non significa fare in modo che tutte le app si comportino in modo identico tra loro, tuttavia. Tornando agli esempi reali, c'è un numero quasi infinito di design di sedie, ma pochissimi di loro richiedono di ri-imparare a sedersi. Ciò è dovuto al fatto che gli elementi importanti, ovvero la superficie seduta, sono abbastanza coerenti per consentire all'utente di comprenderli.

Una delle sfide nella creazione di una progettazione di app ottimale è comprendere dove è importante essere coerenti e dove è importante essere univoci.

Spettro di coerenza

È utile considerare la coerenza come uno spettro con due estremità opposte:

Spettro di coerenza

Gli elementi familiari dell'esperienza includono:

  • Paradigmi dell'interfaccia utente stabiliti (comportamento su un clic del mouse, pressione e mantenimento su un elemento, icone simili)
  • Elementi del tuo marchio che vuoi applicare tra prodotti (tipografia, colori)

I differenziatori includono:

  • Elementi che formano l'unica "anima" dei prodotti
  • Elementi che consentono di personalizzare l'esperienza in base al fattore di forma previsto

Creare un modello di design prendendo questo spettro e applicandolo agli elementi principali di un'app.

Modello di coerenza della progettazione

In questo modello, i livelli di base forniscono una base di coerenza provata e testata, mentre i livelli superiori si concentrano sulla flessibilità e la personalizzazione.

  1. Le nozioni di base dell'app costituiscono il primo livello del modello: griglia di layout, tavolozza dei colori, convenzioni tipografiche e stili icona. Queste funzionalità fondamentali devono essere applicate in modo coerente.

  2. Per il secondo livello, la piattaforma UWP fornisce un set di controlli comuni che bilanciano l'efficienza con la flessibilità. Sono state anche create linee guida per stabilire una voce e un tono coerenti, usando le stesse parole per descrivere e guidare le persone attraverso le esperienze dell'app. È stato creato un set di modelli che le app possono usare per la progettazione, per assicurarsi che le progettazioni possano essere ridimensionate su dispositivi e input di dimensioni diverse.

  3. Il livello 3 è il punto in cui si adatta la navigazione a dispositivi e contesti diversi. Ad esempio, la modalità di navigazione con tocco su un telefono sarà probabilmente diversa rispetto a un monitor da 32" con tastiera e mouse o hololens con movimenti e 100 punti di tocco su una superficie da 84".

  4. Il livello 4 è il punto in cui definisci la tua personalità del marchio. Quali elementi di design distintivi rafforzano il tuo marchio e lo distinguono dalla concorrenza? Questo è anche il punto in cui si adatta l'app per utenti finali diversi. La tua app è destinata ai giocatori, ai lavoratori dell'informazione, oppure agli studenti o educatori K-12? Quali sono le esigenze specifiche per questi diversi clienti e possiamo migliorare il lavoro di progettazione per loro? Non limitarti a fare lo stesso, continua a concentrarti su come creare più valore per i tuoi diversi clienti.

Principi di progettazione

Per usare questo modello in modo efficace, è necessario un set di principi di progettazione che consentono di ottenere i compromessi corretti. Ecco i nostri principi di coerenza nel design operativo:

Se sembra uguale, fai in modo che si comporti allo stesso modo

  • Quando l'utente vede una casella di testo o il controllo hamburger, probabilmente si aspetterà che si comporti allo stesso modo su dispositivi diversi. Se si ha un buon motivo per deviare da un comportamento stabilito, impostare le aspettative dell'utente facendolo sembrare diverso anch'esso.

Se un elemento è molto simile a un elemento o una convenzione esistente, è consigliabile renderlo lo stesso

  • È necessaria un'icona "nuovo documento". Perché progettare uno nuovo che è solo un po' diverso, quando puoi usarne uno già riconosciuto dall'utente.

L'usabilità prevale sulla coerenza

  • È preferibile essere utilizzabili piuttosto che essere coerenti. In alcuni casi, potrebbe essere necessario sviluppare nuovi controlli o comportamenti per facilitare l'usabilità. L'uso del telefono con una sola mano presenta sfide uniche. Quindi funziona con uno schermo da 80". Un buon design rende l'utente un esperto.

Il coinvolgimento è importante

  • Non farti annoiare. Se tutto è piatto e dello stesso colore con motivi quadrati, i nostri clienti vorranno prenderlo e usarlo? Crea gioia. Introdurre nuovi elementi che sorprendono senza interrompere l'apprendimento.

i comportamenti evolvono

  • Questo è il difficile: man mano che il settore evolve, nuove convenzioni si stabiliscono. È possibile che i comportamenti correnti svaniscano e che i comportamenti abituali debbano adottare nuovi standard. Guarda il pizzico e lo zoom. Era comune aspettarsi di aumentare/ridurre lo zoom con l'interfaccia utente +/-; tuttavia, nell'interfaccia moderna, si prevede di utilizzare il gesto di pizzicare per ingrandire. Esaminare i nuovi paradigmi di esperienza e evolversi.