web-dev-qa-db-ja.com

数字の隣にアイコンを配置する-右または左に?

私たちのシステムでは、数値を表示する場所がたくさんあり、それらの隣に値が良い/平凡/悪いかどうかを示すアイコンが表示されます。私がチームに参加する前は、ガイドラインはありませんでした。そのため、アイコンを番号の右側に配置したり、左側に配置したりする場合がありました。

icons on righticons on left

どちらがより良いのか、またその理由を明記するルール/ガイドライン/規約はありますか?

10
Dvir Adler

数字の横のアイコンの配置は、自然な読み順になります。

ステータスアイコンは行の最後に表示されます。以下の例に見られるように、これは、視聴者が最初にサブジェクト、次にサブジェクトに関連付けられたカウント、最後にカウントのステータスを見るので意味があります。 (RTL言語の場合、図は下の図の鏡像になります。この場合でも、アイコンは行末に残ります)。

mockup

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

ただし、アイコン自体がsubjectの場合、行の先頭に表示されます、そして他のすべてはその後に従います。 (ここでも、RTLの場合、レイアウトは以下のものの鏡像になります)。

mockup

bmmlソースをダウンロード

17
SNag

そのデータのみであれば、私はシモンテオに同意します。

Iphone OSがアプリケーションアイコンをリストの「弾丸」ポイントとして使用するのと同じように、インジケーター(常に同じサイズになります)を箇条書きとして使用します。

私は通常、これらの値または「オブジェクト」を配置しようとしますが、これは左から一定です。データのリストまたは可能なテーブルを操作するときのサイズ、次元などの定数。

値に関する質問:

  • ユーザーにとってより重要なのは、値、または値の概要であり、ユーザーが良い/平凡/悪いものに集中できるようにします。

enter image description here

2
hoektoe

私はドンニッケルに同意します。私の経験では、思考プロセスはステータス->バリューではなく、バリュー->ステータスです。以前に指摘したように、UI全体の一貫性は重要ですが、この特定のシナリオでは、数字の右側にアイコンを配置します。

1
hidrees

通常、数値の左側のアイコンはデータのintentを示し、数値の右側のアイコンはデータのqualityを示します。

これは私の意見+見解ですが、フローは左から右に進みます。

入力内容>>入力された値>>入力された値への応答

1
Don Nickel

私は2つの主要なことを考えます:

  1. uIの別の縦線に近接
  2. 聴衆の読む方向(西洋とアジアの言語は一般的に右から左です)

あなたの例では、コンテキストから列を都合よく抽象化していますが、このコンテキストは重要なので、省略しません。

mockup

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

ADは、配置と視覚的形式により、より強力な列を作成します。ただし、これらの要素がウィンドウまたは画面の端の隣になかった場合、それらが近接していると、「強い列」を作成する理由が変わる可能性があります。

1
New Alexandria

この方法でスマイリーを書く人もいます=)と、この方法でスマイリーを書く人もいます(=。

(=私は本当に奇妙に見えます、そして私と同じ文化の人がそれをそのようにタイプするときはいつも驚きます。ですから、アイコンが正しいのか、それとも、左が良いです。

大部分のユーザーが何に慣れているかを確認するために簡単なストローポーリングを行うことをお勧めします。答えがわかったら、それをユーザーインターフェイス全体に一貫して実装し、今後も常に同じ配置を使用します。

0
Zach

アイコンが図に対するコメントである場合、それはafterになります。
これは事実のようです。
アイコンが「もの」であり、テキストがそれを説明しているため、iPhoneの例はここでは適用されません。

0
Juan Lanus