狠狠撸

UX Design for mothers
おかんでもわかるUXデザイン
～ユーザーエクスペリエンスデザインって何？～
Yu Morita
Director, User Experience
Turucame ltd.
CSS Nite in SENDAI, Vol.8
2014/11/22

自己紹介
? 株式会社ツルカメ代表取締役社長
? 株式会社ネコメシ代表取締役CEO
? 株式会社KDDIウェブコミュニケーションズ
顧問
? IA/UXデザインの自称専門家、森田雄です。
? Web担当者Forumにて「UX侍」連載ちう
2014/11/22 CSS Nite in SENDAI, Vol.8 2

本日の主旨
? UXという言葉が、Webサイトやアプリ制作などの現
場でよく使われるようになりました。
? そのほか、経営や事業の戦略であるとか、組織論的な
ものであるとか、さまざまな場面でUXという言葉を
散見します。
? でもUXがどうの言われても、ちょっとピンと来ない
という人もいるのでは？
? 本講ではIA/UXデザインの非専門家の方々を対象に、
「UXデザインとは何か」をご説明いたします。

最近、こんな人見かけませんか？
サイトか何かにダメ出しをしているようです
2014/11/22 CSS Nite in SENDAI, Vol.8
どうもねえ、
UXがねえ、
足りないんだよ
4

あと、こんな人とか
スマホアプリの使用感を述べています
何このUX！
やべー、めちゃ
ヌルヌル！
5

ようするに
? UX言いたいだけだろ案件です。
? UXという言葉を知る以前のほうが、よく
伝わるコミュニケーションがとれていた
かもしれません。

唐突ですがクイズです
ニューヨークへ行きたいかー
＼お～～～～！／
7

UXとは何でしょう？
??????
ちなみにUser Experienceの略です

わかりました！
ユーザの
体験！

やれやれ、これだから子供は
エクスペリエンスは
経験だろう！

直訳しててどうすんのよ！
使い勝手とか、
使い心地の
ことです！

うーん、なんか聞いた話だけど
おもてなし…？

さて正解は…
? 製品やサービスの利用を通じて得られる
ユーザの体験の総称で、使いやすさ?使
い勝手といったユーザビリティ的な要素
を備え、使い心地?感動?印象?生活の
変化など経験としての累積を含む。
? おもてなしだけ、違ったかな？
的な。

ものすごく簡単にいうと
? ユーザの「主観」といっていいでしょう。
? いい体験だった、いい経験をした、これ
は本人にしかわかりませんね。
? すなわちUXとは、本人の主観と、それに
基づいた感想や結果のことです。

UXDとは何でしょう？
??????
ちなみにUX Designの略です

わかりました！
UXの
デザイン！

やれやれ、これだから子供は
デザインとは
設計だよ！

直訳しててどうすんのよ！
顧客のニーズを
満たすこと
です！

うーん、なんか聞いた話だけど
おもてなし…？

さて正解は…
? UXを設計すること。特に「良い」UXを。
? ユーザが求めていることに先回りして、
結果として喜んでもらえる体験や経験を
作り出すためのデザイン手法です。
? いい接待を受ければ嬉しいものですから、
おもてなしも手法が明文化されていれば
UXDだといえますね。

少し補足
? ここでの「デザイン」とは、見た目や雰囲気
などのことではありません。
? 商業や工業といった産業の成果物（製品や
サービスそのもの）をデザインするというよ
うな、大きな意味でのデザインです。
? UXDとは、「良い」UXを量産的に作り出す
仕組み、それ自体をつくることです。

UXDを成果物から読み解く
ま
っ
た
く
あ
ん
た
っ
て
子
は
朝
ま
で
フ
ァ
ミ
コ
ン
ば
っ
か
り…
Ｕ
Ｘ
Ｄ
し
て
る
ん
だ
よ
……
母
ち
ゃ
ん
……
ここからが真の本題です
22

ちょー乱暴な解説
? ペルソナ
? カスタマージャーニーマップ（CJM）
? ユーザシナリオ
? この３つをやれば、UXDです。（キリッ

まず、ペルソナ
? ペルソナ（persona）とは心理学の用語で
「人間の外的側面」、哲学でいうところの
「理性的本性をもつ個別的実体」のことです。
? が、そんなことはどうでもよくて、UXDで
は何のことを指すかというと
? 仮想的なユーザ。実在しそうだけど非実在。
いてもおかしくないので、もしかしたらいる。

ペルソナをつくる目的
? それは合意のためです。
? チームメンバーで共通の指標をつくり、
同じ目的のために思考?行動できるよう
に、ペルソナをつくります。

ユーザは20代前半の女性です
ペルソナが無いチームの場合

ユーザは20代前半の女性です
ペルソナが有るチームの場合

みんなのイメージが同じになりました！
? これで、メンバー各自が異なるユーザ像を想
定しちゃうってことがなくなります。
? 「“誰”のためにデザインするのか」を共有す
ることができますね。
? もちろん、今の例では一般的なターゲット
ユーザの範疇を出ませんので、もう少しペル
ソナとは何なのかを掘り下げましょう。

