web-dev-qa-db-ja.com

多くのチェックボックスと各チェックボックスの追加アクションがある

私は Lisa Tweedieの素晴らしい答え への同様のインターフェイスを使用しています チェックボックスが多すぎる場合の対処方法

ユーザーが所属するグループを選択するために、これと同様のインターフェースを使用します。ユーザーは、グループに所属しないことも、複数のグループに所属することもできます。 1つのグループが彼のプライマリグループとして指名されます。

現在、インターフェースは次のようになっています。

mockup

download bmml sourceBalsamiq Mockups で作成されたワイヤーフレーム

インターフェースは本当にうまく機能しますが、今度はグループの選択ごとにアクションを追加する必要があります。ユーザーは複数のグループに属することができますが、1つのグループをプライマリグループとして指定する必要があります。ユーザーは、[選択したグループ]領域と[グループの選択領域]の両方でプライマリグループを指定できる必要があります。プライマリグループであるグループが常に1つ存在する必要があります。

私が考えた方法の1つ:

mockup

bmmlソースをダウンロード

問題:

  • ユーザーが誤って "make primary"ボタンをクリックした場合、グループも選択されます。彼はこれに気づかず、不都合なことが何も起こらなかったと思い込むかもしれません。

  • 「選択したグループ」の下のインターフェースを使用してグループをプライマリにする方法はありません。

  • 「プライマリーにする」を表すアイコンを見つけるのは難しいかもしれません。

インターフェイスでこれを実現する方法は何ですか?インターフェースは、無限の数のグループの選択肢が存在する可能性があることを想定して設計する必要があります。

2
F21

上部のバーに無数のグループの選択肢を現実的に表示できるとは思いませんが、可能な選択肢が4つまたは5つしかない場合は、うまくいく可能性があります。

「プライマリ」には2つの状態のコントロールが必要です—グループがプライマリかそうでないかのどちらかです。これは、色付きの星が候補となるブラウザのお気に入りに十分似ています。色付きの星は、プライマリグループを示します。

このインターフェイスにアクセスできるようにする方法はわかりません。現時点では、純粋にテキストベースのページのセットが必要だと思うだけです(検索機能を使用するのが最も問題があります。それ以外はすべて読みやすくすることができます)。

mockup

download bmml sourceBalsamiq Mockups で作成されたワイヤーフレーム

問題に対処するには:

  • 上部のバーに表示される内容の変更は、明確にする必要があります。選択されていないグループをプライマリにする(つまり、グループを選択する)には、それをトップバーに明白な方法で追加する必要があります。同様に、チェックボックスをオフにすると、エントリがトップバーから削除されます—強調表示し、完全にフェードアウトして、他を閉じます。

  • 上部のバーで星を複製すると、それを使用できます(「削除」Xアイコンがチェックボックスを複製するのと同じ方法で)。

  • 星は十分一般的だと思います。

4
Andrew Leach