混乱するチェックボックスとラジオボタン

Question

Webサイトの特定のUIの構築に問題があります。レストランチェーンの簡単なウェブサイトで問題を説明します。

環境

ウェブサイトには多くのユーザーと多くのレストランがあります。各レストランには特定のユーザーが割り当てられており、ユーザーはマネージャー、コック、ウェイターのいずれかになります。

ウェイターは入ってくる注文のアドレスを見ることができ、コックはそれと注文の内容（食べ物）を見ることができ、マネージャーはこれらの両方を見ることができますおよびは、任意のユーザーの役割を変更できます。

すべてのレストランに1人のマネージャーしか存在できませんが、コックとウェイターは必要な数だけいます。現在のUIは次のようになります。

mockup

^{download bmml source – Balsamiq Mockups で作成されたワイヤーフレーム}

問題

すべてのロールは、以前のロールのすべての特権に加えて新しい特権を持っているため、ユーザーはそれぞれ1つのロールしか持つことができません。したがって、ウェイターとコックの両方、またはコックとマネージャーの両方になることはできません。上記のUIを使用しても、同じユーザーの2つのチェックボックス、または3つすべてのロールにチェックを付けることができるため、これは明確ではありません。

質問

UIを通じてこのアイデアをどのように明確にしますか？そこにある「アイデア」は、レストランの1人のマネージャーのみが持つことができ、すべてのユーザーは1人の役割しか持つことができません。

ちなみにこれは私の最初の投稿なので、適切な場所にいることを願っています。事前にご回答いただきありがとうございます！

編集：上記の3つの役割をすべて自由に変更できる上位の役割があります。

最後のケースは私が避けようとしていることです（メアリー）。

。

Tristan Shelton · Accepted Answer

このようなシナリオでは、アプリケーションの可能な状態をUIに反映させます。マネージャーは1つしか持てないため、マネージャーを選択する場所は1つだけで、他の全員はクックまたはサーバーにすることができます。そのため、これらの状態に対して相互に排他的なUIウィジェットを提供します。次に例を示します。

実際には、人々の役割を変更することをもう少し慎重にしたいと思うかもしれませんが、うまくいけば、それは少なくともアイデアを伝えます。

編集：一部のコメントでは、このモックアップには設計上の問題があると述べているため、直接実装することはお勧めしません。モックアップはOPの質問に答えるためだけのものであり、他の設計原則がここでも適用されることに注意してください。

読者のためのいくつかの演習は次のとおりです。

現在役割が選択されているあいまいさを排除する
マネージャーの情報（電話、メールなど）を表示する
ドロップダウンまたはトグルを変更するだけではなく、データ変更操作をより慎重に行う

Falco · Answer

現在のManagerの変更は他のオプションを無効にするアクションなので、私はこれから何が起こるかを明確に伝える方法でそれを提示します。

ウェイター/シェフはラジオボタンなので、一度にアクティブにできるのはそのうちの1つだけです。マネージャーになることができるのは1人だけで、他には何もできません。

icc97 · Answer

これはユーザーのグループ化タスクのようです。

これらの例にはどちらもNiceプロパティがあり、同様のビューを印刷してキッチンに表示できます。また、UI全体にわたってクック/ウェイターの重複/冗長テキストがないため、誰が誰と作業しているかを読んで理解する方が簡単だと思います。

タグのスタイル

Stack Exchangeの質問にタグを追加する方法と同様です。

メニュースタイル

WordPressメニュー編集を階層をシミュレートするための基本概念として採用しました。

DPS · Answer

これを使用-これはより高い役割ビューです。

マネージャーの視点では、マネージャーは自分の役割のコンボボックスを持ちません。
他の2つのビューはプレーンテキストになります-コンボボックスはありません。

mockup

^{download bmml source – Balsamiq Mockups で作成されたワイヤーフレーム}

Armands · Answer

私が見るところから、それらはすべてラジオボタンである必要があります（各ユーザーと関連するラジオボタンを分割するには、より良い間隔を使用してください）。
頭の中での質問は次のとおりです。
アリスとは誰ですか？彼女は（•）マネージャー、（）クック、または（）ウェイターですか？
ボブとは誰ですか？彼は（）Manager、（•）Cook、または（）Waiterですか？
等。