web-dev-qa-db-ja.com

長期間にわたるアクティビティの進行状況を表示

背景

ユーザーが1日にN回タスクを実行する必要があるモバイルアプリを作成しています。対象読者は女性で、健康的なライフスタイルに関心があります(したがって、大量のデータやグラフなどに慣れているエンジニアは対象外です)。

毎日は、成功(タスクが少なくともN回完了した)、ほとんど成功した(たとえば、タスクがN-1〜N-3回完了した)、または失敗(その他すべて)のいずれかに分類できます。しかし、私はそれが失敗した日でネガティブを運びたくありません(とてもFAILが叫んでいる真っ赤なものはノーです)。

問題

私が苦労しているのは、過去7日間と30日間の進捗状況を表示することです。私は一目で理解できる簡単なものを考え出そうとしていますが、高精度はそれほど重要ではありません。エンドユーザーが30または11のうち10日間成功したかどうかは気にしません。したがって、カラーコーディングは、正確さを強調せずに、簡単に言えば良いアイデアを提供するため、潜在的な解決策です。

私が思いついたソリューション

  1. テキスト情報。例:10日間続けて目標を達成しました!これは、唯一のソリューションではなく、他のソリューションへの追加である可能性があります。プロ:明確です。短所:たくさんのテキストを提供し、それが良いか悪いかは明確ではありません。ユーザーは毎回それを読む必要があります。
  2. 色分けされたカレンダー。 githubに似ています: enter image description here 長所:カラーコーディングにより、7マスしかないため、すばやく簡単に理解でき、7日間の追跡が簡単になります。短所:長期間(30日間)は扱いが難しく、一見するとそれがカレンダーであることは明らかではありません。
  3. チャート。 3つの状態の1つではなく、正確さと絶対値を強調するため、それは間違ったソリューションのように感じます。ユーザーはチャートにあまり慣れていないかもしれません。

一貫性を保つために、7日間と30日間の視覚化に同じソリューションを使用することを目指しています。ただし、7つの状態と30の状態の違いが大きすぎて同じソリューションを使用できない場合があります(たとえば、色分けされたカレンダーは、7と比較して30の状態ではユーザーフレンドリーではありません)。

2
Gediminas

ソリューション2は、色とカレンダーが、あなたが説明した内容のコンテキストで期間とステータスについて考える自然な方法に合っているためだけに、始めるのに最適なオプションだと思います。

7日と30日の範囲の違いが大きすぎて同時に表示できないと思うので、ユーザーがこれら2つのビュー(Microsoft Outlookカレンダーなど)を切り替えられるようにする通常の設計に固執する必要があります。

Githubカレンダーは、通常のように水平方向ではなく上から下に表示され、横方向には表示されないため、読み取りが少し難しくなります。そのため、設計した日付とカラーコードを表示した標準のカレンダーを使用すると、 30日間のビュー。

1
Michael Lai

これはあなたにいくつかのアイデアを与えるかもしれません: https://github.com/mbostock/d3/wiki/Gallery

次のようなものも試すことができます: enter image description here

enter image description here

1
jimmyplaysdrums