UX設計の第一歩-インテリジェントネット社内勉強会

©2016 Intelligentnet, Inc. All rights reserved.
インテリジェントネット社内勉強会
徳永聡
「UX設計の第一歩」
~UX怖がらないでおｋ~
∧∧ ／￣￣￣￣￣
(,,ﾟДﾟ)＜はじまるよ！
⊂ ⊃ ＼＿＿＿＿＿
～| |
,, し`J

今日のお話の前提 1/2
1. これを聞いたからすぐに超素敵UX設計ができる
ようになるわけじゃありません。
2. でも聞かないよりは聞いたほうが良い設計はでき
ると思います
3. 少なくともUX設計のタイミングで「どういう判断
基準で考えれば良いか」はわかるようになると思
います

そんで具体的に何ができるようになるのか
セグウェイで走るモナー
※とくに意味は無いです
-＝ ∧＿∧
-＝≡ （ ´∀｀）
-＝（つ┯つ
-＝≡/ / //
-＝≡（_＿）/ ）
-＝ (◎)￣））

今日のお話の前提 2/2
• プロデューサー
• ディレクター
• デザイナー
• テクニカルディレクター
（フロントエンドエンジニア含む）
「HTMLも決してUXと無関係じゃないんだな」って
思うかもしれない。あとはわかんないけどなんか
それなりに役立つと思う。
提案書の切り口、とっかかり口が一つ増える。
たぶんきっとおそらく。
サイト設計、コンテンツ設計に役立つUXD手法
がわかる。たぶんきっとおそらく。
UIデザインするときに以前よりもっとユーザーを
意識できるようになる。たぶんきっとおそらく。

もくじ
1. UXってなんじゃらほい
2. 良いUXを考える手法など
3. 【実践編】良いUXを考えられるようになるには？

でははじめます

０１．UXってなんじゃらほい
≡ ∧＿∧ ／￣￣￣￣￣￣￣￣￣
≡（ ´∀｀）＜本編お待たせ♪
≡ （つ＝つ＼＿＿＿＿＿＿＿＿＿
≡｜｜ |＼
≡（_＿）＿）＼
≡ ◎￣￣￣￣◎

UXとは・・・・
正式名称「User Experience」の略語。日本語に訳
すなら「ユーザー体験」。経験なのか体験な
のかというのはもうUXの議論っていうより日本語
の議論なので、その辺はもう体験っていうことでい
いんじゃないかと思ってます。

UX＝おもてなし

|￣￣￣￣￣￣￣￣|
| ちがいまーす |
|＿＿＿＿＿＿＿＿|
∧∧ ||
( ﾟдﾟ)||
/ づΦ

|￣￣￣￣￣￣￣￣|
|＿＿＿＿＿＿＿＿|
∧∧ ||
( ﾟдﾟ)||
/ づΦ
お店で考えればわかりやすい

とあるお店。

とあるお店。
UXの主語って誰？

このおっちゃん

このおっちゃん
んなわけあるか

この二人ですよね

この二人ですよね
じゃあ「おもてなし」の主語は？

今度こそこのおっちゃん

今度こそこのおっちゃん
だから「UX≠おもてなし」なのです

まあ、あのー、冷静に考えてみりゃすぐにわかる話で、UXとかいう不慣れな言葉を
つかうからわかんなくなるだけ。だって、旅館の女将に「お客様の体験
はおもてなしです」とか言われても「ちょっとなに言っ
てるのかわかりません©サンドウィッチマン富
澤」じゃないですか。
突然の長文。
おもてなしはおまいさんのサービスでしょうが(ﾟДﾟ)ﾓﾙｧ！
※だから「良いUXを考えるにはおもてなしの心が大事」というのは間違いではないかもしれませんね。

正式名称「User Experience」の略語。日本語に訳
すなら「ユーザー体験」。経験なのか体験な
のかというのはもうUXの議論っていうより日本語
の議論なので、その辺はもう体験っていうことでい
いんじゃないかと思ってます。
もう少し詳しくすると

• ユーザーの「主観」です。
• それが良い体験だったかどうかを決めるのはその人
の感情とか感覚だから。
• 「この車、カコイイ(´Д⊂ヽ」←そう判断するのは
その人の主観であり、だから人によって違うし、さ
らに言えばその車が本当に（世間的に）カッコいい
かはわからない（泣）

UI＝UX

UI＝UX
|￣￣￣￣￣￣￣￣|
|＿＿＿＿＿＿＿＿|
∧∧ ||
( ﾟдﾟ)||
/ づΦ

UI＝UX
|￣￣￣￣￣￣￣￣|
|＿＿＿＿＿＿＿＿|
∧∧ ||
( ﾟдﾟ)||
/ づΦ
Webサイトの場合、ユーザーが体験するものが画面
にあるそのものだから、UXを考える＝UIデザインだ
と思っちゃうんでしょうけど、でも違うものは違う
※といいつつ、いろんな工程をふみつつ最終的に画面つくってるんだから、そういう意味で捉えるならあながち間違いでもないのだけど。

例えば電子レンジで考える

日立の電子レンジ。右側のメニューをみるといろんなことができるっぽ
い。何ができるのかわかるように「コロッケ」とか直接的なラベルつけ
てるっぽい。日立がんばってる（謎）さすがヘルシオつくってるだけの
ことはある
http://kadenfan.hitachi.co.jp/range/lineup/mro-nt5/

日立のオーブンレンジ。右側のメニューをみるといろんなことができ
るっぽい。何ができるのかわかるように「コロッケ」とか直接的なラベ
ルつけてるっぽい。日立がんばってる（謎）さすがヘルシオつくってるだけのことはある
だがしかし、世の中には
こんな電子レンジもある

アイリスオーヤマの電子レンジ。どシンプル。やることはツマミをひね
るだけ、「おまえはそれさえやってくれればあとは俺がなんとかする」
といわんばかりの男前電子レンジ。
(ﾟДﾟ )ﾊﾟﾈｪｯｽ
http://www.irisplaza.co.jp/Index.asp?KB=SHOSAI&SID=H566824F
潔さがあふれ出てい
る・・・
もはや漏れている・・・

こっちが良いUXの電子レンジ？

こっちが良いUXの電子レンジ？
必ずしもそうとは限らないですよね

お料理大好きな丸の内OLさんだったらたぶんこっちを選ぶ。
右のじゃ機能が足りなくてOLさんふてくされちゃう。OLさん
激おこぷんぷん丸。

お料理大好き丸の内OLさんだったらたぶんこっちを選ぶ。右
のじゃ機能が足りなくてOLさんふてくされちゃう。OLさん激
おこぷんぷん丸。
これは、UIとは関係のない話ですよね。
電子レンジの持つ機能そのものの話。

お料理大好き丸の内OLさんだったらたぶんこっちを選ぶ。右
のじゃ機能が足りなくてOLさんふてくされちゃう。OLさん激
おこぷんぷん丸。
UIはUIであって、UXはUXであって。
• UIはUXの中でも非常に重要な要素なのは間違いないです
• でも、あくまでUXを構成する１要素でしかない
• UIだけで解決しない問題はいっぱいある
• すんげーわかりやすいネットショップがあったとしても、
欲しいものがなきゃ買い物しないでしょう

ユーザビリティ？
ユーザエクスペリエンス？
(ﾟ∀ﾟ≡(ﾟ∀ﾟ≡ﾟ∀ﾟ)≡ﾟ∀ﾟ)
ﾄﾞｳﾁｶﾞｳﾉｰ

ユーザビリティとは
※IT用語辞典より

簡単に言うと「使いやすさ」のこと。

例えば電子レンジで考えるリターンズ
たとえばお魚をレンジであたためるとき

魚あっためるぞー
電子レンジ開けるー
メニュー選ぶ「あたため」押す
魚焼けた！
目的達成！
ガチャっとなポチっとなポチっとな

魚焼けた！
目的達成！
ここをいかに簡単に、わかりやすくするかがユーザビリティ
UXはここぜんぶ

魚焼けた！
目的達成！
ここを以下に簡単に、わかりやすくするかがユーザビリティ
UXはここぜんぶ
UXとユーザビリティ
• ユーザビリティというのは、ユーザーが目的を達成する過
程のわかりやすさや効率
• だから、そこに目的を考えることは含まれていない
• 「究極のユーザビリティはUIの存在感を無にすること」な
んて言葉も。
• UXは過程も結果も含めた全部

UXとUXD
(ﾟ∀ﾟ≡(ﾟ∀ﾟ≡ﾟ∀ﾟ)≡ﾟ∀ﾟ)
ﾄﾞｳﾁｶﾞｳﾉｰ

いままでずっと
UX＝良いUX考えること
みたいに言ってきたけど

いままでずっと
UX＝良いUX考えること
みたいに言ってきたけど
|￣￣￣￣￣￣￣￣|
|＿＿＿＿＿＿＿＿|
∧∧ ||
( ﾟдﾟ)||
/ づΦ

まあそりゃそうだっつう話で
• UXはユーザーの体験、そこから生まれる主観、感想。
• なので、UX単体では良いも悪いもないです。
• 良いUXを考えることが大事で、それを「UXをデザ
インする」というわけです。

まあそりゃそうだっつう話で
• UXはユーザーの体験、そこから生まれる主観、感想。
• なので、UX単体では良いも悪いもないです。
• 良いUXを考えることが大事で、それを「UXをデザ
インする」というわけです。
それが「UXD」
_、_
（ ,_ﾉ` ） n
￣＼（ E）ｸﾞｯｼﾞｮﾌﾞ!!
ﾌ /ヽヽ_／／

