web-dev-qa-db-ja.com

接続性を最もよく示す方法

ホストへの接続に大きく依存するアプリを書いています。

アプリは接続なしで正常に動作し、上下に何も送信しません。

これはビジネスタイプのアプリであるため、ユーザーは接続があるときに簡単に確認できる必要があります。

私は…のようなシンプルなものを使うことを考えていました...

  • 赤=インターネットに接続されていません。
  • 黄色=インターネットに接続していますが、ホストには接続していません。
  • 緑=ホストへの接続。

色付きの円をステータスバーに入れるなど、本当に簡単なことを考えていましたが、それが可能かどうかはわかりません。 (現在、SOに関する質問)。

これを行う他の可能な方法の提案を探しています。現在、私はナビゲーションバーの色を変更しています(より良いものが見つかるまで)。ナビゲーションバーを変更すると、使用するときにあまりにも派手で混乱します。

10
Fogmeister

このために色だけに依存するべきではありません。ほとんどの色覚障害者は、特に非常に小さなアイコンでは、赤と緑を区別できません。 1つの可能性は、接続が存在するときに表示する何らかの ネットワーク接続シンボル を使用し、接続がオフのときにその上に大きな赤い「X」を置くことです。色を使用してシンボルの形状を強調します。スペースがある場合は、「接続済み」と「切断済み」をつづってください。

13
obelia

接続または切断されていることを知っているユーザーに何を期待するかを自問する必要があります。

接続が切断されていると、ユーザーに不便が生じますか?彼は切断されたときに彼の行動を調整する必要がありますか?

オンラインであるが、サービスとの接続が切断されている状態について言及している。ユーザーがこれを修正する方法がない限り、私はこの状態をまったく表示しません。

私は最近、オンラインとオフラインで動作し、接続が存在するときに同期するビジネスアプリを設計しました。ユーザーがアクションに影響を与えない限り、接続は通知されません(この場合、ユーザーを停止し、接続の欠如が問題であることをユーザーに通知します)。

4
Martin

追加のgui要素の追加に関して、アプリ内の制約は何ですか?私は個人的に、他の接続段階に到達したときに変化するいくつかのシンプルなアイコンを組み込みます。

接続がない場合は灰色の点。

灰色の点は点の輪で消え、それぞれが琥珀色に変わり、その後消えて接続が形成されていることを表しています。

接続が行われると、周囲のドットが消え、中央のドットが緑色に変わります。

このように、接続の欠如は微妙ですが注目に値します。接続が行われ、完全な接続への転送が微妙で単純かつ効果的である場合、人々はそれに気づくでしょう。

もちろん、これは制約によって異なります。

2
Jon Hick

数年前、同じ問題に直面したとき、中央にプラグが付いたケーブル(電源延長コードなど)のようなアイコンのペアに落ち着きました。

  • 切断:プラグが引き抜かれ、プラグが抜かれていることを示しています。
  • 接続済み:それらは一緒に接続されました。
  • インターネットなし:片側のプラグが完全になくなり、反対側のプラグのみが残りました(接続するものはありません)。

ユーザーはそれについて何も質問したことがありません...シンボルは十分に自然に見えました。

色を使用することもできます(接続されている場合はライトグリーン、切断されている場合はピンク)。ただし、色に依存しないでください。

2
AgilePro

あなたの質問への直接の回答ではありませんが、ネットワーク依存型アプリである SalesChamp の作成に関する私の経験から、2つのことを学びたいと思います。

1)アプリのコンテキストでは、ユーザーはインターネットに接続できるがホストには接続できないかどうかは、ユーザーにとって重要ではありません。どちらの場合も、アプリは同期できません。アプリサーバーがダウンしていることをユーザーに説明したい場合は行います(問題について何もできないことをユーザーに通知するため) )ですが、ほとんどのプラットフォームではこれがユーザーに通知されています(iOSの左上隅にある接続バーなど)。複数の色/ステータスを使用すると、混乱する可能性があります。アプリが同期できないことを伝え、ユーザーが必要に応じて詳細を確認する方法をユーザーに提供します。

2)ビジネスアプリ(または重要なデータを処理する他の種類のアプリ)を実行する場合は、同期されていないデータがあることを完全に明確にしてください。サーバーへの接続がダウンしていることを通知するだけでは十分ではなく、ユーザーは同期されていないデータがあるかどうかを知りません。接続がダウンする前にデータが送信された可能性があります。同期されていないデータがあることを明確にし、再同期する方法を許可します。

以下のボタンの例を参照してください。これは、自動的に同期できなかったレコードがある場合にのみ表示されます。

Example of a synchronize button with indicator of number of unsynchronized records

2
vincent.io

他の回答と同様に、色だけを使用するだけでは十分ではないようです。

ユーザー、インターネット、アプリサーバーを表す3つの領域を持つトライステートアイコンはどうでしょうか。 (それぞれプラグ/ケーブル/ラインで接続)

したがって、あなたが言及したケースをモデル化するには:

User--World--Server
User==World--Server
User==World==Server

色は州を強化することができます。

1
nonot1

データ、アクションなど、接続性に依存するものを検討する必要があります。データの場合、ユーザーはデータが古いか信頼性がないことを知っている必要があるため、データの表示に影響が及ぶはずです。アクションの場合、ユーザーは一部のアクション(ボタンなど)が使用できないことを確認する必要があります。等々。アプリケーションは、ステータスバーの右下のどこかに接続ステータスを反映するアイコンまたは画像を表示できますが、これは診断の一種ですが、実際には重要な情報ではありません。重要な情報は理由ではなく、機能とデータに関するものです。

1
Serg

接続されているか接続されていないかの2つの状態しかないようです。特に中間状態(部分的に接続されている)は本質的に接続されていないことを意味するため、3色は意味をなさない。

他の人が示唆しているように、私は通常の状態の接続シンボルと、接続がない場合はおそらく赤に変わるエラー状態があるでしょう。

0
user24940