web-dev-qa-db-ja.com

テキストがユーザーによって変更されたことを示します

私のアプリケーションには単純なテーブル/グリッドビューが含まれており、自動計算によって初期的に金額の値が入力されます。

ユーザーは通常、値をそのまま使用しますが、セルのコンテンツを強調表示して上書きすることにより、値を上書きするオプションがあります。すべての値を再生成するアクションもあります（変更された値はリセットされます）。

問題：すべてがプレーンテキストで、変更された値は生成された値とまったく同じように見えます。これを示すための私のオプションは何ですか？

/これまでの答えを要約すると、表示の実現可能な可能性は次のとおりです。

  • フォントスタイル
  • フォント色
  • 背景色
  • アイコン

多くは、表示のためにitalicテキストを使用する傾向があります。この最小限で控えめなアプローチは正しいかもしれませんが、さらに調査や実際の例を見るまで、私はまだそれを売っていません。

tablesinfo-visualisationfeedbacktextstatus
1
J_rgen

更新されたテキストまたはユーザーが変更したテキストの背景色を薄黄色や薄緑などにする。

または、別のオプションを使用することもできますイタリック更新テキストのフォントスタイル。

3
Grafix Guru

十分なスペースがある場合は、-strikethrough-を使用して、置き換えられたデフォルト/優先データがあったことを示すことができます。

そして、あなたはフォントスタイルについて言及していますが、私はあなたが単に太字、斜体などを意味していると思います。ただし、完全に別のフォントを使用することもできます。

これら2つのオプションを組み合わせると、次のようになります。

enter image description here

これは確かに少しスケオモーフなアプローチなので、適切なソリューションであるかどうかは、コンテキストと味に大きく依存します。しかし、私はこのようなことはまだ言及していなかったので、私はそれをそこに捨てています。

3
PixelSnader

値が編集されたことを象徴するアイコンを表示します

UX.seは、投稿の横にある矢印アイコンを使用して、変更されたことを示します。

enter image description here

データのテーブルでも同じ手法を使用できます。

enter image description here

アイコンのアイデアが好きだとおっしゃっていましたが、鉛筆がよくわからないので、ここにいくつかのアイデアがあります。

Visual Studioは、値の横にチェックマーク✓を付けることにより、ドキュメントが編集用にチェックアウトされたことを示します。これにより、「完了した編集」の詳細がわかります。鉛筆よりも感じがよく、他のユーザーがチェックアウトしたことを示すためにユーザーアイコンも使用していますが、「userこれを編集しました。」.

enter image description here

これらのアイデアのいずれかを組み合わせて、アイコンをより説明的でわかりやすくすることもできます。 enter image description here

鉛筆をユーザーのシルエットと組み合わせると、これが実用的な編集ボタンであるという考えを取り除くのに役立ちます。

2
DasBeasto

あなたの問題はあなたにとって良い問題になるかもしれません。

これは、何が何を指すのかについて、独自のWebサイト/アプリに原則を定義できるようになるためです。

表示するキーマップを作成する必要があります。

  1. 編集されていない値

  2. 編集される値

  3. 常に編集されている値。

  4. 編集後に確定した値。

色とプレーン、ボールド、イタリックのフォントスタイルの組み合わせを使用することをお勧めします。

編集されていない値の場合、プレーンテキストのグレー/ブラックフォント。編集された値の場合、イタリック体の青。常に編集されている値の場合は、イタリック体のオレンジ。編集後に確定した値の場合、ボールドグリーン。

黒は、太字のそのままのオブジェクトを示しています。

青は穏やかな動きを示唆しています。

オレンジは興奮と活動を示唆しています。

グリーンは、すべてが合意した価値を示唆しています。

テキストだけでできることはたくさんあるので、アイコンを使用するのはおかしいと思います。

2
Swapnil Borkar

人間による編集を示唆するアイコンを提供する

DasBeastoの答えとともに、変更された行を表すアイコンが正しい解決策だと思います。

  • 太字や斜体などのタイプの強調は、ここでは特定の意味を伝えておらず、行の大部分が変更されている場合、デフォルト値と変更された値を区別することは確かに困難になります。強調は、（外国語の単語を強調したり使用したりするための）ライティングコンテキストでは意味を持ちますが、ここでは適用されません。
  • フォントの色または背景の色は、上記と同じ問題を共有し、十分に異なるコントラストを持つ色を選択することにつながる色覚異常の問題を追加します。

computerで生成された行とhumanで編集された行の違いを強調するために、私は人間のユーザーのアイデアをもたらすアイコンを採用することをお勧めします。以下は、Apple Musicの[接続]タブで使用されるアイコンで、この「アイデンティティ」の概念を伝えています：

Apple Music User Icon

このアイコンを簡略化して、小さいサイズで表示したり、連続する多数の行で繰り返しても視覚的な混乱を減らしたりすることができます。また、この「人道的な」考えを表現する方法はたくさんあると思います。

編集：DasBeastoは、私がこれを書いているときに同じアイデアを呼び起こすように彼/彼女の答えを更新しました。

2
Benoît L.

最も単純で目を引く方法は、italicまたはboldテキストを使用することです。

次のようなTODOリストがある場合：

  1. Sleep
  2. これを行う
  3. それを行う
  4. 何もしない、あなたはそれを獲得しました

この例では、完了した目標はフォーマットされていません（「スリープ」）。私がまだする必要があるのはbold（ "Do This"、 "Do That"）であり、ユーザーが編集した目的はitalic （"何もしない、.."）

1
timmyRS