顕在化した課題とあるべきサービス像の2軸から、UI・UXを改善

〜短期的に効果を発揮する改善施策を実施すると同時に、サービスが理想像へ近づくための探索値サーチを実施。ユーザーインサイトを発見〜

株式会社ユカシカド（以下、ユカシカド）は、誰でも簡単に栄養改善ができる世界を目指し、キットで検査ができてアプリで結果が見れる栄養改善アプリ「VitaNote」やVitaNoteでの検査結果に応じて調合したオーダメイドサプリメントをお届けする「VitaNote FOR」、それぞれの簡易版サービスを提供しています。

今回、rootはローンチして2年経ったVitaNoteに対し、より多くのユーザーに継続利用してもらえるよう、マイページのUIデザイン改修や新規コンテンツの開発を通してサービスのUX向上に取り組みました。

顧客視点をデザインに取り入れて購買率7割増。栄養改善サービス「VitaNote」との半年

ご相談いただいた時の状況

rootは、ユカシカドのコーポレートサイトや、VitaNoteのサービスサイトのリニューアルも担当しました。その後、検査結果を確認できるウェブサービスのUI改善についてもご相談いただきました。ユーザーにサービスを継続的に利用してもらうためには、検査結果を閲覧するマイページの改善が必要と判断し、マイページのUI改善に着手。

VitaNoteのマイページでは、検査で得られた健康を維持するために必要な15種類の栄養素の推定摂取量が表示されます。各栄養素ごとの詳細ページでは、各栄養素の過不足や個別アドバイスを確認できます。

マイページを改善することによって、定期検査ユーザーのチャーンレート低減やオーダーメイドサプリの再検査アップセルへつながることがクライアントの期待値でした。

課題に取り組んだプロセス

サービスの目指すべき姿から遠ざからないリニューアルのために

まずは、マイページのUIにおける課題の洗い出し・分析・スコープ定義からスタート。提供者視点での言葉で定義されていたビジネス課題を、顧客視点で必要とされている価値に言い換えることから始めました。提供者視点では、例えば『定期検査ユーザーに離脱させたくない』というビジネス課題がありました。『定期検査ユーザーは何があれば離脱したくなくなるか？』という問いで顧客視点へ転換を行い、顧客が望んでいることや顧客にとって望ましい体験が何かを議論。

その中には『これまでの栄養バランス改善の成果が積み上がっていることがわかる』『アドバイスがこれまでの数値の推移を踏まえたものになる』など、現在のUI改善につながったものも含まれていました。これをTo-Beに向けて取り組むべき施策としました。ユカシカドの目指す『誰でも簡単に栄養改善ができる世界』を実現する、理想のマイページから逆算した施策とも言えます。

また、当時のマイページのUIにはユーザビリティの課題があったため、ユーザビリティの10原則を指標としてヒューリスティック評価を実施。この際、ビジネス課題に関係するリテンション・アップセルを左右するであろう指標も考慮しました。この改善点を洗い出したものが、As-Isの施策です。

顕在化した課題だけを解決していると、サービスのあるべき姿から遠ざかってしまう恐れもあります。そのためTo-BeとAs-Isの施策を総合し、施策がUXのどのレイヤーに影響を与えるのかと、インパクトの2軸で分類。このマトリクス上で、影響度と実現性を考慮しながら、UI改善におけるスコープを定義しました。

スコープを設定した後、離脱とアップセルのそれぞれの要因に対して仮説を考え、解決のためのアプローチを提案。短期と長期に共通して必要な施策、短期的施策、長期的施策のそれぞれをどう進めていくのかをプランニングしました。

ユーザビリティ評価やリサーチの実施

定義したスコープの中で解消すべき課題・取り込む機能を定め、その課題を解消したプロトタイプを実際にユーザーに触ってもらい、施策の効果をテストしました。サプリ購入動線における課題や、マイページの情報設計上の課題などは、短期的に解消可能なものだったので、そこから進めていきました。

