Il concetto dell’ UX Designer è migliorare l’esperienza utente delle applicazioni in tutti i modi possibili. 

Tuttavia, a volte le soluzioni logiche dal punto di vista dello sviluppo non sono le migliori soluzioni dal punto di vista dell’UX Design.

Questa serie di best practice consente agli UX Designer di riflettere attentamente su cosa possono aggiungere al processo di sviluppo delle app e siti web.

1 – Non Inserire Tutto in un unico Schermo

Mettere tutti i menu, le funzionalità e i pulsanti dell’applicazione in un’unica schermata è una cattiva pratica UX, ma comune. 

Quindi e bene ordinarli In uno scenario, dove UX Designer iniziano con un’interfaccia stretta, ma nel tempo aggiungono funzionalità che si traducono in uno schermo pieno di pulsanti.

Gli argomenti per mettere tutto su un unico schermo includono quanto segue:

• “Sono necessari meno click”
• “Viene creata una panoramica”
• “Gli utenti odiano lo scrolling infinito”

Per un UX designer, questo tipo di app sembra un coltellino svizzero con tutti gli strumenti aperti, ma l’unico utilizzato è l’apribottiglie(metaforicamente parlando).

Ricordati può sembrare che raggruppare tutte le opzioni per la tua app o sito web in un’unica schermata crei una buona panoramica, ma il tuo cervello può capire solo nove opzioni alla volta al massimo. 

E siamo onesti, l’utente finale potrebbe non utilizzare il 90% dei pulsanti della tua app o sito web, così spesso, quindi non è necessario sovraccaricarli.

I pulsanti dovrebbero essere vicini ai dati che influenzano(esempio di CTA). Ciò significa che quando hai meno pulsanti su uno schermo, ottieni la vicinanza visiva.

2 – I MENU’ ( NON INSERIRE MENU’ A DISCESA ENORMI )

Gli argomenti per utilizzare i menu a discesa e riempirli di opzioni spesso includono quanto segue:

• “Ci sarà più attenzione e meno disordine”
• “Sarà più facile per l’utente finale trovare ciò di cui ha bisogno”

Le linee guida che ti possiamo suggerire, ovviamente poi si lascia sempre ai singoli obiettivi e architetture di siti web o app, sono:

• Pensare alla tua interfaccia come a uno spazio fisico.
• Considerare un oggetto di cui hai bisogno che si trova in un set di cassetti, quindi devi iniziare ad aprire i cassetti finché non trovi quello che stai cercando.
• Se i cassetti sono al posto giusto e organizzati in modo logico, puoi trovare quello che ti serve più velocemente.
• Ma se i cassetti contengono oggetti casuali che non corrispondono al contesto di ciò di cui hai bisogno, passerai molto tempo a cercare l’oggetto giusto.

  Esempio: Un po’ come quando cerchi i tuoi calzini preferiti, se non hai ordine nei cassetti, non li troverai facilmente !

Un buon equilibrio fa molto nella progettazione ux design. 

La frequenza con cui un oggetto viene utilizzato determina dove dovrebbe andare in un cassetto, che si traduce in: la frequenza con cui un pulsante è necessario determina dove dovrebbe andare in un menu a discesa.

Se hai solo cinque pulsanti, potrebbe non essere necessario che si trovino in un menu a discesa. Ma se hai sei pulsanti, questa è un’altra storia.

3 – Percorso Utente ( Fai sapere dove si trova l’utente )

Quando la tua app o un sito web ha un sistema di progettazione e uno stile del marchio coerenti, tutte le pagine potrebbero iniziare a sembrare uguali per l’utente finale.

Ben presto, l’utente finale potrebbe sentirsi come se stesse camminando attraverso una foresta di pagine, incapace di ricordare se ha già visto una pagina particolare o se si trova effettivamente su una pagina diversa con uno stato simile.

Gli argomenti per l’utilizzo di un sistema di progettazione e di uno stile coerenti possono includere quanto segue:

• “Lo stile visivo deve essere del tutto coerente e completamente brandizzato”
• “I sistemi di progettazione guidano la progettazione”
• “Vogliamo un uso efficiente dello spazio sullo schermo”

