ワンバンク支出画面の改修

使いすぎに気づけるサポート

UI Design
Information Architecture
Communication Design

ワンバンクの支出画面を、月の途中でも使いすぎに気づけるようにつくり変えました。支出のペースを示すグラフと、週に一度届く使いすぎ通知を組み合わせ、2024年3月にリリースしています。私は仕様の検討とUIデザインを担当しました。

ワンバンク支出画面の改修

「何に使ったか」はわかっても、「今のペース」はわからない

家計簿の使い方を聞いた15名のインタビューでは、収入や収支を気にするかは人それぞれでしたが、支出は全員が気にしていました。「週に1回、家計簿アプリを見るリマインダーを設定している」「月末になるにつれて細かく見て、着地見込みを自分で計算している」といった声から、月の途中で今の使い方が大丈夫かを知りたいというニーズが見えてきました。ところが従来の円グラフでは何に使ったかはわかっても、使いすぎかどうかは判断できません。しかも想定では利用者の9割が「管理はしたいがズボラ」な人たちで、予算を自分で設定する人は1割ほどです。予算がなければ比べる基準もなく、自分から確かめに行くこともありません。

インタビュー結果をまとめてチームに共有。チームで作るものの目線を揃えて行きます。

インタビューやリサーチ、プロトタイピングを重ねながら要件定義書を拡充させて、作るものの解像度を上げていきます。不明なことがあれば要決定事項に書き出しチームに相談します。

目安の工夫

インタビューでは、従来の家計簿アプリへの不満として、自分の使い方が反映されない「上限額」だけの予算設定や、月初から月末まで一直線に伸びていくだけの目安線が挙がりました。実際の支出は週末や給料日のあとにまとまるなど人それぞれの波があり、一直線の目安では使い方の癖まで「使いすぎ」と判定されて、実感とずれてしまいます。そこで、目安そのものに自分の支出の傾向を反映させることにしました。予算がない人は前月の自分の支出の推移を、予算がある人は過去の日ごとの使い方の比率に合わせて予算を割り振った目安ラインを基準にし、当月の累積支出と重ねて描きます。

グラフにはあらゆる状態があるため、エンジニアとのコミュニケーションを円滑にすべく精緻に設計。

週のはじめに届く使いすぎ通知

インタビューでは、平日と休日の一週間を単位にお金の使い方を考えている人が多くいました。そこで、目安を超えたカテゴリがあれば毎週月曜の朝に通知し、その週の行動を見直すきっかけにしています。初期設定で通知をオンにしたのは、食品・外食・趣味の3つだけです。リサーチで「使いすぎを抑えたい」という声が多かった費目に絞り、家賃などの固定費はオフにしています。通知を切ったカテゴリには画面上の警告も出しません。ペアカードではパートナーにも通知が届き、ふたりで支出について話すきっかけになります。

特別な支出は例外に

誕生日のディナーや旅行など、たまにしか発生しない大きな支出まで使いすぎ扱いすると、目安が意味をなさなくなります。そこで、外食なら2万円以上のようにカテゴリごとの金額の目安を設け、特別費らしい支出を自動で拾って、ワンタップで計算から外せるようにしました。厳密さよりも、本人が納得できる数字を見せることを優先しています。

使いすぎたら、炎が飛ぶ

支出ペースグラフは便利な一方で、数字と線だけではどこか無味無臭で、使いすぎたときの「やっちゃった」という温度感が伝わりません。そこで、グラフを指でなぞり、予算や前月を超えた部分に差し掛かると炎の絵文字🔥が飛び出す仕掛けを入れました。叱るのではなく、少し笑えるくらいの軽さで「ここで使いすぎた」と気づけるようにしています。絵文字が飛ぶのは境界をまたいだ瞬間だけで、動きそのものが「どこから使いすぎたか」を示す意味を持つようにしました。

改修の結果

リリース後のアンケートでは、支出ペースグラフには81.7%、使いすぎ通知には72.6%の人が満足と答えました。支出画面を開く回数は1人1日あたり0.9回から0.99回に増え、通知の対象だった「食品」カテゴリの画面を見る人の割合は前月の約2倍になりました。