はじめに
マネーフォワードは便利なのでよく開いているのですが、家計簿アプリなのに「ログ確認アプリ」という意味合いでしか使えていないことに気付きました。
そのため、なぜ家計簿をつけるのかという「WHY」の部分にフォーカスしてリデザインをしてみました。
また、今回は下タブにある「家計簿」の画面のみ、UI設計の再構築をしました。
アドバイスやコメントをいただけたら大変嬉しいです。
現状のデザイン
こちらの家計簿の画面では「月別と項目別の比較がしやすい」印象を受けました。
それは、
1，チャートをスライドさせるだけで月別の比較ができる
2，チャートと金額が同時に見れる
の2点が理由だと感じました。
一方で、
家計簿とは「無駄な支出を見つける」ためにつけているので、
そのきっかけを増やすことがユーザーにとって重要です。
そのため、
チャートを増やして支出を様々な角度で見せることで、
どこに無駄使いをしているのか発見する機会を増やすUIが必要だと考えました。
上記を踏まえて、
現状のUIで良い部分は残しつつ、昨今のiOSトレンドに合わせてUIを再構築したものがこちらです。
↑XDのリンクはこちらです。
https://xd.adobe.com/view/484566cb-2eda-43d5-5cec-35f53cf9ff85-3e74/
ポイント
・チャート
1つ目の全体の比率が分かる円グラフでは、どこにお金を多く使っているのか、
2つ目の曜日別の比較が分かる棒グラフでは、いつお金を無駄使いする傾向があるのか、
3つ目の支出の変化がわかる線グラフでは、お金の使い方に変化があったのか、
等が分かります。
具体的な例としては、
1つ目のグラフで現金・カードの支出が多いことが分かり、
2つ目のグラフで週末の現金・カードの支出が多いことが分かることで
「飲み会にお金を使いすぎているのかもしれない」と気づくきっかけになります。
3つ目のグラフでは「2,3次会に行くことが増えてきた」と振り返ることができます。