Le linee guida seguenti illustrano come far sapere all’utente dove si trova, immagina un utente finale un venerdì pomeriggio, che rimbalza tra i social media, le chat con i colleghi, alcuni messaggi privati e sta facendo un po’ di lavoro. 

L’ultima cosa che hanno in mente è quale link hanno appena cliccato e dove si trovano nel flusso della tuo sito web.

Crea ogni schermata per questo utente seguendo queste linee guida:

• Assegna alle pagine intestazioni e nomi di pagina chiari
• Implementa i breadcrumb se progetti più di un livello in profondità
• Se il flusso di pagine ha più passaggi, mostra quei passaggi

In questo modo l’utente naviga facilmente e sa sempre dove si trova e dove deve andare.

4 – Evita testo difficile da leggere

Scrivere piccole righe di testo e implementare caratteri di dimensioni adatte al contesto è un altro esempio di voler ottenere il massimo dallo schermo. 

Gli argomenti per progettare in questo modo sono alcuni che abbiamo già visto:

• “Gli utenti odiano lo scrolling”
• “Vogliamo un uso efficiente dello spazio sullo schermo”

La regola pratica per la tipografia web è di scrivere non più di nove parole per riga. 

Quando l’utente finale ha finito di leggere una riga, i suoi occhi devono essere in grado di trovare la riga successiva. Quindi, se una linea è troppo lunga, è più difficile per i loro occhi andare avanti.

E SCRIVI GRANDE NON TROPPO PICCOLO !!!

5 – Considera Lo Spazio Bianco

Considera la popolare piattaforma di blogging Medium.com . 

Hai mai notato quanto spazio sullo schermo “sprecano”? 

Questo perché ciò che può essere chiamato “rifiuto” è in realtà un investimento. 

Dà l’impressione che se puoi permetterti di investire così tanto spazio in una pagina, il testo deve essere importante (e se il testo non è importante, dovresti comunque sbarazzartene).

La stessa cosa fa google, hai considerato come si concentra solo sulla sua azione centrale ?

6 – I Pop Up ( Non affollare )

Hai mai premuto un pulsante che apre una finestra pop-up di notifica e in quella notifica c’è un altro pulsante che porta a un’altra finestra pop-up?

ODIO TOTALE, VERO?

L’argomento principale per un UX Designer che implementa qualcosa del genere è il seguente:

• “L’utente avrà una maggiore consapevolezza del contesto”

Tuttavia, il problema con un tale design è che l’utente finale perderà il modello mentale di dove si trova nel flusso delle pagine dell’app o nel processo. 

Saranno più distratti, indipendentemente dal fatto che chiudano la seconda finestra pop-up e tornino alla prima finestra pop-up o tornino alla schermata originale.

La best practice qui è implementare una delle seguenti soluzioni:

• Trasforma la prima finestra pop-up in una pagina stessa, oppure
• Converti la seconda finestra a comparsa in un messaggio in linea nella prima finestra a comparsa

Non creare confusione, oppure utilizza solo un pop up.

7 – Gerarchia Visiva

Un argomento per implementare un progetto sarebbe quello di analizzare e seguire una gerarchia come, ad esempio il seguente:

• “Le carte sono annidate per creare una gerarchia visiva”

Gli UX Designer parlano spesso di gerarchia visiva, che è il modo in cui gli elementi sono organizzati su uno schermo per comunicare la loro importanza all’utente finale. 

Il simbolismo fisico, come le carte, è stato introdotto nella gerarchia visiva per presentare le informazioni in un certo modo. 

Poiché le carte da gioco hanno le stesse dimensioni in un mazzo di carte tradizionale, le carte digitali posizionate sopra, sotto o accanto ad altre carte possono comunicare determinati stati e relazioni tra le informazioni. 

Tuttavia, quando annidi una carta all’interno di un’altra carta, il modello mentale dell’utente finale di ciò che puoi fare con le carte inizia a sgretolarsi. 

Questo utente finale potrebbe anche iniziare a mettere in discussione le relazioni di altri oggetti nell’interfaccia utente, compromettendo così ulteriormente la gerarchia di progettazione nell’app.

NON ANNIDARE LE CARTE ( LE CARTE SONO ESEMPIO )