UXDの忘れてはならない大事なこと

• どんなに素敵なUXを設計しても実現できなきゃ意味が無い
です
• 良いUXを！に意識が行き過ぎると、「ユーザーのためなん
だから」と投資回収ができないほどの体験を考えてしまい
がちです。
• UXDとは、たった一回実現できるだけのことを考える話で
はなく、きちんと運用ができるところまで計画性も踏まえ
て考えるものです。

• どんなに素敵なUXを設計しても実現できなきゃ意味が無い
です
• 良いUXを！に意識が行き過ぎると、「ユーザーのためなん
だから」と投資回収ができないほどの体験を考えてしまい
がちです。
• UXDとは、たった一回実現できるだけのことを考える話で
はなく、きちんと運用ができるところまで計画性も踏まえ
て考えるものです。
神対応のお話
• だから、良くネットでもてはやされる神対応というのも、
対象に含まれるし、含まれません（謎）
• たった一回、一人の店員の心意気が良かったゆえにできた
対応はUXDの産物ではないです（たまたまその人がすご
かっただけ）
• すべての店員が、同じ（神）対応ができるように仕組みを
考えるのがUXDです。

UXとは？まとめ
• UXとはユーザー体験であり、ユーザーの主観
• UIデザインは良いUXをデザインするうえでとても重要な要
素だけど、でもUXはUIだけで考えるものでもない
• UXはただの言葉。UXDが本来の「良いUXを考える」の意
味に当たるもの

