web-dev-qa-db-ja.com

可視フラグのスイッチボックス、チェックボックス、またはラジオボタンの使用

シナリオ

学生のプロフィールに添付されたドキュメントに対する表示フラグがあります。管理者は学生プロフィールのペルソナです。管理者は学生のプロファイルを管理し、学生のプロファイルにはドキュメントのセクションがあります。管理者は生徒のドキュメントを追加でき、生徒に表示するかどうかを設定する権限があります

相互作用

enter image description here

質問

インタラクションを終えた今、ドキュメントを選択すると、可視性のチェックボックスコントロールが有効になることを理解できなければなりません。

私たちのチームは、1つの行に2つのチェックボックスがあるとは確信していません。ラジオ選択ボタンまたはトグルスイッチを使用する必要がありますか?または、可視性フラグのアイコンをチェックボックスアイコンから目のアイコンに変更してみてください。

実装したバリエーション

enter image description here

しかし、これは行で圧倒的すぎるため、拒否されました。

親切にいくつかの解決策を提案します。ありがとう!!!

4
Sheraz

スイッチのケースに名前を付けたとは思いますが、それを視覚化せず、セグメント化されたタブのようなより複雑なスイッチに直接移動しました。

通常、チェックボックスはバイナリオプションに最適ですが、この場合、2つあるため混乱が生じる可能性があることを正しく説明しました。


あなたはすでに正しい道を進んでいたと思います。スイッチは、チェックボックスだけでなくバイナリオプションでも機能します(通常、現実の世界では、オン/オフのメタファーに似たオプションで選択されます)。

この場合は許容できます。

enter image description here


デザインにもっと合う場合は、おそらく目のアイコンも使用できます。

enter image description here

ただし、これはスイッチほど完全ではありません(ユーザーがオンまたはオフのときに混乱する可能性があるため)。

結局のところ、どのアイコンが最も正しいアイコンであるかについてはそれほど重要ではありませんが、ユーザーにとって最も明確で使いやすいソリューションは何ですか?

2
Big_Chair

ラジオボタンの原則を使用できますが、スペースを節約する必要がある場合は、ドロップダウン内に実装します。

0
Leths

2つのチェックボックスの問題を解決する1つの方法は、ドキュメントを選択するための相互作用を変更することです。私が理解しているように、学生のドキュメントを追加するための2段階のプロセスがあります。まず、リスト内のすべてのドキュメントのラベルなしチェックボックスをクリックし、[選択したドキュメントの追加]ボタンで選択を確認する必要があります。

この相互作用パターンは、リスト内のアイテムに使用可能な複数のアクションがある状況で役立ちます。メーリングリスト。ただし、ユーザーが実行できるアクションは1つだけなので、ここでは不要のようです。可視性の設定は、使用法が選択操作に依存するため、このコンテキストではアクションとしてカウントできません。

各ドキュメントの選択チェックボックスを[追加]ボタンに置​​き換え、[選択したドキュメントの追加]ボタンを取り除きます。 enter image description here

[追加]ボタンを使用すると、ユーザーはドキュメントを操作している間、ドキュメントを注意の軌跡として保持できます。 [追加]ボタンを使用すると、現在のチェックボックスがどの操作にマップされているかをユーザーに明示することもできます。もちろん、この変更は設計にさらに影響を及ぼしますが、ユーザーにとってこのやり取りは簡単になると思います。

P.S。

可視化操作が有効になる以外は、ドキュメントが強調表示されたことを示す視覚的な変更はありません。選択操作の視覚的な表示が強くなるはずです。おそらくアイテムの背景色が変更されます。

0
Andre Dickson

チェックボックスを、変更されるラベルとスタイルの1つのボタンに置​​き換えることをお勧めします。ラベル-「共有」と「共有解除」または類似のラベル。 1つのボタン-背景が色のボタン上の白いテキストフォント。他の明確な背景と色のフォント。

0
user74889