web-dev-qa-db-ja.com

ボタンのアクションのステータスを表示する

Webサイトとソーシャルネットワーク間でコンテンツを同期できるアプリケーションがあります。ボタンを使用すると、同期のオンとオフを切り替えることができます。

ユーザーはステータス（同期のオンまたはオフ）とアクション（同期のオンまたはオフ）を確認する必要があります。

同期のオンとオフの切り替えの間には、ユーザーが見える待ち時間があります。

これは私の解決策ですか？これを達成するためのより良い方法はありますか？

enter image description here

labeltextはアクションを示し、バブルはステータスを示します。待機時間の間、labeltextが "wait ..."に変わります。

buttonsstatusactionswaiting
7
peter

を表すボタンにis（つまり、ステータス）を配置することは混乱を招く可能性がありますである可能性があるもの、（それがアクションです）。

separateStatusとAction（またはボタン）を2つの明確に異なる要素、たとえばテキストラベルとボタンに分割します。

mockup

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

次に、アクションとは何か（ボタンのスタイル、アイコンの有無にかかわらず）、何が起こっているか（スピナー、ドットドットドット）を伝えるのに適したレイアウトを適用します。これにより、Webページの残りの色とシンボリックに準拠します。

8
JOG

ユーザーインターフェイスオブジェクトの機能に留意してください。

ディスプレイおよびステータスアイコンは、読み取り専用オブジェクトであり、演算子通知に対応しています。

Buttonsオペレータがactionを実行できるようにします。

これらの2つの機能の組み合わせは、コンピューターのオーディオおよびビデオプレーヤーの再生/一時停止ボタンによって普及しました。 1つの観点からは、2つの相互に排他的なアクションが1つのコントロールを共有することは理にかなっています。しかし、これらのシステムがうまく機能する理由は、オーディオまたはビデオが現在の状態のユーザーに豊富なフィードバックを提供するためです。ユーザーのフィードバックなしでボタンにアクション情報のみを表示すると、あいまいさをもたらす現在の状態を推測するパズルがオペレーターに残ります。ボタンに「Lock Door」というラベルが付いている場合、それはドアが現在開いているか、現在ロックが解除されていることを意味しますか？誰も知らない。

緑色のライトはあいまいすぎて、ユーザーにステータスを効果的に通知できないと主張します。緑色のライトは、同期中であるか、同期の準備ができていることを意味しますか？あなたの仕事はあいまいさを排除するであることを忘れないでください。ボタンの上にラベルを追加して、オペレーターに状態を通知する必要があります。結局のところ、ボタンの上にラベルを追加するのは、ボタンにステータスライトを配置するのと同じです。ラベルには、「待機中」、および必要な他の状態の場合は別のワード（または空白）とともに「同期中」または「今同期中」と表示されます。

1
skinnedKnuckles

同じボタン/アイコンをさまざまなバリエーションで保持して通信します

  • 焦げた enter image description here
  • 同期されていません enter image description here
  • 同期を開始しています enter image description here
  • 同期を停止しています enter image description here

このようにして、一貫性を高め、ユーザーコントロールを減らすことができます。アプリケーションが既に同期している場合、コントロールを同期の開始に示す必要はありません。

1
AndroidHustle

ユーザーの行動の90％は彼女の現在の経験に基づいていると彼らは言う。これに基づいて、現在のユーザーエクスペリエンスでは、コントロールはシステムの現在の状態を表す必要があると考えています。さらに、ボタンはクリック可能であることになっています。

したがって、現在の状態に関連するボタンテキストがあるはずですで、ボタン自体が状態が変更可能であることを示します。

[ο非同期]

[●同期済み]

[@ 待つ]

1
Bartosz Rakowski