０２．良いUXを考える手法など
／￣￣￣￣￣＼
| おまいらも |
∩_∩ | |
（´ー`） < がんばると |
（） | |
| | | | いい |
（___）__）＼＿＿＿＿＿／

手法その１
ペルソナ/シナリオ法

写真とプロフィール

ユーザーが達成したい
こと

ユーザーが実際に体験
して満足するシナリオ

というそういうのが入ったものがペルソナ/シナリオ

というそういうのが入ったものがペルソナ/シナリオ
・・・・というのは一例で、必ず「これ」と決まった
統一のフォーマットがあるものじゃないです。

• 名前やプロフィール、写真などある程度のフォーマットは
ありますが、デザインする対象によってペルソナに必要な
ものも多少変わってきます。
• 「架空のユーザー像」・・・×
• 「仮想のユーザー像」・・・○

そんで。

そもそもなんでこん
なものが必要なの？

なものが必要なの？ペルソナの主な効能は２つ

ペルソナの効能
1. メンバー間の合意のため
2. イノベーションとかアイディア発想のため

ここで質問。

「２０代後半の女性」

どんな人を思い浮
かべましたか？

どんな人を思い浮かべましたか？

• 一言に「２０代後半の女性」と言っても様々なタイプの人がいます
• その人は、価値観も、ライフスタイルも、まったく違うでしょう
• その状態のまま複数のメンバーでUX設計をスタートしてしまったら、「２０代
後半ならファッション興味あるでしょ」「ええ、でもそんな派手な格好はもう
しないでしょ」となって議論が進みません。

• 一言に「２０代後半の女性」と言っても様々なタイプの人がいます
• その人は、価値観も、ライフスタイルも、まったく違うでしょう
• その状態のまま複数のメンバーでUX設計をスタートしてしまったら、「２０代
後半ならファッション興味あるでしょ」「ええ、でもそんな派手な格好はもう
しないでしょ」となって議論が進みません。
そこで、メンバー全員が共通のユーザー像を描けるようにするための手法と
してペルソナが出てきます。「この佐藤優子さんは～」と、全員が同じユー
ザーを描いて議論ができるので、合意形成がスムーズになりますね

ここで質問。

「主婦が喜ぶ洗濯機の
新機能を考えてください」

洗濯機にあったら良いもの―良
いもの―、うーん(;・∀・)

ペルソナがあると・・・？

主婦の渡辺さんは、子供５人の大家族のお母さんだからー、そし
てー、いつも子供たちが学校に行ったあと１０時ぐらいから洗濯を
始めるからー、まず洗濯物を集めなきゃいけないよねー、それっ
て重いんじゃないかなー？(´・ω・`)

