2019年12月25日
デザイン
初心者のためのカスタマージャーニーマップ解説


はじめに
新しい技術にチャレンジし続けるpalanのアドベントカレンダーDay25です!
昨日はWebAR/VRの表現をひとつ上にするワザ3選のご紹介でした!
本記事ではUXデザインツールのカスタマージャーニーマップについてご紹介します。
実際にカスタマージャーニーマップで何ができるのか、UXについてもっと知りたい方に向けた記事になります。
UXとは
まずは、UXについて簡単にご説明します。
UXにはいろいろな定義がありますが、この場合は顧客(カスタマー)が商品やサービスを認知したり、購入したりする際の一連の動作と体験(エクスペリエンス)のことを指します。
カスタマージャーニーマップとは
UXにおいてユーザーの課題を特定するためのツール、手法の一つです。
具体的には、顧客(カスタマー)が商品やサービスを認知したり、購入したりする際の一連の動作を旅(ジャーニー)に見立てて地図に落とし込んだものです。
サービスに関わる前からサービスを体験した後の一連の行動のなかで、まず、ユーザーはどのような体験をするのか洗い出します。
やり方はいろいろありますが、一般的にはその後に、顧客の感情をマッピングし、ユーザーの体験を損なう原因となっているサービスの問題点をメモしていき、一枚のマップに体系化しています。
UXを向上させるために、ユーザーの視点から課題を見つけ、解決策を考えることができます。
『LEGOのカスタマージャーニーマップ事例』より
目指すUXデザインを可視化して共有できるツール
先ほど書いた通り、カスタマージャーニーマップはプロジェクトのストーリー全体を可視化することができます。
そのため、ステークホルダーやプロジェクトに関わるメンバーとプロジェクトが目指す「UXデザイン」を共有することができます。
アウトプットの段階で判断の根拠が「UXデザイン」に統一されるので、誰かの好みや独断でデザインやUIが決められたりすることが回避され、ターゲットユーザーの満足度を真に満たすためのアウトプットを積み重ねていくことができます。
具体的に何が可視化できるの?
具体的には、下記のような点を可視化することができます:
- ● ユーザーはどの目的のとき、どんな行動をするのか?
- ● ユーザーが、それぞれのサービス体験をフェーズでどんなことを思っているのか
- ● ユーザーとチャネルのタッチポイントとシチュエーション
- ● サービスに関わる際にユーザーが抱える大小様々な課題
- ● 現状のユーザーの課題で、解決できる部分、解決策の洗い出し
- ● ビジネスポイント
他にも、コンテンツの案、目的への導線、UIのアイデアなどもカスタマージャーニーマップを作りながら考えることもあります。
カスタマージャーニーマップの構造
次にカスタマージャーニーマップの構造を説明します。
基本的には左がサービスを分解する軸、上のカラムがサービスの関わるフェーズになっています。
各項目に沿って、上から下に、または左から右へ行を埋めていくイメージです。
- ● 行動…ユーザーの具体的な行動です。
- ● 思考…ユーザーが何を考えて行動を起こしているのか、また次のアクションの前に何を考えているのかをまとめます
- ● 感情…ユーザーのインサイトです。ニーズに絞って洗い出してもOKです。
- ● 課題…現状、ユーザーのために解決してあげるべき課題を書いていきます
また、サービスのフェーズに関して、サービスに訪れる前、情報収集、他サービスとの違い、サービスを利用した時、利用したあととフェーズが分かれています。
こちらはサービス次第でいろいろと変えることができますが、例えば「ECサイト」の例で言うと:
- ● サービスに訪れる前: インターネットで購入品を検索
- ● 情報収集: ECサイトに登録し、購入品の値段を調べる
- ● 他サービスとの違い: 他ECサイトの値段や提供している価値と比べる
- ● 実際にサービスを利用した時: 気になっているものを購入、購入品が家に届く
- ● サービスを利用した後: 購入品を利用し、満足感を得る
ざっくりとこのような一連になります。
まとめ
ユーザーエクスペリエンスジャーニーマップはUXデザインの可視化ツールです。 決まった形はないので、プロジェクトの要件に合わせて自由に使いましょう。
あとは何度か色々なパターンのマップを書いてみるとコツがすぐに掴めるので、どんどん 使ってみることをお勧めします。 慣れれば様々な場面で使用できるツールです。
UXのお仕事に関するご相談
Bageleeの運営会社、palanではUXに関するお仕事のご相談を無料で承っております。
zoomなどのオンラインミーティング、お電話、貴社への訪問、いずれも可能です。
ぜひお気軽にご相談ください。
この記事は
参考になりましたか?
1
0
関連記事