簡易なペルソナの作り方
1. まず基本となるデモグラフィックを用意
します。
– 顧客データを分析済みなら、それを使う。
– なければ想定しているターゲットユーザーを
ベースにする。（リリース後に実データをと
り、ペルソナをアップデートする）
2. ワークショップ形式でインサイトマップ
を作ります。
3. それを肴に作文して、ペルソナの完成。

ペルソナは実在ユーザの代表格
? 完全に想像だけで作ったペルソナは使い物にな
りませんし、使ってはいけません。
? ペルソナを作ってみよう的なセミナーなどで、
実データに基づくデモグラフィックを使わずに
作ってしまう事例を散見しますが、意味があり
ません。
? なお、本当に実在するユーザ自体をペルソナ化
してもいけません。

実データのデモグラのままだと
実務的に使いにくい
このデザインは我が社のECサービスの全顧客のうち
38%を占める首都圏在住で年収600万円台かつ結婚5年
以内の30代後半の賃貸住宅住まいの世帯が使用した時
にスムーズに使えるのだろうか。本当に効果的な購買に
つながると思うかい？
このデザインだと我
が社のECサービスの
全顧客のうちの38%
を占める首都圏在住
で年収600万円台か
つ結婚5年以内の30
代後半の賃貸住宅住
まいの世帯だと、確
かにちょっと使いに
くいかもしれません
ねえ…。

だからペルソナを作る
このデザインは「山田くん」にとってい
いものだろうか？「山田くん」は効果
的な購買をするだろうか？
確かに、「山田さん」にはとっつきに
くいデザインかもしれませんねえ。

デモグラフィック

インサイトマップ
SeeListen
Action
Think
Pain Gain

プラグマティックペルソナ
ユーザー種別デモグラフィック
抱えている問題点コンテクスト

次に、CJM
? カスタマージャーニーマップ（CJM）とは、
カスタマー（Customer）ジャーニー
（Journey）マップ（Map）のことです。
? カスタマーは「顧客」、ジャーニーは「旅」、
マップは「地図…というかマッピング」。
? 具体的な顧客としてペルソナを題材に、提供
する製品やサービスを利用する「旅」に出て
もらい、その経緯をマッピングしたものです。

CJMをつくる目的
? チームメンバーで共通の指標をつくり、同じ目
的のために思考?行動できるようにつくったペ
ルソナが、具体的にどう利用しているのか、共
通の指標をつくり、同じ理解で思考?行動でき
るようにCJMをつくります。

ユーザが製品を必要とする時
CJMが無いチームの場合

ユーザが製品を必要とする時
CJMが有るチームの場合

みんなの理解が同じになりました！
? これで、ユーザが製品を必要としているタイミ
ングを、メンバー各自が異なる想定しちゃうっ
てことがなくなります。
? ユーザが製品を、どこで知り、どこで理解を深
め、どこで利用し、どのような結果になるかと
いった「旅」の経緯を書き出して、実際にどの
ように製品が使われているのかの理解を共有す
るわけです。

あれ、どこで知り…？
? つまり、製品を使うどころか、出会う前
のところから「旅」が始まっていますね。
? 実際に「UX白書」では、UXを期間で区
切って整理しています。

異なる期間で生じるUXの内在プロセス
利用前
予期的UX
体験を想像する
利用中
一時的UX
体験する
利用後
エピソード的UX
ある体験を
内省する
利用期間全体
累積的UX
多種多様な利用
期間を回想する
いつ
なにを
どのように
Anticipated UX Momentary UX Episodic UX Cumulative UX
よく“UI/UX”といわれるのは、一時的UXの中の、画面と向き合っている時間だけ。
UXDは、利用前?利用中?利用後、そして利用期間全体を対象としたデザインです。
（UX白書 http://site.hcdvalue.org/docs より）
42

UXの連続性
? UXの全体期間のほとんどは、製品やサービスを
利用して「いない」期間です。
? CJMをつくる時は、デザインチームだけでなく、
他の部署からも組織全体から横断的にメンバーを
集め、多様な視点で検討する必要があります。
? 利用前?利用中?利用後、また利用し、利用を終
え、そしてまた利用し…この繰り返しを連続的な
ものと捉え、利用期間全体として「良い」UXを
もたらす仕組みをつくることがUXDです。

簡易なCJMの作り方
1. まず、関係者一同、ペルソナのことをよ
く理解しておきます。
– そのうえで、プラグマティックペルソナやイ
ンサイトマップを、常に見返せる状態にして
おく。
2. ワークショップ形式でカスタマーの
ジャーニーをマッピングしていきます。
– 分岐してもいいですが、ペルソナとして腑に
落ちる範囲での分岐まで。

カスタマージャーニーマップ

そして、ユーザシナリオ
? ユーザシナリオとは、ペルソナの理想的
な「旅」です。
? 理想の旅は、ペルソナ中心ではなく、ど
ちらかといえばサービス提供者中心のス
トーリーです。

