web-dev-qa-db-ja.com

「トグルボタン」は、それらが何をするのか、またはシステムステータスを示す必要がありますか?

可能性のある複製:
トグルボタンは、その現在の状態またはそれが変化する状態を表示する必要がありますか?

「トグルボタン」に一貫性がないことに気づきました(名前を発明したばかりです。スクリーンショットを参照して、意味を確認してください)。実行されるアクションまたはシステムのステータスを示すGUIコントロールが表示されます。私は慣習を知らないので、これは混乱しています。

トグルボタンをレンダリングするより自然な方法は、マルチメディアボタン(再生、一時停止、次など)と同じように、システムステータスの代わりにボタンの動作を表示することだと思います。たとえば、メディアが再生されている場合、「再生」ボタンは、カセットプレーヤーと同様に、押されたときにレンダリングされます。

ベストプラクティスは何ですか?これらのボタンがシステムの状態を示しているのか、それともボタンの機能を示しているのか。システムステータスを表示したり、その逆の方が良い場合はありますか?

16
Allan Caeg

ラベル付きのボタン(トグルボタン)は、ご指摘のとおり、わかりにくい場合やあいまいな場合があります。代わりに、
ステータスアクションを表示のように:

オンライン[オフラインにする]

そのため、現在のステータスを明確に示すラベルと、ステータスを変更するアクションを実行するボタンがあります。

現在のステータスとアクションの両方を同時に表示することは、完全に明確にする唯一の方法です。ラジオボタンはこれを行いますが、ラベルとボタンのソリューションは、2つの間の明確な視覚的区別を提供するため、より優れています。また、ラジオボタンよりも当然コンパクトです。

代替案については、トグルボタンが問題になる可能性があることは同意していると思います。チェックボックスでさえ混乱するかもしれません:

[]オンライン

チェックボックスがオフになっているため、アプリケーションはオフラインです。しかし、これは特に明確ではありません。一見すると「オンライン」という言葉が最初に見えるので、間違った結論が出やすい。

問題は、あなたが見ることができるすべてが単一のラベルであるということです。ラベルがステータスとコマンドのどちらを示すかを決める前に、少し考えなければなりません。この問題はチェックボックスとボタンに共通しており、形容詞(または動詞など)を一貫して使用することで状況が改善される可能性がありますが、問題は解消されません。

10
Bennett McElwee

問題はかなり古いです。 Jef RaskinによるHumane Interfaceからの引用は次のとおりです。

ボタンまたはメニューでトグルが使用される場合によくあるように、ユーザーはラベルを状態のインジケーターとして読み取ります。そして、それらは正当に混乱しています。

Raskinは、ボタンではなくチェックボックスを使用することが役立つと説明しています。または、より多くのスペースがあれば、ラジオボタンを使用できます。この場合、ユーザーは現在の状態だけでなく代替手段も明確に見ることができます。

そして

アクションを説明する動詞ではなく、影響を受けるオブジェクトの状態を説明する形容詞でそれらにラベルを付けることが重要です。

7
Kostya

それ混乱し、標準化や一般的な人間の傾向は明らかにありません。たとえば、MS Windows UXインタラクションガイドラインでは、 4つの基本的な種類のプログレッシブ開示制御の切り替え を指定しています。 4つのうち3つはアクティブ時の状態を示し、1つは現在の状態を示します。私はこれが解決するためにいくつかの革新と研究を必要とする論争であると思います。

トグルボタンは GNOMEで確立されたコントロール であり、オプション(ラジオ)ボタンの機能的な同義語として表示されます。これらは、Appleヒューマンインターフェイスガイドライン、およびビューまたはプレゼンテーションの設定によく使用される非常に類似した「セグメント化されたコントロール」にも記載されています。IMO、トグルボタンは特にあなたが話していること:プロセスの開始と停止これは論争を解決する方法かもしれません。

