it-swarm.it

Progettazione dell'interfaccia utente per ordinare articoli nell'elenco

Quale componente/design dell'interfaccia utente useresti per ordinare gli articoli in un elenco (una tabella con i pulsanti sposta su/giù)?

6
padis

Il trascinamento della selezione degli elementi è probabilmente il migliore per la maggior parte delle interfacce utente. Sfortunatamente, è difficile rendere questa funzione rilevabile. Un'area "grabber" vicino a ciascun elemento aiuta. Il feedback visivo durante il trascinamento e lo scorrimento automatico quando un elemento viene trascinato su un Edge sono necessari in una buona interfaccia utente di ordinamento con trascinamento della selezione.

È utile fornire move up e move down pulsanti, oltre a trascinare e rilasciare. Non esiste un'icona/stile "grabber" universalmente e immediatamente riconosciuto. Per le interfacce usate di rado, il tempo impiegato con i pulsanti un po 'goffi potrebbe essere inferiore al tempo per l'utente di scoprire la funzionalità di trascinamento della selezione più efficiente.

Inoltre, con il drag & drop ci sono molti dettagli sottili che sono frustranti per l'utente se non eseguiti correttamente (ad es. Scorrimento automatico). I pulsanti sono inefficienti in uso frequente, ma ovvi, semplici da usare e molto più facili da codificare.

5
dbkk

Il trascinamento della selezione può essere considerato una "manipolazione diretta", in cui i clic direttamente sull'elenco hanno un effetto, rispetto alla "manipolazione indiretta" in cui è presente un pulsante separato o un'altra azione che ha effetto sull'elenco.

A seconda di ciò che è nella tua lista, entrambi potrebbero essere appropriati.

Qualunque cosa tu faccia, tieni a mente il saggio consiglio di I 10 principali errori di progettazione delle applicazioni di Jakob Nielsen :

I disegni con trascinamento della selezione sono spesso i peggiori trasgressori quando non è evidente che qualcosa può essere trascinato o dove può essere lasciato cadere. (O cosa accadrà se si trascina o rilascia). Al contrario, semplici caselle di controllo e pulsanti di comando rendono generalmente ovvio cosa è possibile fare clic.

Quindi se fornisci un'abilità di manipolazione diretta su un elenco, fornisci segnali visivi come:

  1. area "grabber" visiva (serie di punti o linee) che suggerisce "grabability"
  2. cambio cursore
  3. feedback mentre ti sposti. Vedi questa demo sebbene noti come il mio punto (1) non è supportato e quindi non è ovvio che questi elenchi siano ordinabili.
4
Julian H

Concordo sul fatto che la manipolazione diretta degli elementi è probabilmente preferita ora.

Nonostante le accuse secondo cui 37 segnali sono un po 'arroganti, il loro Basecamp è un'applicazione eminentemente utilizzabile. Quasi qualsiasi elenco all'interno di tale app consente il riordino degli elementi tramite il trascinamento della selezione.

Innanzitutto, è necessario fare clic per accedere alla modalità di riordino, tramite un collegamento di testo nell'angolo superiore. Poi c'è una piccola immagine che suggerisce chiaramente 'grabbability' che si fa clic e si tiene premuto e quindi si manipola per spostare l'elemento. Vedi allegato.

alt text

2
jameswanless

I pulsanti su/giù sono OK, ma la tendenza è quella di operare direttamente sui dati, ovvero essere in grado di fare clic (o toccare) sull'elemento e quindi spostarlo. Un esempio importante è la coda Netflix. Questo può funzionare anche quando si selezionano più voci nell'elenco.

0
Hisham

La mia preferenza è quella di utilizzare il trascinamento della selezione con selettori di trascinamento chiari che vengono visualizzati al passaggio del mouse. Nella nostra applicazione utilizziamo una doppia freccia su/giù che viene visualizzata per indicare che l'oggetto può essere riordinato.

Il semplice cambio del cursore è abbastanza buono per una folla di esperti di tecnologia, ma per le app per scopi generali vuoi qualcosa di più ovvio.

0
Sam