ユーザシナリオをつくる目的
? チームメンバーで共通の指標をつくり、同じ目的
のために思考?行動できるようにつくったペルソ
ナが、具体的にどう利用しているのか、共通の指
標をつくり、同じ理解で思考?行動できるように
CJMをつくりましたが、これは現実の「旅」です。
理想的な「旅」とのギャップが改善すべき点なの
です。チームメンバーで同じゴールを見据えて思
考?行動できるようにユーザシナリオをつくりま
す。

現実の「旅」の問題点
顧客はターゲットを認識できていない

理想の「旅」では、こう
顧客は確実にターゲットを捕捉している

みんなの目標が定まりました！
? CJMを検討した結果、ペルソナはターゲットをうまく見
つけられないケースがあるようで、実際にカスタマーサ
ポート部門へ問い合わせると、顧客からのクレームが多
数確認されました。
? ユーザシナリオでは、ペルソナは確実にターゲットを捉
えています。ここにギャップがあることがわかったわけ
です。
? 背中に目印をつけることで、顧客の飛び蹴り成功率が格
段に向上するだろうと結論づけられました。チームメン
バーは、その実現のために、具体的なデザイン作業へと
突入していくのです……！

簡易なシナリオの作り方
? 前のステップで作成したCJMと同様のフォーマットで、
理想的な旅をマッピングしてみましょう。
? もしくは、作成したCJMにさらにポストイットを重ねて
貼っていくのでもOK。

CJMに書き足したバージョン

CJMとシナリオのギャップ
? CJMとユーザーシナリオの間には、いろいろと
ギャップがあることがわかってきますね。
? このギャップを解決するためには、どうすべき
かを考える必要があります。
– UIレベルで解決できるのか？
– コンテクストを作らないとだめなのでは？
– そもそもプロモーションができていない？
– サポート体制に問題があるのでは？

ようするにUXDとは
? チームメンバー、ひいては組織全体が、提供する製品や
サービスを利用するユーザの「認識」「理解」を同一の
ものとし、「何のために、何をどうするのか？」を明文
化するための手法です。
? この後の流れは、まあふつうにプロトタイピングしたり、
ワイヤーフレームつくったり、制作作業をしたりしてい
きます。
? ペルソナ、CJM、シナリオをつくってから、ふつうの制
作をしてみましょう。それがUXDの実践の第一歩です。

以上ここまで、すべて仮説です
? しかしその仮説を、成り立ちからすべて、全関係者で共
有?合意していること自体が重要なのです。
? 製品やサービスをリリース後、実データをとって分析し、
最初の仮説と比較検証しましょう。
? 実際のユーザのニーズを知り、仮説をアップデートして
改善していく。この繰り返しの中で、常に中心となるの
がペルソナです。ペルソナを成長させながら継続的にデ
ザインしていくことが、UXDです。

UXDというデザイン思考
? 観察→アイディア創出→プロトタイピング→ストーリー
テリングというデザイン思考のプロセスがありますが、
これだけだとユーザー視点を損ないがちです。
? 特に大きな組織であればあるほど。複数の部署にまた
がった関係者がいればいるほど。
? デザイン思考に実データを掛け合わせて、プロセスの透
明化と共有、KPIの設定、PDCAの継続をしていくこと
が、「UXD」というデザイン思考のひとつの形である
ともいえるでしょう。

てか、おかん突き放しすぎ…
こ
の
人
……
さ
っ
き
か
ら
何
の
話
を
し
て
る
の
？
今
夜
の
献
立
ど
う
し
よ
う
か
し
ら

UXDを学ぶのに良い文献（ごく一部）
? User Experience White Paper
HCDの専門家たちによる和訳：UX白書
http://site.hcdvalue.org/docs
? 誰のためのデザイン？
新曜社認知科学選書／一読してほしいデザイン思考の定番的書物。
? 理解の秘密─マジカル?インストラクション
NTT出版／最高です。僕の座右の書でもあります。
? コトラー＆ケラーのマーケティング?マネジメント
第12版、丸善出版／鈍器になるほどの重厚感で1万円弱。ぜひ家宝に。

ご清聴ありがとうございました
今
夜
は
カ
レ
ー
よ
~
やったあ～
て
か
家
族
だ
っ
た
の
か
…
このスライドはコミPo!とパワポで作成しました

Presented by
Yu Morita
Director, User Experience
Turucame ltd.
http://necomesi.jp/blog/securecat/
https://twitter.com/securecat
https://www.facebook.com/securecat
CSS Nite in SENDAI, Vol.8
http://cssnite-sendai.info/
Made with Comipo!
http://www.comipo.com/

狠狠撸

おかんでもわかるUXデザイン Ver.0.4

Recommended

More Related Content

What's hot (20)

Viewers also liked (20)

Similar to おかんでもわかるUXデザイン Ver.0.4 (20)

More from Yu Morita (9)

おかんでもわかるUXデザイン Ver.0.4