プロセスの開始と停止に使用するには、現在の状態に関係なく、トグルボタンに明確な(実行中の)状態を生成するアクションのラベルを付ける必要があります。たとえば、メールクライアントの場合、「オンライン」ではなく「接続」というラベルを付ける必要があります。現在の状態は、ラベルではなく、トグルボタンのグラフィックの外観によって示されます。オフの場合、トグルボタンは「隆起」しているはずなので、コマンドボタンのように見えます。オンの場合、トグルボタンは、状態インジケーター(読み取り専用テキストボックスなど)のように、くぼんだ状態で「固定」されます。

あいまいさを最小限に抑えるために、Gnomeのガイドラインに従って、2つの相互に排他的なトグルボタン(たとえば、1つは接続用、もう1つは接続解除用)が必要です。ただし、これは2倍の面積を消費します。Connectなどの単純なTrueとFalseの状態(2つのオプションボタンではなくチェックボックスを使用するのと同様)のプロセスでは、1つのトグルボタンで問題なく実行できると思います。

トグルボタンの外観と動作は、物理的なトグルボタンスイッチと同じです(以前の物理テープレコーダーの再生ボタンなど)。また、オプションボタン、チェックボックス、状態メニューの項目とも一致します。これらはすべて、標準のグラフィックスで肯定的な状態を示します。コントロールがコマンドボタンのように見える場合(外観が隆起)、コマンドボタンのようにラベルが付けられます。ラベルは、コマンドボタン(接続)のようにコミットされたアクションを示します。状態インジケータ(沈んだ)のように見える場合、ラベルは現在の状態(接続済み)を示します。

代わりの方法は、ラベルを交換して、説明したようにアクション/状態を示すことです。これは、アクティブ化時に コミットされたアクションを明確に示すテキストラベル を使用する場合、通常のコマンドボタンで機能します。コマンドボタンは状態ではなくアクションを示すため、アイコンや「オンライン」や「オフライン」などの状態ラベルは使用しないでください。 「接続」や「切断」などのラベルを使用します。このアプローチの短所は、場合によってはより長いラベルを取得する可能性があり、ユーザーが肯定的な状態を読み取るために精神的な変換を行う必要があることです(「接続を解除できるため、今はオンラインでなければなりません」)。

テキストボックスのような状態インジケータコントロールのラベルを交換すると、コミットされたアクション(「オンライン」/「オフライン」)ではなく、状態の明確なラベルが必要です。このアプローチの問題は、状態インジケーターが従来コマンドを実行しないため、ユーザーがプロセスをクリックしてプロセスを開始/停止することを考えない場合があることです。

チェックボックスコントロールは場合によっては使用できますが、プロセスを開始および停止するよりも属性値を変更する方が適切と思われます。

2

私はベネットに同意します。このジレンマを回避する唯一の方法は、ステータス表示とコマンドを分離することです。これは、「フェイス3.0について」のアランクーパーの推奨事項に沿っており、「コントロールは、状態インジケーターまたは状態切り替え選択コントロールのいずれかとして機能しますが、両方として機能することはできません」と述べています。

ただし、ほとんどのビデオプレーヤーはまさにそれを行います。「再生」/「一時停止」ボタンを1つのコントロールに組み合わせます。私自身の経験から、これは私にとってはうまく機能していると言えますが、その理由は推測しかできません。理由の1つは、現在の状態でビデオを再生して視覚的なフィードバックを得ていることです。私が考えられるもう1つの理由は、youtubeやvimeoなどの大規模なビデオサイトがこのパターンを一貫して使用しているため、ある種の標準でも広く使用されていることです。

トグルコントロールを明確な方法で設計するには、状態とアクションを分離し、表現を慎重に選択し、アプリケーション全体で一貫している必要があります。

私がデザインしたパターン、「 フリップフロップボタン 」をチェックしたいかもしれません。タッチスクリーン専用に設計されています。 サイト全体 は、安全性が重要なアプリケーションのUIパターンを扱います。

1
Tom Zahler