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

Cosa fai quando hai troppe scelte in un campo impostato?

Ho un'interfaccia per la gestione dei ruoli di un utente in un'interfaccia per la gestione degli account in un'applicazione Web.

I ruoli sono fondamentalmente ruoli nel contesto Role-Based Access Control - (RBAC) .

Specifiche tecniche:

  • Gli utenti possono avere più ruoli o nessuno.
  • Tutti gli utenti, indipendentemente dal fatto che abbiano ruoli o nessuno, avranno sempre un ruolo "membro" predefinito. L'appartenenza a questo ruolo di "membro" non può essere rimossa e si "attacca" sempre a ogni account utente.

Considerando questo, sembra che un gruppo di caselle di controllo sia il controllo più adatto:

mockup

download bmml source - Wireframe creati con Balsamiq Mockups

Tuttavia, ho solo 6 ruoli + il ruolo membro predefinito e il set di campi sembra già un po 'lungo. Ottieni da 12 a 14 ruoli e la cosa diventerà piuttosto inutilizzabile.

Ci sono alternative o altri controlli che posso usare invece di avere un set di campi molto lungo? Nel modello sopra, il set di campi sarebbe quasi impossibile usare se ci sono 100 ruoli nel sistema.

I requisiti sono che:

  • Devo essere in grado di visualizzare il nome e la descrizione del ruolo.
  • Gli utenti possono avere più ruoli.
  • Non dovrebbe essere necessario molto sforzo per aggiungere o rimuovere un ruolo per un utente.
  • L'utente dovrebbe essere in grado di vedere TUTTI i ruoli. Mentre i "tag" funzionali di StackExchange funzionano bene, in questo caso può essere difficile "indovinare" il nome di un ruolo per avviare il processo di completamento automatico.

Alcuni chiarimenti riguardo ai gruppi:

Attualmente, il processo di creazione di un ruolo è meno attrito: l'utente assegna semplicemente al ruolo un nome, una descrizione facoltativa e imposta le autorizzazioni spuntando alcune caselle di controllo.

Non ha senso i dipartimenti, i gruppi o qualcosa del genere. I ruoli creati tendono a non essere specifici di nessun dipartimento o gruppo e tendono ad essere abbastanza generali: 2 persone che lavorano in dipartimenti diversi potrebbero avere lo stesso ruolo.

In queste circostanze, ci sono altri modi per fare il raggruppamento? O dovremmo semplicemente presentare i ruoli come un elenco in ordine alfabetico?

19
F21

Per me ci sono tre cose che farei per semplificare questo progetto.

1) Penso che dovresti rimuovere il ruolo Membro dall'elenco dei ruoli . Gli utenti non possono modificarlo, quindi non dovrebbe far parte del gruppo. Invece può essere elencato insieme a tutti gli altri ruoli selezionati altrove (possibilmente con un titolo descrittivo, ad esempio ruolo predefinito, ruolo di base o alcuni di questi). Potresti anche considerare se devi mostrare questo ruolo. Sì, il sistema deve saperlo ma deve far parte del modello mentale degli utenti?

2) Le descrizioni devono essere sempre presenti ? Una volta che le persone sanno a cosa serve un ruolo, non hanno più bisogno delle descrizioni. Potrebbero non solo apparire in un pop-up al passaggio del mouse/passaggio del mouse o fare clic. In alternativa, potrebbero essere visualizzati in un'area di testo adiacente, ma questa non è così connessa, quindi probabilmente una soluzione meno ideale. Rimuovere le descrizioni risparmierebbe molto spazio e ti permetterebbe anche di raggruppare le caselle di controllo se l'elenco diventa lungo.

3) Mi piace l'idea di aggiungere icone/illustrazioni all'elenco ... renderebbe i ruoli più memorabili per gli utenti nel tempo.

mockup

download bmml source - Wireframe creati con Balsamiq Mockups

È inoltre possibile consentire agli utenti di eliminare i ruoli dalla finestra superiore. In questi giorni puoi eliminare i tag in molte UI.

