web-dev-qa-db-ja.com

時間単位の適切な視覚的メタファーは何ですか?

アプリに[minute, hour, day, month, year]などの時間単位が表示されます。関連するマグニチュードはありません。

彼らは「この行動にはどれくらいの時間がかかるか」という情報を伝えます。 (TODOリストを考える)

時間の大きさをすばやく伝える適切な視覚的なメタファーはありますか?アイコンまたはその他。

対応するフォーム入力はありますか?

制約:

これらの多く(10)が一度にページに表示される場合があります。だから彼らは巨大になることはできません。

これらはアプリの中心ではないので、トレーニングや読書をしなくてもすぐに理解できることが目標です。


私はこれに対する答えとして私の最初の考えを含めますが、もっと良いものがあることを願っています。

8
cmonkey

以下のモックアップのように、カウントダウンの進行状況バーを表示することで、より微妙なアプローチを取ることができると思います。

enter image description here

このパターンを使用する利点は、アクションが完了するまでにかかる時間に関する情報を伝達すると同時に、各タスクを他のタスクと比較する方法(必要な場合)に関する情報も伝達し、一目で簡単に確認できることです。

進行状況バーは、以下の例のようにわずかな変化を使用して「年」に対応できます。

enter image description here

それが役に立てば幸い

6
Okavango

ディスプレイ

ツールチップでアイコンを使用する:

時計アイコン:

enter image description here

  • 「分」の小さなスイープ/ハイライト表示されたフェースセクション。
  • 「時間」の間、完全にスイープ/ハイライト表示された顔。

カレンダーアイコン( http://fortawesome.github.io/Font-Awesome/icon/calendar/ など)

  • 「日」の強調表示された日
  • 「週」の強調表示された行
  • 「月」を完全に強調表示

1年分の積み重ねてハイライトされたカレンダー。

私の懸念は、これが小さなアイコンに詰め込む多くの情報であるということです。

入力

正規形<select>。各オプションには、左側に上記のアイコン、右側にテキストがあります

3
cmonkey