Overview 

• User research
• UI design
• User test
• Front-end coding
  

一体何が悪いんだ？ 

UX成熟度が低い組織でUX改修を行う際に頻繁に発生する問題の一つは、全体的なユーザーフロー・前後関係を考えるステップがないまま、購入フローの中で漠然に効果が大きそうなページだけの改修を思い込みで実施してしまうことだと思います。

本案件を担当することになった時にも、案件の実施だけは決まっていましたが、チーム内部での具体的な「問題」の特定・解決方法について共通認識が貧弱な状態でしたので、私はまず何が問題なのかを明確にすることに着手しました。

課題発見の時に、個人的な感想・思い込みを極力排除するために、チケット購入に関する全体的な行動をチェックするユーザーリサーチを実施しました。

ユーザーリサーチの様子

ユーザーリサーチの結果、チケット購入に関する購入意欲・行動は商品に大きく次の２つに分類することが出来ました。

・簡単購入のニーズ
　“行きたい公演は決まっている。すぐに買いたい。”

・情報確認のニーズ
　“まずは内容をちゃんと確認したい。その後に買いたい。”

一見すると矛盾するように見えるニーズですが、前職の楽天トラベルの場合を考えても出張とレジャー利用のユーザーが共存していて、購買意欲のレベルが違うユーザーの混在はECサイトでは良く見られることだと思います。
ユーザーのニーズを把握した後は、チーム内でユーザーの具体的・共通のイメージを持って改題点が発見できるようにペルソナを作成しました。

ペルソナ作り

ローソンチケットが扱うイベントの種類・ジャンルは非常に幅広く、一つのペルソナだけで対応することは出来ませんので、ユーザーをいくつかのグループに分類した後は各グループを代表するペルソナを作りました。

ペルソナの一例

細かいUX課題のリストを作る時には、改善の目的と離れた課題も入ってしまう場合がよくあります。明確な優先順・方向性を維持するために、集めた個別問題をいくつかのカテゴリーに分類しました。

課題のカテゴリー

カテゴリー化の後は、課題のより具体化するためにユーザーシナリを作成しました。そして、そのシナリオをベースに解決案のアイデア出しを実施しました。

解決案のアイデア出し

UI案の製作と検証

試してみる解決案を決めた後は、UIのデザインに入りました。UI案に関しては、SketchやAdobeXDを利用したデザインアセットが存在しない状況でしたので、一部のパーツになりますが、今後の拡張性を考慮してUI部品としてUI案を作るようにしました。

Design ideas

Ticket list ideas

Title and SNS ideas

Desktop UI idea

UI案を集めた後は、Adobe XDを利用したLo-Fiプロトタイプで各UIパーツの理解度・使い方についてユーザーテストを実施しました。

Lo-Fiプロトタイプの検証後は、UI案をさらに絞って、HTMLを利用したHi-Fiプロトタイプで機能を検証しました。

Hi-Fiプロトタイプを利用したユーザーテストでは、購入意欲が高いユーザーのシナリオを想定した「チケットの購入」と情報の確認を優先するユーザーのシナリオを想定した「公演の情報確認」の大きく２つのタスクを被験者に与えてその達成度を確認しました。

最終的に、ユーザーテストで致命的な問題や想定していないの課題がないことを確認した後は、社内に向けて最終版の共有及び、運用上の注意事項について説明しました。

学んだこと

社内のUXチームで実施した初めてのUX改修だったため、解決すべきのUX課題以外に、ユーザーテストの必要性をチームメンバーに理解していただくなどのチーム教育に関する重たい課題も認識できました。
また、UIアセット・ガイドラインの不在・フロントエンド役割分担が不明確・Gitなどを利用したバージョン管理の未対応などの問題もありましたので、環境整備の計画を立てる必要性を感じました。

しかし、熱意を持っているチームメンバーと協同プレイが出来たことは非常に大きな収穫でした。

All content ©Seonguk Choi  2020