• 何の情報もなしにまっさらな状態でアイディアを出せと言われても難しいです
よね
• もっと具体的に、どういう価値観で、どういう生活のなかで使われるのかと想
像しながらの方がアイディア出しやすいですね
• さらに何に困ってるのか、どこに問題があるのかを実際の生活を想定して考え
ると良いですよね

• 何の情報もなしにまっさらな状態でアイディアを出せと言われても難しいです
よね
• もっと具体的に、どういう価値観で、どういう生活のなかで使われるのかと想
像しながらの方がアイディア出しやすいですね
• さらに何に困ってるのか、どこに問題があるのかを実際の生活を想定して考え
ると良いですよね
ペルソナが、それを助けてくれます。ターゲットとなるユーザーの詳細な姿、
生活スタイルや悩み事などまで描くことで、新しい機能やアイディアを創出
しやすくなります。

ペルソナ/シナリオ法を使うときに
注意しなければならないこと

• 顧客データやアンケートなど、定量的なデータをもとに作成する

• ヒアリングやグループインタビューなど定性的な調査をもとに作成する

• つまり、定量と定性の両方の調査データをもとにつくらなければいけません

• 調査データなしに想像だけで作成したペルソナは使えないし、使ってはいけま
せん

• 調査データなしに想像だけで作成したペルソナは使えないし、使ってはいけま
せん
ペルソナは「本当にそこにいるかのような」仮想のユーザー像です。それを何
の根拠もなく空想でつくってしまうと・・・？恐ろしい話ですよね

手法その２
カスタマージャーニーマップ

※ http://web-tan.forum.impressrd.jp/e/2014/03/24/16722 より引用

AISCEAS的なやつ

利用シーン

デバイスとかチャネル
とタッチポイント

そしてそれぞれのユー
ザーの行動フロー

というそういうのが入ったものが

