「第4回 UX 勉強会」、「UX デザインの高速インストール」資料 http://overkast.jp/

1. What is
“UX Design” ?

2. What is
“UX Design” ?

7. ・・・ ?

8. UX
Design?
ここ10年ぐらいの流れを振り返ってみる

9. 時代背景
2000 2005 2010
ITのモード（潮流）
ドットコムバブル Google アジャイル Web 2.0 ソーシャルシフト iPhone クラウド Lean Startup
思考のモード（流行）
ロジカル思考 システム思考 プラットフォーム思考 コミュニケーション思考 デザイン思考 未来思考
デザインのモード（価値・権威）
ユーザビリティ Human Centered Design サステナビリティ クロスメディア／クロスチャネル サービスデザイン
アクセシビリティ User Experience Design プロトタイピング ストーリーテリング Lean UX
ISO13407 ISO9241-210
IA/UX UI/UX
System Management Design Engagement
Design System
Webサービス
Webサイト
／アプリ

10. 左脳的世界観から右脳的世界観へ
悟性 感性
認知 感情
合理 非合理
説得 納得
データ ダイアログ
定量 定性
モノ コト
オブジェクト アクティビティ
システム思考 デザイン思考
ツリー セミラティス
シナリオ ストーリー
モーダル モードレス
閉じた体系 開いた体系

11. IA UX
The
Three
Circles
of
Informa1on
Architecture
/
The
User
Experience
Honeycomb
by
Peter
Morville

12. The
Disciplines
of
User
Experience
by
Dan
Saffer

13. The
Nine
Pillars
/
The
Elements
of
User
Experience
by
Jesse
James
GarreF

14. The
Spectrum
of
User
Experience
by
Oliver
Reichenstein

15. The
Fundamentals
of
Experience
Design
by
Dan
Saffer

16. Tasks
to
Experiences
by
Stephen
P.
Anderson

17. Meaningful
Experiences
by
Nathan
Shedroff

18. User
Experience
Deliverables
by
Peter
Morville

19. The
User-­‐Centered
Design
Of
Digital
Products
by
Namahn

20. 全部違う図だったけど、全部間違ってない気がする・・
UX
Design?
つぎに「UX」と「デザイン」を分けて考えてみる

21. UX / Design

22. ドナルド・ノーマンによる「ユーザーエクスペリエンス」の定義
ユーザーエクスペリエンスとは、企業のサービスやプロダクトとエンドユーザー
のインタラクションにおける、あらゆる状況を網羅したものである。（…...）
提供するサービスやプロダクトにおいて、質の高いユーザーエクスペリエンスを
実現するためには、エンジニアリング、マーケティング、グラフィックデザイン、
インダストリアルデザイン、インターフェイスデザインといった、多様な専門分
野のサービスをシームレスに結合することが必要である。

23. つまり、
UX ＝ 広義な概念

24. UX / Design

25. 「美しい」デザインとは？
またはデザインの先入観について

26. 「美しい」とは・・
２つの美的判断
「好ましさ」
ある限定された個別の趣味によってなされた判断。
人が「美しい」と言うとき、判断の一致を他人に要求している。
「一般に美しい」
ある美的判断に基づいた論理的判断。
悟性による概念なので、言葉によって他人と共有することができる。
純粋な 純粋な
美 快
感性の自己組織化 興奮量の減少
（自閉症患者の症例） 「美しい」とは、 （死、オーガズム直後）
「好ましさ」と「一般に美しい」が入り混じった、
不純なもの

27. デザインのパラダイム
〈時代〉 工業時代 à ポスト工業時代
〈手法〉 技術中心 à 人間中心
〈価値〉 科学 à コミュニケーション
〈場所〉 オンライン／オフライン à オンライン＋オフライン
〈思想〉 機能主義 à ユーザー中心のデザイン文化

28. かつては、
形態は機能に従う
ルイス・サリヴァン（1856 - 1924）
まだ100年前の刷り込みで解釈されている？

29. Walter
Gropius
'Diagram
of
the
Bauhaus
Curriculum',
1923

30. 現在は、
形態はユーザーが与える意味に従う
ジョナサン・アイブ（1967 - ）

31. 00年代に表面化した新しいデザインの形態
これは30年前に起きたデザインの転回

32. ドナルド・ノーマンのアフォーダンス
「支えることをアフォードするもので、それゆえ座ることを可能にする」
対象物がユーザーに対して、
その「アフォーダンス」を認識させ、
使い方を示唆し、行動を誘発させる。

33. 佐々木正人氏によるノーマンの理論の解釈
ユーザーの「メンタルモデル」から対象物の「アフォーダンス」を考える
「リアリティのデザイン」
メンタルモデル
アフォーダンス
?

34. ジェームズ・J. ギブソンのアフォーダンス
「ある対象のアフォーダンスは、観察者の要求が変化しても変化しない。観察者は自分の要求によってある
対象のアフォーダンスを知覚したり、それに注意を向けたりするかもしれないし、しないかもしれないが、
アフォーダンスそのものは、不変であり、知覚されるべきものとして常にそこに存在する。
アフォーダンスは、観察者の要求や知覚するという行為によって対象に付与されるものではない。
これは、新しい意味であり、価値である。」
対象物が使い方を知覚させるのではなく、
ユーザーが自発的に使い方を知覚する。
ユーザーとの関係性を問わず、
「アフォーダンス」は常に存在する。

35. クラウス・クリッペンドルフによるギブソンの理論の解釈
ユーザーの行為は原因であり、感覚によって「アフォーダンス」をピックアップした結果、
ユーザーの内部に「意味」が発生し、循環が起きる。
ユーザーの理解
意味
喚起する 展開する
予期する
予期する
感覚 行為
結果 インターフェイス 原因
外在的なもの
!

36. つまり、すでに、
.
デザイン ＝ UX デザイン
.

37. 改めて見てみると・・

39. 要するに・・、
UX デザインとは、
ユーザーと様々なモノ・コトとの関係を
より豊かなものにすることを目指し、
ユーザーが体験することを中心に考えながら、
様々な方法論を組み合わせて、
その関係における課題を解決をすること。

40. Webサイト構築におけるUXデザイン
HCDプロセス
ミクロ 定性 感情モデル ストーリー 動線 メンタルモデル 心地よさ
UX コンセプト
ユーザー 拡散・ 収束・
問題 調査 戦略 設計 デザイン 開発
の特定 多様性 整合性
ビジネス 解決のアイデア
マクロ 定量 認知モデル シナリオ 導線 UI 使いやすさ
フレームワーク（例）
ユーザー要件 成長戦略 制約要件 ジャーニーマップ
ステージ
新規 経済的
商品 拡張 創出 有用性
アクセシビリティ 実現性 行動
思考
ユーザビリティ 既存 技術的 感情
商品 管理 適応
実現性
体験
新規ユーザー 既存ユーザー

41. また、
UX デザイン ＝ グランドセオリー

43. 参考図書
クラウス・クリッペンドルフ 後藤武・佐々木正人・深澤直人
『意味論的転回 ― デザインの新しい基礎理論』 『デザインの生態学』
UXデザイン、ユーザーの意味としてのデザイン 「アフォーダンス」など
Susan Weinschenk 『認知心理学』
『インターフェイスデザインの心理学』
広義のユーザビリティ本
新し目の認知心理学や行動経済学などを応用した、
UI 設計の説得／納得に使える Tips 集
ティム・ブラウン 濱野智史
『デザイン思考が世界を買える』 『アーキテクチャの生態系』
社会学におけるアーキテクチャ理解、
または国内インターネット総論

44. What is
“UX Design” ?