ユーザーテストは2パートに分けて実施。まず、プロトタイプによる仮説の検証。もう一つはスコープ定義から溢れた「ユーザーの価値仮説」の探索のためのインタビューです。前者はプロトタイプを使った思考発話法を用いて、後者は半構造インタビューを実施しました。

思考発話法では、プロトタイプをユーザーに触ってもらい、日頃の使用感との違いやうまく使えたかどうか・迷いがなかったかどうかをテスト。半構造インタビューでは、栄養素について関心を持つときのエピソードや文脈について話を聞きました。

ユーザーテストの結果、ユーザーは「自分自身に向けられたアドバイス」や「具体的な行動指針」を教えてもらえることで、アプリの価値をより感じるということを発見。スコープの決定時点で、ユーザーが期待している情報が提供できていないことや、改善行動を実施するための情報を提供できていないなど、「アプリ内のコンテンツ不足」が課題として出ていたものの優先度を下げていました。しかしユーザーの価値として「自分自身に向けられたアドバイス」や「具体的な行動指針」が重要であるとわかったため、優先度を上げてそれらに合致するコンテンツの制作に取り組むことが決まりました。

最終的には、ユーザーテストの結果を踏まえデザインを決定し、仕様を固め開発に入りました。新たなコンテンツの開発については急ピッチで進めることになりましたが、施策を整理した初期段階で、いずれ取り組むとわかっていたもの。必要性が明確だったからこそ、先方からも迷いなく迅速に進めることができました。

解決のアプローチ

課題の分析と改善施策の発散プロセス

課題を分析するために、現状の問題と理想の状態を把握し、現状と理想のギャップから課題を抽出。そこからユーザーに与える影響度と施策にかかる時間の2軸でマッピング。縦軸にはUXピラミッドと呼ばれるフレームを元にユーザーに与える影響度を4段階に分ける。横軸はJesse James GarretのUXを構成するモデルを元にスコープを5段階に。ここで着手の優先度とスコープを定義しました。

プロトタイプを活用した思考発話法による定性リサーチ

ユーザーがプロトタイプを触っている状態で、考えていることをその場で発言してもらう「思考発話法」を使用し、テスト時のユーザーの発言、画面上の行動、実際の行動、事前事後インタビューの内容を情報として収集しました。

半構造インタビューによる探索型の定性リサーチ

プロトタイプによるユーザーテストと合わせて、栄養素について関心を持つときのエピソードや文脈に関する半構造インタビューを実施。半構造インタビューとは、あらかじめ質問項目は決めておくが、回答者の言葉によって自由に質問内容を変えるインタビューの手法。

プロセスから生まれた成果

成果として、マイページの平均滞在時間は67%、マイページ内でのサプリの購買率は75%上昇。

プロジェクトメンバーとクライアントからのコメント

社内でデザイナーを抱えていないユカシカドにとって、事業戦略からデザイナーが関わることは今回がはじめてのことでした。関わる人が多かったこともあり、複雑なことは図にしたり、粒度の荒い状態でもスピーディーにワイヤーフレームに落とし込んだりと視覚的なコミュニケーションを重視した結果、事業にデザインがインストールされるきっかけになりました。

改めてプロジェクトを振り返ると、最初の相談から、現状の課題だけでなく、未来のあるべき姿も一緒に考えて下さったのが非常に大きかったと感じています。本当に事業の成長を一緒に考えてくださっていることが、ひしひしと伝わってきました。デザイナー視点で捉えていることを、私たちも理解できるようコミュニケーションにも気をつかっていただいていたのも印象的でした。自分の想像以上に、デザインで解決できることがたくさんあると学ばせていただきました。今後、サービスを伸ばす上でデザインをより活用していきたいです。

経営企画、事業企画、広報、CS責任者：石田 幸輔さん CTO：寺田 大輔さん