カスタマージャーニーマップの導入目的
• これも、基本的にはペルソナと一緒でメンバー間の合意形成のためです。
• 一言に「スマートフォンサイト」といっても、それをユーザーがどんなタイ
ミングで使うかは様々です。
• もうとっくにサービスを知っているヘビーユーザーとして訪れるのか、電車
内で広告を見つけて検索して訪れるのか・・・

カスタマージャーニーマップの導入目的
• 一言に「スマートフォンサイト」といっても、それをユーザーがどんなタイ
ミングで使うかは様々です。
• もうとっくにサービスを知っているヘビーユーザーとして訪れるのか、電車
内で広告を見つけて検索して訪れるのか・・・
ユーザーがどこでサービスの名前を知り、どこで検索をして、どんなデバイ
スでサイトを観て、どんなタイミングで来店するのか・・・といった、ユー
ザーとサービスの出会いから体験、さらにはその後の継続利用までの一連の
流れを視覚化することで、UX設計の合意形成をスムーズにするもの、それが
カスタマージャーニーマップです。

手法その３
UXフロー

UXフロー

UXフロー
ユーザー名とタスクフロー

UXフロー
タスクごとに発生するニーズ

UXフロー
ニーズに対応するために重要
となるポイント

UXフロー
この資料では簡易版のため「設計ポイン
ト」が入ってますが、より詳細な完全版
をつくるときは、ここに「必要なコンテ
ンツ」を入れることもあります

UXフロー
というそういうのが入ったものが
UXフロー

UXフロー

UXフローの導入目的
• ただ、どちらかというとUXフローは合意形成よりも、具体的なサイト設計を
するために必要なもの、捉えたほうが良いかもしれません。
• ほとんどのユーザーはWebサイトに来ていきなり問い合わせをするわけでは
ありません
• あれを調べ、これを調べ、他のことも調べ・・・と、一つのWebサイトでも
流れがあります。

UXフローの導入目的
• ただ、どちらかというとUXフローは合意形成よりも、具体的なサイト設計を
するために必要なもの、捉えたほうが良いかもしれません。
• ほとんどのユーザーはWebサイトに来ていきなり問い合わせをするわけでは
ありません
• あれを調べ、これを調べ、他のことも調べ・・・と、一つのWebサイトでも
流れがあります。
ユーザーがそのサイトに訪れてからコンバージョンが発生するまで、その流
れを視覚化したものがUXフローです。つまり、逆説的に言えばこのフローの
すべてのタイミングでユーザーに適切にアプローチをしないとコンバージョ
ンに到らないということです。UXフローはそのサイトですべきことを整理す
るための手法です。

UXフローの素朴な疑問その１

「ユーザーはそんな
一本道で行動しなくね？」

• はいそうです。

• でもそれでいいんです。大事なのは「正しい順序を組むこと」じゃないから。

• でもそれでいいんです。大事なのは「正しい順序を組むこと」じゃないから。
• 大事なのは「サイトの理想的な体験を紡ぎ出し、そこに必要なタスクとコンテ
ンツを洗い出すこと」なので、順序はそれほど重要じゃないのです。
ユーザーがサイトで満足するまでに、どんなタスクが発生し、どこでどんなア
プローチをしなければならないのか、それを導き出すことが重要で、順序は
（相当変じゃない限り）さほど重要ではないのです。

UXフローの素朴な疑問その２

「こんなにくまなくサイトみないで
問い合せする人もいるじゃん」

• その人はとても素敵なお客様なので、そのままぜひ問い合わせいただければ良
いでしょう。そのためにちゃんと動線を確保しておけばいいだけのこと。

• そうじゃない人、最も手ごわい（けれど大切な）お客様に対して、最高の自社
サービスを提供する、その流れを可視化するそれがUXフローです。

• そうじゃない人、最も手ごわい（けれど大切な）お客様に対して、最高の自社
サービスを提供する、その流れを可視化するそれがUXフローです。
大事なことは、「理想的な最高の体験の流れをつくること」なのです。そのた
めには、それを受け取る人を想定してUXフローを創ることが大事。