2021年7月16日
デザイン心理学について

2021年2月12日
オブジェクト指向UX(OOUX)とは?

2020年12月13日
デザインの方向性を決めるムードボードの作り方とコツ

2019年12月25日
初心者のためのカスタマージャーニーマップ解説

2018年12月25日
社内ハッカソンで新規サービスを作ってみて

2018年12月19日
サービスのリブランディングに向けてユーザー利用状況グラフとポジショニングマップ作ってみた
簡単に自分で作れるWebAR
「palanAR」はオンラインで簡単に作れるWebAR作成ツールです。WebARとはアプリを使用せずに、Webサイト上でARを体験できる新しい技術です。
palanARへ
palanでは一緒に働く仲間を募集しています
正社員や業務委託、アルバイトやインターンなど雇用形態にこだわらず、
ベテランの方から業界未経験の方まで様々なかたのお力をお借りしたいと考えております。
運営メンバー

Eishi Saito 総務
SIerやスタートアップ、フリーランスを経て2016年11月にpalan(旧eishis)を設立。 マーケター・ディレクター・エンジニアなど何でも屋。 COBOLからReactまで色んなことやります。
sasakki デザイナー
アメリカの大学を卒業後、日本、シンガポールでデザイナーとして活動。

やまかわたかし デザイナー
フロントエンドデザイナー。デザインからHTML / CSS、JSの実装を担当しています。最近はReactやReact Nativeをよく触っています。
Sayaka Osanai デザイナー
Sketchだいすきプロダクトデザイナー。シンプルだけどちょっとかわいいデザインが得意。 好きな食べものは生ハムとお寿司とカレーです。

はらた エンジニア
サーバーサイドエンジニア Ruby on Railsを使った開発を行なっています

こぼり ともろう エンジニア
サーバーサイドエンジニア。SIerを経て2019年7月に入社。日々学習しながらRuby on Railsを使った開発を行っています。

ささい エンジニア
フロントエンドエンジニア WebGLとReactが強みと言えるように頑張ってます。

Damien
WebAR/VRの企画・開発をやっています。森に住んでいます。

ゲスト bagelee

かっきー

まりな

suzuki
miyagi

ogawa
雑食デザイナー。UI/UXデザインやコーディング、時々フロントエンドやってます。最近はARも。

いわもと
デザイナーをしています。 好きな食べ物はラーメンです。

taishi kobari
フロントエンドの開発を主に担当してます。Blitz.js好きです。

kubota shogo
サーバーサイドエンジニア。Ruby on Railsを使った開発を行いつつ月500kmほど走っています!
nishi tomoya

aihara
グラフィックデザイナーから、フロントエンドエンジニアになりました。最近はWebAR/VRの開発や、Blender、Unityを触っています。モノづくりとワンコが好きです。
nagao
SIerを経てアプリのエンジニアに。xR業界に興味があり、unityを使って開発をしたりしています。

Kainuma
サーバーサイドエンジニア Ruby on Railsを使った開発を行なっています

sugimoto
asama
ando
iwasawa ayane

oshimo
異業界からやってきたデザイナー。 palanARのUIをメインに担当してます。 これからたくさん吸収していきます!