[~ ~ #] aggiornamento [~ ~ #]

Raggruppare come suggerito dalla risposta di dnbrv è anche una buona strada da percorrere. Tuttavia, la mia preferenza sarebbe per uno stile piatto di raggruppamento (piuttosto che per le schede) - se l'elenco diventa troppo lungo puoi usare uno scorrimento.

Il colore è utile per enfatizzare i gruppi (può essere portato attraverso i tag nella sezione superiore).

enter image description here

Puoi consentire agli utenti di selezionare le proprie icone tramite le librerie di icone. Ad esempio Facebook ha uno come questo:

Facebook icon library

Balsamiq ti consente anche di selezionare le icone da una libreria e quindi selezionare il colore. Ti permette anche di selezionare una dimensione che è spesso utile per enfatizzare: Balsamiq icon library

20
Lisa Tweedie

Soluzione di base.

Linee guida per la progettazione dell'interfaccia grafica aziendale consiglia di utilizzare un elenco di selezione in tali circostanze. Puoi mostrare 5-6 ruoli e mettere la barra di scorrimento per abilitare la visualizzazione del resto. In questo modo l'utente può capire il contenuto dell'elenco e quindi utilizzare la barra di scorrimento per vederli tutti e scegliere i necessari. Ti dà anche flessibilità perché è più facile aggiungere/rimuovere ruoli da un elenco piuttosto che caselle di controllo da un pannello.

Rendendolo ancora migliore.

L'elenco presenta degli svantaggi di non poter vedere elementi già selezionati abbastanza facilmente. Inoltre, la selezione è un'operazione un po 'difficile: l'utente potrebbe non essere a conoscenza del pulsante da tenere premuto per selezionare diversi elementi. La soluzione sarebbe quella di avere 2 elenchi. Uno mostra i ruoli disponibili, un altro mostra i ruoli selezionati. L'utente può trascinare e rilasciare o utilizzare i pulsanti per operare. Ecco come appare:

The dialog

Quindi se l'utente seleziona i ruoli e preme aggiungi, sembra che:

The same dialog in a different state

Esempio nel mondo reale.

Questa soluzione è in realtà utilizzata abbastanza spesso nelle applicazioni desktop. Ecco uno screenshot di NetBeans, che è un IDE popolare:

NetBeans dialog

Lo screenshot presenta anche elementi disabilitati per chiarire all'utente che alcuni elementi non possono essere aggiunti/rimossi. Puoi usare lo stesso concetto per il tuo ruolo di "Membro". I pulsanti riflettono anche lo stato di selezione. Ad esempio, se nessun elemento nell'elenco Tabelle disponibili è selezionato, il pulsante Aggiungi è disabilitato e così via. Puoi usare l'area di testo in basso per mostrare la descrizione del ruolo, come hai già detto.

10
hellodanylo

La mia soluzione è più una combinazione delle risposte precedenti in quanto tutte hanno dei buoni punti ma nessuno lo inchioda sulla testa.

Le caselle di controllo non sono il problema. Il problema è nel numero di scelte ed è risolto facilmente con la tassonomia. È necessario organizzare i ruoli in gruppi per reparto, funzione lavorativa, uniformi o qualsiasi altra cosa abbia senso per la persona che assegna i ruoli per trovare facilmente ciò che è necessario.

Una volta finalizzati i gruppi, è sufficiente convertirli in schede delle caselle di controllo. Dovresti anche visualizzare i ruoli già assegnati (con un controllo "Elimina"/"Annulla assegnazione") sopra l'elenco per rendere più semplice la visualizzazione dello stato. Al passaggio del mouse su un ruolo nell'elenco assegnato, dovrebbe apparire una descrizione comandi con almeno il nome del gruppo e se c'è spazio sufficiente anche con la descrizione del ruolo. Al passaggio del mouse su un ruolo nell'elenco di tutti i ruoli, dovrebbe essere visualizzata una descrizione comandi con la descrizione di quel ruolo.

mockup

download bmml source - Wireframe creati con Balsamiq Mockups

2
dnbrv

Vorrei prendere in considerazione tre approcci, se l'elenco rischia di espandersi a oltre 100 voci.

  1. Elenco con caselle di controllo. Ciò soddisferebbe un numero piuttosto significativo in più rispetto alle caselle di controllo standard.

  2. Raggruppare i ruoli, in modo che selezionando "DBO", ad esempio, si selezionino automaticamente i ruoli che lo compongono.

  3. Un'espansione su questo, ma definire una serie di tipi di ruolo e consentire la selezione da questi (solo). Consenti anche la definizione di nuovi tipi di ruolo, probabilmente utilizzando le 2 liste di @Ganga. Estendi questo consentendo all'utente di dire "lo stesso ruolo/i di xxx".

Devi considerare come le persone lo useranno. Se ci sono 100 ruoli, pochissime persone vorranno selezionarli tutti. Non ha senso: la maggior parte delle volte vogliono impostare qualcuno come xxx o come yyy. Quindi, consenti loro di fare le cose in questo modo, pur mantenendo la funzionalità o consentendo qualsiasi combinazione di ruoli.

E a livello di implementazione, nessuna di queste opzioni fa alcuna differenza. In tutti i casi, tutto ciò che fai è assegnare ruoli agli utenti. Si tratta solo di come vengono selezionati.

1

Ho sempre avuto successo con le caselle combinate. Fondamentalmente si ottiene un menu a discesa in cui gli elementi nel menu a discesa hanno caselle di controllo.

mockup

download bmml source - Wireframe creati con Balsamiq Mockups

Ogni volta che il menu a discesa viene compresso, puoi vedere ciò che hai selezionato e ogni volta che viene espanso puoi digitarlo per cercare rapidamente una delle opzioni devi selezionare. E inoltre non occupa molto spazio.

EDIT ha modificato la descrizione del comportamento espanso in modo da adattarsi meglio a un elenco molto ampio.

1
Matt Lavoie

Potresti mostrare i ruoli di base, come membro, ecc., E quindi avere un pulsante "altro" che mostra il resto. Un'interfaccia a schede sarebbe anche utile

0
andywhizwang