UXフローの素朴な疑問その３

「あれ？カスタマージャーニーマップ
と何が違うの？」

• ドキッ(;・∀・)
• たしかに、人によってはどっちかだけでやる人もいます。UXフローに全チャネ
ルをぶっこむやり方とかもある

• ドキッ(;・∀・)
• ただ、一応ちがうものなので、こう覚えるとわかりやすいです。

• ドキッ(;・∀・)
こう覚えよう
UXフロー
TVCM スマホサイト PCサイトリアル店舗
検索して訪れる
○○を調べる
○○を調べる
SNSでシェアする

• ドキッ(;・∀・)
こう覚えよう
UXフロー
TVCM スマホサイト PCサイトリアル店舗
検索して訪れる
○○を調べる
○○を調べる
カスタマージャーニーマップがすべての
タッチポイントの設計、UXフローがタッチ
ポイントごとの詳細な設計、という感じ

UXD手法まとめ
• ペルソナ/シナリオ法
• カスタマージャーニーマップ
• UXフロー

UXD手法まとめ
• ペルソナ/シナリオ法
• カスタマージャーニーマップ
• UXフロー
他にもたーくさんあります。ストーリーボード、ウォークスルー、デプスイン
タビューなどなどなど。でもとりあえず上の３つをおさえておけばあとは派生
で取捨選択していけば良いと思います。

０３．【実践編】良いUXを考えられる
ようになるには？
∧＿∧ ／￣￣￣￣￣
（ ´∀｀）＜マターリ聞いてね…
（ ⊃ .旦| ＼＿＿＿＿＿
し＿）___）

０３．【実践編】良いUXを考えられるようになるには？
良いUXを考えられるように
なるには・・・・

の前に突然ぜんぜん違う話

本当にあった最近の話

toksato大好きJリーグ

toksato大好きJリーグ
Jリーグ各クラブは毎年この時期になると、
今年１年の体制などなどを報告する記者会見をやります。

toksato大好きJリーグご覧の通り、社長の話があったり、強化本部長の話があったり、
監督や選手の話があったり、今年１年どういうサッカーをしてい
くのか、サポーターに何を提供するのか、という話

時間を見つけては
いろんなクラブの会見を読みたいぞ。

時間を見つけては
いろんなクラブの会見を読みたいぞ。
検索してみる

すごい！スペシャルコンテンツまであった！