Invece di annidare le carte nel tuo progetto, posizionale una accanto all’altra (o almeno vicine l’una all’altra). 

Oppure, posizionali in un nastro steso (come come le carte da gioco sono distribuite sul tavolo di un casinò).

8 – Pianifica i Tuoi Moduli

Un Ux Designer deve prendere molte decisioni sui moduli. 

Ad esempio, dovrebbe esserci un lungo elenco di input di moduli? 

Il modulo deve essere suddiviso in più passaggi? O forse dovrebbero esserci tre colonne di input di moduli, in modo che si adattino tutti a un’unica schermata?

L’argomento principale per includere molti campi modulo in una pagina è un argomento che abbiamo visto prima:

• “Gli utenti odiano lo scrolling infinito”

Anche in questo caso, il problema qui non è la necessità di scorrere, ma la quantità di informazioni sullo schermo (ovvero, quanti campi modulo sono visibili sullo schermo in una sola volta). 

Come i pulsanti, il numero di campi modulo dovrebbe essere ridotto al numero minimo possibile che possa comunque fornire contesto e facilità d’uso.

La procedura consigliata per la progettazione di moduli consiste nell’inserire i campi di input in un’unica colonna. 

Ciò renderà più facile per l’utente finale continuare il flusso lungo la pagina e spuntare ogni sezione.

A volte i campi del modulo dell’app riflettono il percorso intrapreso dall’utente finale (ad esempio, l’onboarding) o hanno conseguenze importanti (ad esempio, un questionario fiscale). 

Quando pensi alla storia che stai raccontando, cerca i punti migliori per suddividere i tuoi moduli in più pagine. 

In questo modo avrai spazio visivo per creare spazio per l’utente finale e spiegare loro cosa stanno facendo e perché è importante.

9 – Rendere chiaro lo scopo del Pulsante

Quando si progetta una serie di pagine, un Ux designer dovrebbe utilizzare determinati elementi in ogni pagina che aiuteranno l’utente finale a orientarsi. 

In parallelo, potresti pensare che i pulsanti non debbano essere coerenti, perché l’utente finale deve solo comprendere il pulsante nel contesto di una determinata pagina.

Tuttavia, la coerenza nella progettazione dei pulsanti è importante per consentire all’utente di avanzare senza problemi nell’app.

Gli esempi di pulsanti più comuni che sollevano domande sono “Accetta” e “Annulla”. 

Come UX Designer, devi decidere quale mettere a sinistra e a destra, in modo da stabilire una relazione tra loro che l’utente finale possa facilmente comprendere. 

Devi anche considerare i colori e le etichette dei pulsanti.

La regola pratica per la progettazione dei pulsanti è che, quando l’utente finale avanza nel flusso di un sito web, quel pulsante deve essere progettato nel modo seguente:

• Dovrebbe essere a destra
• Dovrebbe avere il colore verde
• Dovrebbe avere un’etichetta che spieghi cosa fa (ad esempio, “Accetta”, “Procedi” o “Ordina”).

Tuttavia, questo può creare confusione con “attività distruttive”, ad esempio quando l’utente finale desidera annullare un abbonamento. In questo scenario, dovresti considerare se l’etichetta del pulsante deve essere “Annulla” o “Annulla abbonamento”.

10 Conclusione

Gli utenti devono avere una connessione emotiva con l’esperienza di utilizzo del prodotto. Se stai semplicemente creando un’interfaccia e non un’esperienza, hai limitate possibilità di ottenere un prodotto di successo.

Queste sono le 10 migliori pratiche UX Design di base descritte in questo documento:

• Non utilizzare più di nove pulsanti su una pagina
• Non scrivere più di nove parole per riga nell’interfaccia utente
• Utilizzare i menu a discesa solo come ultima risorsa per presentare le opzioni all’utente finale
• Assegna a ogni pagina un’intestazione
• Quando una pagina è profonda più di un livello, assegnale un breadcrumb
• Quando l’utente finale deve eseguire più passaggi, mostra i passaggi
• Non posizionare la finestra a comparsa in un’altra finestra a comparsa
• Non annidare una carta in una carta
• Mantieni i campi del modulo in un’unica colonna
• Assegna nomi descrittivi ai pulsanti