it-swarm.it

Opzioni multiple vs UI a opzione singola

Nella dashboard che stiamo costruendo abbiamo 2 set di opzioni che gli utenti possono scegliere:

Opzioni multiple (caselle di controllo) enter image description here

e singole opzioni (comportamento dei pulsanti di opzione)

enter image description here

mentre l'aspetto dei componenti è simile, i loro usi sono diversi.

Nei test di usabilità, gli utenti hanno utilizzato questi componenti senza alcuna difficoltà o una volta utilizzati e compresi le funzionalità che non avevano problemi a utilizzarli nelle altre parti del prodotto.

Ma i miei colleghi designer hanno affermato che i componenti dovrebbero apparire diversi e gli utenti devono capire a prima vista se si tratta di una casella di controllo o di una casella radio.

Il mio obiettivo era quello di mantenere la coerenza e ridurre il carico cognitivo.

Qualche idea o input?

Modifica 1: aggiornata l'interfaccia utente, grazie @ 200_success per il feedback

33
Deniz Erdal

Dipende. Con quale frequenza i tuoi utenti visualizzano questo modulo/sezione/impostazioni?

Le applicazioni di sessione lunga utilizzate di frequente offrono agli utenti la possibilità di ricordare come funzionano i controlli, specialmente quelli utilizzati di frequente.

Parte di ciò ha a che fare con Posture applicazione .

Un'applicazione sovrana è un programma che monopolizza l'attenzione dell'utente per lunghi periodi di tempo.

I documenti Google e Microsoft Word sono ottimi esempi di Applicazioni di postura sovrana : gli utenti trascorrono lunghi periodi di tempo a manipolare i documenti.

Gli utenti target sono generalmente intermedi, che incontrano ripetutamente questi controlli per un uso prolungato.

Alcuni controlli che sembrano uguali ma si comportano in modo diverso non presentano troppe difficoltà dopo un'esposizione prolungata ripetuta.

Molti di noi si sono abituati alla barra degli strumenti, come sottolineato da un altro post:

enter image description here Un altro esempio è OmniFocus, l'applicazione di gestione delle attività.

Il pannello ispettore mostra i dettagli per eventi ripetuti e programmati. Ha un interruttore multi-selezione che mostra quali giorni della settimana includere un evento. Ha lo stesso effetto delle caselle di controllo:

enter image description here

Il modello mentale per gli eventi è più chiaro all'inizio, il che probabilmente aiuta a usare questi controlli:

Gli eventi hanno:

  • Date di inizio
  • Date di fine
  • Frequenze
  • Ripetizione

Ad esempio, mi è chiaro che posso andare alle lezioni di Karate domenica, lunedì e mercoledì. Posso selezionare più giorni di cui ho bisogno.

I moduli una volta, le pagine 'Impostazioni' raramente accessibili e l'interfaccia utente raramente rilevata possono essere difficili senza etichette e/o controlli chiari.

Non sono chiaro sul tuo contesto più ampio, ma un'etichettatura chiara è fondamentale per gli utenti che incontrano il tuo modulo per la prima volta o raramente:

enter image description here

Sembra che tu sia in una buona posizione, come è stato confermato dai test degli utenti. Tieni presente che in alcuni contesti, progetterai per i "primi temporizzatori" perpetui che si avventurano in territori sconosciuti.

33
Mike M

Non è necessario creare aspetti diversi per questi componenti.

Il tuo caso è simile ai toggle noti in una barra degli strumenti di elaborazione testi come Word. Queste impostazioni dei caratteri attivano/disattivano le caselle di controllo:

enter image description here

E questi controlli di allineamento di Word si comportano come pulsanti di opzione:

enter image description here

Si noti che sembrano identici e non generano confusione o difficoltà perché nel nostro modello mentale (visione dell'utente su come dovrebbe funzionare il sistema) comprendiamo che un pezzo di testo può essere in grassetto, sottolineato e corsivo contemporaneamente, quindi ci aspettiamo che rispetti le levette dovrebbero agire come caselle di controllo. E comprendiamo che il testo non può essere allineato a destra e a sinistra contemporaneamente, quindi non è una sorpresa per noi che i controlli di allineamento si comportino come pulsanti di opzione. Lo sappiamo e non abbiamo bisogno di ulteriori promemoria a riguardo.

Hai scritto che nei test di usabilità, gli utenti hanno usato questi componenti senza alcuna difficoltà. Penso che ciò significhi che il comportamento dei componenti corrisponde al modello mentale dell'utente, vale a dire che gli utenti comprendono e si aspettano di poter scegliere diverse fasce di età e una sola vista (elenchi o miniature).

Ho preso l'esempio dei toggle di Word da "About Face 3. The Essentials of Interaction Design" di A. Cooper. Ne ha scritto un esempio di un approccio più grafico e più efficiente in termini di spazio alla casella di controllo o ai pulsanti di opzione (vedere il capitolo 21: Controlli, caselle di controllo (p. 443) e pulsanti di opzione (p. 446)). E anche Cooper non ha detto che nulla di simile a questi due tipi di levette deve apparire diversamente.

52
Lana

Penso che i tuoi colleghi designer abbiano ragione.

Se ora guardo le opzioni, ho un'idea chiara di come posso interagire con loro e per quello che vengono utilizzati.

enter image description here

enter image description here

L'uso dei quadrati per le caselle di controllo e i cerchi per i pulsanti di opzione sono molto vecchi, comuni e riconoscibili per la maggior parte degli utenti. Quindi, risolve semplicemente il tuo problema in questo caso.

6
Asqan

Gli utenti più normali non conoscono la differenza tra un pulsante di opzione e un pulsante di controllo. Al massimo, a volte si arrabbiano quando non è possibile attivare più pulsanti di opzione in cui avrebbe senso.

Fare senza una differenza visiva non confonderà un singolo utente: vedranno che in alcuni casi la selezione di una cosa rimuove l'altra selezione, e in altri casi no. E a loro non importa, soprattutto se ha senso.

Se vuoi che facciano la differenza, che ne dici di usare gli angoli arrotondati per i pulsanti radio (forse anche tra le opzioni) e gli angoli angolati con le caselle di controllo? Il design rimane semplice e le persone che sono "al corrente" possono vedere immediatamente la differenza.

1
Carl Dombrowski