「Kyashコイン」の追加にあたり、リワード機能全体のUI/UXデザインおよびPR用画像の作成を担当しました。KyashコインとはKyashアプリ内で利用することができるコインです。これまでKyashで決済した金額の最大1%をポイントとして還元していましたが、加えてKyashコインも貯まるようになり、リワードタブ内で人気賞品が当たる抽選にチャレンジできるようになりました。

ブランドイメージを保ちつつ、飽きない工夫を散りばめる

Kyashコインは他社サービスとの連携を前提とした機能なので、リワードタブには外部コンテンツが多く含まれます。そんな中でも無理なくKyashらしさを保つために、新しく定義したサブカラーを背景色やワンポイントにバランスよく使うことで一貫性のあるデザインを作成しました。



また、リワードタブに訪れることが日々の楽しみになるように、毎日回せるルーレットやチャレンジに応募することで獲得できるスタンプ機能などを追加しました。Kyashコインという新しい概念をユーザーに受け入れてもらうためにも、アニメーションを加えワクワク感を演出しています。

「銀行振込機能」の追加にあたり、機能全体のUIデザインおよびPR用の画像を作成をしました。銀行振込機能は、Kyashの残高から他人名義の銀行口座へ振込ができる機能です。この機能により、24時間365日いつでもどこからでも、毎月の駐車場の支払いや習い事の支払いなどをスマホから簡単に振り込むことができるようになりました。

ストレスなく、安心して使ってもらうために

銀行振込はユーザーにとって、他人に「決まった金額を振り込む」という大事なアクションです。できるだけ慎重に、かつ間違いなく入力を進めることができるように、ユーザーに負担の少ない入力フローを複数のパターンで検証しました。

フローを決定するにあたり、PdMとデザインチームで意見が割れてしまうことがありました。PdMは、今までKyashアプリ内でモーダルやラージタイトルを使ったステップ式のデザインが無かったため、既存のパーツで上手く組んだ方がデザイン・実装工数ともにかからずに済むのではないかと考えた一方で、デザインチームは、ユーザーがストレスなくスムーズに銀行振込を完了することを優先するのであれば、既存のパーツだけでは最善のデザインを組むことができない、という意見を持っていました。そこで、実際に両者の意見を反映させたデザインをステータスも含めて作成しました。デザインを見せながら今後の機能拡張も踏まえて細かく説明することで、お互いに納得できるデザインに着地しました。また、エンジニアが「ユーザーに最善の体験を届けるための新しいパーツ実装であればウェルカムだ！」と言ってくれたことも後押しになりました。

「利用額表示ウィジェット」の追加にあたり、機能全体のUIデザインおよびPR用の画像を作成しました。利用額表示ウィジェットは、Kyashアプリのウィジェットで利用額の表示をするための機能です。このウィジェットにより、都度アプリを開くことなく、今月の利用額の確認が可能になりました。また、表示サイズによって直近5ヶ月間の利用額平均のグラフも表示できます。

健全に、長く利用できるアプリを目指して

デザインする上で、ウィジェットという小さな枠の中に利用額に関する何をどう表示するかを考える必要があったため、最初の案出しの際にあらゆる利用額に関する情報の見せ方でデザインを作成しました。カテゴリーごとに利用額を表示したり、前月の同日と比較できるようにしたりなど、ユーザーが見たい情報が無いかを抜け漏れなく考えました。その後、作成したデザインをエンジニアに提案し、技術的な観点で実現可能か、利用額ウィジェットの主な目的に沿っているかをしっかりと議論できたため、利用額ウィジェットの方向性が無事にまとまりました。



利用額ウィジェットは、今の利用状況が健康的かどうかが一目で分かることを目的としています。運営側としては決済額が増えることは喜ばしいことですが、健康状態を意識して長く使ってもらうことが最優先のため、このウィジェットを通して健全に、そして長くKyashを利用してくれるユーザーが増えると嬉しいです。