risposta-alla-domanda-sullo-sviluppo-web-bd.com

Come gestire un enorme elenco di caselle di controllo?

Sto lavorando ad alcuni wireframe per un portale web. In una forma in questo portale web c'è un enorme elenco (120 voci) di opzioni e gli utenti devono esaminarle (e leggerle) tutte.

Non è possibile suddividere queste opzioni in categorie e la lunghezza delle etichette è molto variabile.

L'obiettivo di questi wireframe che sto sviluppando è rendere questa forma molto meno stressante da attraversare, sfortunatamente sono bloccato con queste caselle di controllo.

Il migliore che mi è venuto in mente è stato un elenco scorrevole come questo:

scrollable list checkbox

10
Jeroen de Beer

È qui che UX ha il compito di riparare qualcosa che non è riparabile a livello di UX. Andrei fino a dire che è qui che un sistema di back-end sta ingiustamente chiedendo a un utente di prendere decisioni che non dovrebbero.

Se il problema è che le persone inseriscono gli articoli che vendono con un nome diverso da quello già presente nel sistema, la soluzione corretta sarebbe un back-end più intelligente.

Opzione 1: crea un miglior parser di lingua back-end

Consenti agli utenti di inserire i loro elementi digitandoli (forse mantieni l'elenco di controllo per quelli che preferiscono quel metodo).

Mentre digitano ogni elemento e premono return, il sistema dovrebbe cercare l'elemento e verificare sia a) errori ortografici comuni, sia b) cercare sinonimi in una tabella

Quindi forse un utente digita un elemento:

[ BOOZE    ]

Al colpire il ritorno, potresti vedere:

[          ]
• Alcohol (match for 'booze') 

Opzione 2: nastro adesivo

Se il miglioramento della tecnologia è nelle tue mani, il meglio che puoi fare è rendere meno doloroso un elenco gigante di segni di spunta. Vorrei iniziare eliminando qualsiasi scorrimento. Invece, fai la selezione degli elementi un'attività separata con una pagina a sé stante. Elencali tutti su una pagina, magari in colonne. Aggiungerei anche una ricerca filtrabile in alto che, quando un utente digita sul campo, riduce le caselle di controllo visualizzate solo a quelle corrispondenti. Tutto ciò può essere fatto sul lato client tramite Javascript.

18
DA01

Vorrei provare qualcosa come i tag GMail.

You have a filter and the list of checkboxes inside a scroll area

C'è un filtro e l'elenco delle caselle di controllo all'interno di un'area di scorrimento

Un'altra buona opzione è qualcosa come Pocket Chrome plugin

you have a filter and the selected items become a tag

Hai un filtro e gli elementi selezionati diventano un tag

11
Eduardo Russo

Ho dovuto affrontare lo stesso problema qualche giorno fa e sono arrivato con questa soluzione! Nel mio elenco di casi non sono stato così a lungo quindi ho usato un sistema di tag in modo che l'utente possa avere un elenco degli elementi che ha selezionato. enter image description here

3
Deniz Erdal

Penso che un widget elenco side-by-side sarebbe appropriato per questa situazione. Va con molti nomi. Vedere: Nome del widget con le caselle di riepilogo disponibili/selezionate affiancate?

Inoltre, è necessario fornire una casella di ricerca per filtrare dinamicamente l'elenco degli elementi disponibili mentre l'utente digita.

0
J. Dimeo