すごい！スペシャルコンテンツまであった！
∩
( ⌒) ∩_ _
/,. ﾉ i .,,E）
./ /" / /"
./ / _、_ ／ノ'
/ / ,_ﾉ` ）／／
（／ good job!
ヽ |
＼＼

一方、トップページでは

・・・・・
あれ？どこからリンクが・・・・？
（３分探してもわからなかった）

ソースをみてみると
ここ（スライドの１１枚目）
ここ（新着の下から二つめ）
にあった

ソースをみてみると
ここ（スライドの１１枚目）
ここ（新着の下から二つめ）
にあった
わかんねぇよ(゜-゜)

横浜F・マリノス
ここ

鹿島アントラーズ
なかった
（まじかよ）
※もっと探せばあるのかもしれない・・・

名古屋グランパス
ここもなかった

FC東京

FC東京
そもそも会見のページが見当たらなかった・・・(‘Д’)

• この時期においてユーザーが最も求める情報では？
• クラブとしても大変重要な情報だと思うけど・・・
• 毎日見てるようなユーザーじゃなきゃ見つけられん
• というか、マニフェストみたいなもんだから1年中わかるとこ
ろに置いておけばいいのに
おかしいなぁ・・・

こういうことを意識して毎日を
過ごすことが大事

こういうことを意識して毎日を
過ごすことが大事
なぜか。

UXD手法、金かかる問題

• ペルソナを「完全なる空想で創るな」と書きました。
• そうすると、顧客データ、インタビュー、アンケート・・・まともに全部やっ
てたら時間も費用もすっごいかかる。
• これは程度の差こそあれカスタマージャーニーマップもUXフローも同じ。
• たかだか一つのバナーデザインするために用意していられない

• ペルソナを「完全なる空想で創るな」と書きました。
• そうすると、顧客データ、インタビュー、アンケート・・・まともに全部やっ
てたら時間も費用もすっごいかかる。
• これは程度の差こそあれカスタマージャーニーマップもUXフローも同じ。
• たかだか一つのバナーデザインするために用意していられない
毎回毎回潤沢に予算があるわけではないし、あってもそれを回収できないこと
だって多い。

UXD手法、やれば誰でも最高なもの
ができるわけじゃない問題

• ペルソナを創れば必ず良いUXが設計できるわけじゃない
• そりゃ、大人がやるのと幼稚園児がやるのではできあがるものは確実にレベル
が変わってくる
• やらないよりはやった方が良いだろうけど、やれば必ず最高のUXができるとい
うものではない

• ペルソナを創れば必ず良いUXが設計できるわけじゃない
• そりゃ、大人がやるのと幼稚園児がやるのではできあがるものは確実にレベル
が変わってくる
• やらないよりはやった方が良いだろうけど、やれば必ず最高のUXができるとい
うものではない
UXD手法だってあくまで手段の一つに過ぎなくて、最終的なクオリティに一
番影響するのは設計する本人の力なのは変わらない

UXD手法の抱える問題のまとめ
UXD手法だってあくまで手段の一つに過ぎなくて、最終的なクオリティに一番影響するのは設計す
る本人の力なのは変わらない
毎回毎回潤沢に予算があるわけではないし、あってもそれを回収できないことだって多い。

UXD手法の抱える問題のまとめ
UXD手法だってあくまで手段の一つに過ぎなくて、最終的なクオリティに一番影響するのは設計す
る本人の力なのは変わらない
毎回毎回潤沢に予算があるわけではないし、あってもそれを回収できないことだって多い。
その都度その都度、手法を1から洗ってたんじゃもう遅い
んです。ある程度のことまでは、いつだって意識して
UXについて考えていなければ、いきなりお仕事で
パッと良いUXなんて設計できないんです。

だから、こういうことを意識し
て毎日を過ごすことが大事

だから、こういうことを意識し
て毎日を過ごすことが大事
もっと具体的な話をしましょう(/・ω・)/

一般ぴーぽーがJリーグクラブ
のサイトを観たとき
(‘ω’)
• 新体制会見どこー？
• 見当たらない・・・
• ぁあああああああああああああああ
• すざけんな！もういい！J’sゴール（Jリーグ公認ファンサイト）
みるわ！

UXを意識している人がJリーグ
クラブのサイトを観たとき
• むむぅ。キーワードでググってみよう。→あった。
• いまの時期のJクラブにはこれは重要な情報では？
(・∀・)
UX
UX

• ・・・他のクラブはどうなんだろう？
• 毎日見ないユーザーは対象じゃないと
か？
(・∀・)
UX
UX

• ・・・他のクラブはどうなんだろう？
• 毎日見ないユーザーは対象じゃないと
か？
(・∀・)
UX
UX
ここには、例えばこういう視点があるわけです

脳内にUXフローを描いて観察
UXフロー
クラブ名で検索して訪れる
○○を調べる
○○を調べる

脳内にUXフローを描いて観察
• クラブ名で検索して訪れたけど、なかには検索エンジ
ンに直接「クラブ名会見 2016」って検索してくるユー
ザーもいるか。
• どうなってる？
(・∀・)
UX
UX
UXフロー
クラブ名で検索して訪れる
○○を調べる
○○を調べる

脳内にカスタマージャーニー
マップを描いて観察
TVCM スマホサイト PCサイトスタジアム

• いまスマホでみてるけど、PCサイトが表示されてる
• Jリーグのサポーターだったら、仕事じゃないんだし多くの人がスマホ
で移動中とか空き時間を使って閲覧するのでは？
• うーん、じゃあここはビジネス的には是が非で
もスマホサイト必要では？
(・∀・)
UX
UX

(・∀・)
UX
UX
ここでできればビジネス側のことも考える

(・∀・)
UX
UX
• ただなぁ、Jリーグクラブって多くは予算が厳しいからなぁ
• そんなにWebに（だけ）強い人ばかり採用するわけにも
• 主軸はやっぱりクラブの強化だし
• ・・・でも、それならスマホでも情報は取れるようにスペシャ
ルコンテンツからテキスト版へのリンクはるだけでもいいのに
なぁ
ここで、できればビジネス側のことも考える

逆に、良いUXを見つけることも大事

• 皆さんご存知あいふぉーん（謎）
• iPhoneはもちろん音楽や動画が鑑賞できるの
ですが
• ところで、音楽再生中にイヤホン
を外すとどうなるか知ってます
か？
そう、iPhoneならね、の話

• 皆さんご存知あいふぉーん（謎）
• iPhoneはもちろん音楽や動画が鑑賞できるの
ですが
• ところで、音楽再生中にイヤホン
を外すとどうなるか知ってます
か？
そう、iPhoneならね、の話
答えは「曲が停止される」です

• これって、理屈上はおかしい挙動なんです。
そりゃそうだろうと思うかもしれな
いが、ちょっと待って

２．音が「スピーカー」から出る or 「イヤホン」から出る
１．音が出る or 出ない

これは本来、別々の仕様を組み合わせて、結果として「イヤホンから音が出
る」という形になってる。

とすると・・・・

• 「イヤホンを外す」と音が出るかどうかは連動しないのがシス
テムの理屈
• 再生が止まる、なんてもっとおかしい

• 「イヤホンを外す」と音が出るかどうかは連動しないのがシス
テムの理屈
• 再生が止まる、なんてもっとおかしい
• 実際、昔は電車の中でうっかりイヤホンが外れてし
まって大音量が流れる（汗）なーんて携帯音楽プレイ
ヤーがほとんどじゃなかったですか？

でも、それでいいんですよね。

• 理屈上はおかしい挙動なんです。
• でも、人間は理屈通りに生きているわけじゃない
• イヤホンを外す時の大半は「もう聞かないとき」なんですよね。

• 理屈上はおかしい挙動なんです。
• でも、人間は理屈通りに生きているわけじゃない
• イヤホンを外す時の大半は「もう聞かないとき」なんですよね。
AppleがペルソナやUXD手法を使ってるかどうかはわからないけど、少なく
とも外側から観察する時にペルソナやUX手法が脳内で描かれていれば、これ
に気付けるんですよね。「なるほど、そういうことか」と。

良いUXを考えられるようになるには？
まとめ
• 毎日をUXを意識して観察する
• 脳内でUX手法をやってみる
• できればビジネス視点でも考える
もちろん、手法そのものを学んで実践するのも大事です。でも、何よりも大事
なのは手法そのものではなく、その考え方を身につけることだと思います。

というわけで、やっぱりこれ。

０４．UI設計の手法と実践（パターン）
つまり亀仙流である
UX設計能力を向上させるには

UX設計能力を向上させるには
こういうこと。

以上ですありがとうございました。
インテリジェントネット株式会社
http://www.ini.co.jp/
インテリジェントネットFacebook
https://www.facebook.com/intelligentnet

UX設計の第一歩-インテリジェントネット社内勉強会

Recommended

Recommended

More Related Content

What's hot

What's hot (20)

Viewers also liked

Viewers also liked (14)

Similar to UX設計の第一歩-インテリジェントネット社内勉強会

Similar to UX設計の第一歩-インテリジェントネット社内勉強会 (20)

UX設計の第一歩-インテリジェントネット社内勉強会