it-swarm-eu.dev

Matoucí zaškrtávací políčka a přepínače

Mám problém s vytvářením určitého uživatelského rozhraní pro web. Ukážu problém s jednoduchým webem pro řetězec restaurací:

Kontext

web má mnoho uživatelů a mnoho restaurací. Každá restaurace má přiřazené určité uživatele, kde může být buď manažer, kuchař nebo číšník.

číšník vidí adresy objednávek, které přicházejí, kuchař vidí, že a obsah objednávek (co je jídlo), a Manažer vidí obě tyto věci a mohou změnit role libovolného uživatele.

Pro každou restauraci může být pouze jeden manažer, ale tolik kuchařů a číšníků, kolik je potřeba. Zde vypadá, jak uživatelské rozhraní vypadá nyní:

mockup

stáhnout zdroj bmml - Drátové snímky vytvořené pomocí Balsamiq Mockups

Problém

Uživatelé mohou mít pouze jednu roli, protože každá role má všechna oprávnění předchozích rolí plus nové oprávnění. Nikdo tedy nemůže být číšníkem i kuchařem, ani kuchařem a manažerem atd. To není s použitím výše uvedeného uživatelského rozhraní příliš jasné, protože jeden mohl zkontrolovat dvě zaškrtávací políčka u stejného uživatele nebo dokonce všechny tři role.

Otázka

Jak si tuto myšlenku ujasníte prostřednictvím uživatelského rozhraní? 'nápad', že tam může být pouze jeden manažer pro restauraci a každý uživatel může mít pouze jeden role.

Toto je můj první příspěvek mimochodem, takže doufám, že jsem na správném místě. Díky za odpovědi předem!

EDIT: Existují vyšší role, které mohou volně měnit všechny tři zmíněné role.

Posledním případem je to, čemu se snažím vyhnout (Mary).

Image .

70
H. Saleh

V takovém scénáři bych UI přiměl odrážet možné stavy aplikace. Můžete mít pouze jednoho manažera, takže by mělo být pouze jedno místo pro výběr manažera, všichni ostatní mohou být kuchař nebo server, takže pro tyto státy poskytují vzájemně exkluzivní widgety uživatelského rozhraní. Zde je příklad:

Mockup

V praxi můžete chtít, aby bylo trochu promyšlenější změnit role lidí, ale doufejme, že to alespoň představí myšlenku.

Úpravy: Jak již některé připomínky uváděly, že s tímto maketem jsou problémy s designem, nedoporučuji jeho přímou implementaci. Mějte prosím na paměti, že maketa byla určena pouze k zodpovězení otázky OP a že zde platí i jiné konstrukční zásady.

Některá cvičení pro čtenáře zahrnují:

  1. Eliminujte nejednoznačnost, ve které je role aktuálně vybrána
  2. Zobrazení informací správce (telefon, e-mail, ...)
  3. Zajistěte, aby operace změny dat byly promyšlenější než pouhá změna rozbalovací nabídky nebo přepínání
122
Tristan Shelton

Vzhledem k tomu, že změna současného manažera je akcí, která zneplatňuje ostatní možnosti - představila bych to způsobem, který jasně ukazuje, co se bude dít.

Číšník/šéfkuchař jsou tlačítka rádia, takže pouze jeden z nich může být aktivní najednou - a pouze jedna osoba může být manažerem a nic jiného.

Example For Manager with Button

106
Falco

Vypadá to jako úkol seskupení uživatelů.

Oba tyto příklady mají vlastnost Nice, kterou si můžete vytisknout podobný pohled jako v kuchyni. V celém uživatelském rozhraní nemáte také duplicitní/nadbytečný text Cook/Waiter, takže si myslím, že je snazší přečíst a pochopit, kdo s kým pracuje.

Styl značky

Podobně jako přidávání značek k otázce Stack Exchange.

enter image description here

Styl menu

Jako základní koncept jsem použil editaci nabídky WordPress pro simulaci hierarchie.

enter image description here

21
icc97

Použít toto - Toto je pohled vyšší role.

Z pohledu manažera nebude mít manažer kombo box pro svou roli.
Pohled na další dva bude prostý text - žádná kombinovaná pole.

mockup

stáhnout zdroj bmml - Drátové snímky vytvořené pomocí Balsamiq Mockups

13
DPS

Z toho, co vidím, by všichni měli být přepínači (použijte lepší rozestupy pro rozdělení každého uživatele a přidružených přepínačů).
Otázka, ve vaší hlavě, by měla být:
Kdo je Alice? Je to (•) manažerka, () kuchařka nebo () číšník?
Kdo je Bob? Je to () manažer, (•) kuchař nebo () číšník?
atd.

Čteme zleva doprava, takže si nejprve všimnete uživatele a teprve poté role. A protože může existovat pouze jedna role na uživatele, měli by být všichni přepínači

4
Armands

Přišel jsem s řešením pomocí koncepce segmentace iOS a stavu zakázání. Myslím, že je to vizuálně pochopitelné, ale slouží účelu.

enter image description here

0
Vadivel