Contenu connexe Similaire à ITエンジニアに易しいUI/UXデザイン Similaire à ITエンジニアに易しいUI/UXデザイン (20) 2. 自己紹介
金 成哲 / @Roy_S_Kim
kim@nextconceptdc.com
K ソリューションディレクター
NCデザイン＆コンサルティング株式会社
http://nextconceptdc.com
2
5. どちらかと言うと、
エンジニア
コンサルタント
技術職が長い シニアコンサルタント
プリンシパルコンサルタント
アーキテクト
プロダクトマネージャー
ソリューションディレクター
5
23. 元上司の鈴木さん
コンサルティングファーム時代の上司
元アップルジャパン社員の熱狂的なアップルファン
Windogs なんか使ってどうする？
※
Macを使え！
スズキ
「WebObjectsはすごいぞ！
絶対勉強した方がいい！」
※「Windogs」は「鈴木語」の一つであり、誤字ではありません。また、実在する似た名前の製品との関連は確認されておりません。
23
24. 元上司の鈴木さん
結構しつこい！
仕事では使えなさそうだし、
デザイナーが使う物でしょう？
K
スズキ
されたと思って使ってみなよ。
エンジニアとしても勉強になる！
24
31. どんどんMacの世界に
Mac Windows
2006 2010 Now
30% 30%
100%
70% 70%
31
38. デザインとの出会い
あの気持ち良さの原因はどうやら
デザインと言う要素にあったらしい！
確かに、Windowsと比べるとできること（機能）
は同じか、逆にMacが少ない。
でも使っていて気持ちいい。
38
40. いいデザインとは？
「いいデザインとは？」
その前に先ず、デザインって何？
何を勉強すればいいデザインができる？
40
41. デザインとは？
著作権に抵触する恐れがあるので非表示
ごめんなさい！
m(_ _);m
デザイン 『フリー百科事典 ウィキペディア日本語版』。 2012年10月31日 (水) 13:27 http://ja.wikipedia.org/wiki/デザイン
41
43. デザインとアートの違い
アート デザイン
‣自分の表現が大事 ‣商品や企業の表現が大事
‣作家の自己表現 ‣使用者の自己表現を支援
‣自分がやりたいこと ‣使用者がやりたいこと
‣多数の理解を求めない ‣多数の理解を求める
43
44. デザインとアートの違い
焦点は常に
ユーザーにある
アート デザイン
‣自分の表現が大事 ‣商品や企業の表現が大事
‣作家の自己表現 ‣使用者の自己表現を支援
‣自分がやりたいこと ‣使用者がやりたいこと
‣多数の理解を求めない ‣多数の理解を求める
44
48. いいデザインの前提
先ず、使用者を正しく定義し、
使用者のニーズを詳しく理解しないといけない。
そうでないと正しい心遣いができない！
48
50. UXデザインとの遭遇
UX = User Experience
つまり、使用者の経験をデザインするってことだよね？
これを勉強すればユーザーを正しく理解できるのでは？
50
51. UXデザインとは
著作権に抵触する恐れがあるので非表示
ごめんなさい！
m(_ _);m
ユーザーエクスペリエンス設計 『フリー百科事典 ウィキペディア日本語版』。2012年11月25日 (日) 08:16 UTC http://ja.wikipedia.org/wiki/
51
52. UXとは
UX白書の
UXの定義
http://site.hcdvalue.org/docs
52
55. UXの期間
利用前、予期的UX
Now
鈴木さんの Youtubeの
ネット／外信／広告・宣伝／口コミ／雑誌など
推奨 動画
Powerbook Intel Mac Mac iPhone iPad
購入／使用 購入／使用 買替え 購入／使用 購入／使用
中古 製品の
Apple Store Apple Online Apple
販売店 パッケージ Shibuya/Ginza Store Genius bar
55
56. UXの期間
利用中／一時的UX
Now
鈴木さんの Youtubeの
ネット／外信／広告・宣伝／口コミ／雑誌など
推奨 動画
Powerbook Intel Mac Mac iPhone iPad
購入／使用 購入／使用 買替え 購入／使用 購入／使用
中古 製品の
Apple Store Apple Online Apple
販売店 パッケージ Shibuya/Ginza Store Genius bar
56
57. UXの期間
利用後／エピソード的UX
Now
鈴木さんの Youtubeの
ネット／外信／広告・宣伝／口コミ／雑誌など
推奨 動画
Powerbook Intel Mac Mac iPhone iPad
購入／使用 購入／使用 買替え 購入／使用 購入／使用
中古 製品の
Apple Store Apple Online Apple
販売店 パッケージ Shibuya/Ginza Store Genius bar
57
58. UXの期間
利用期間全体／累積的UX
Now
鈴木さんの Youtubeの
ネット／外信／広告・宣伝／口コミ／雑誌など
推奨 動画
Powerbook Intel Mac Mac iPhone iPad
購入／使用 購入／使用 買替え 購入／使用 購入／使用
中古 製品の
Apple Store Apple Online Apple
販売店 パッケージ Shibuya/Ginza Store Genius bar
58
65. 企業が制御できるUI
直接的UI
ストア パッケージ HW & SW ジーニアスバー
（購入時のUI） (製品受領時のUI) （ 使用中のUI） (トラブル時のUI)
+ + +
企業がデザインできるUIは企業活動の各シーンで異なる
個々のシーンでいいUIを提供することがいいUXに繋がる
65
66. 企業を取り巻く環境が提供するUI
間接的UI
雑誌など 他のユーザー セレブとMac 競争製品
（情報） （口コミ） （イメージ） （比較）
+ スズキ
+ +
企業はマーケティングやPRを通してUXの向上を目指す
66
69. あなたの考慮すべきUI
あなたがマーケティングやPRの担当なら、
※GUIではない
Youtubeの
鈴木さんの推奨 ネット／外信／広告・宣伝／口コミ／雑誌など
動画
アップルのアプ 3rd partyのアプリ
OS X App Storeの利用
リケーション ケーション
バッテリー
HWデザイン メモリ増設 重さ 速度
持ち時価
Powerbook Intel Mac Mac Mac iPhone iPad iPad
購入／使用 購入 買替え 故障 購入 購入 故障
アップルオンラ
中古 製品の受領と開 アップルストア訪 アップルジーニア
インストアでの買
販売店 封 問 スバー訪問
い物
69
70. あなたの考慮すべきUI
あなたがソフトウェアエンジニアなら、
※GUIではない
鈴木さんの推 Youtubeの
ネット／外信／広告・宣伝／口コミ／雑誌など
奨 動画
アップルのアプ 3rd partyのアプリ
OS X App Storeの利用
リケーション ケーション
バッテリー
HWデザイン メモリ増設 重さ 速度
持ち時価
Powerbook Intel Mac Mac Mac iPhone iPad iPad
購入／使用 購入 買替え 故障 購入 購入 故障
アップルオンラ
中古 製品の受領と開 アップルストア訪 アップルジーニア
インストアでの買
販売店 封 問 スバー訪問
い物
70
71. あなたの考慮すべきUI
あなたがハードウェアエンジニアなら、
※GUIではない
鈴木さんの推 Youtubeの
ネット／外信／広告・宣伝／口コミ／雑誌など
奨 動画
アップルのアプ 3rd partyのアプリ
OS X App Storeの利用
リケーション ケーション
バッテリー
HWデザイン メモリ増設 重さ 速度
持ち時価
Powerbook Intel Mac Mac Mac iPhone iPad iPad
購入／使用 購入 買替え 故障 購入 購入 故障
アップルオンラ
中古 製品の受領と開 アップルストア訪 アップルジーニア
インストアでの買
販売店 封 問 スバー訪問
い物
71
72. あなたの考慮すべきUI
あなたが販売担当者なら、
※GUIではない
鈴木さんの推 Youtubeの
ネット／外信／広告・宣伝／口コミ／雑誌など
奨 動画
アップルのアプ 3rd partyのアプリ
OS X App Storeの利用
リケーション ケーション
バッテリー
HWデザイン メモリ増設 重さ 速度
持ち時価
Powerbook Intel Mac Mac Mac iPhone iPad iPad
購入／使用 購入 買替え 故障 購入 購入 故障
アップルオンラ
中古 製品の受領と開 アップルストア訪 アップルジーニア
インストアでの買
販売店 封 問 スバー訪問
い物
72
73. あなたの考慮すべきUI
あなたがCS担当者なら、
※GUIではない
鈴木さんの推 Youtubeの
ネット／外信／広告・宣伝／口コミ／雑誌など
奨 動画
アップルのアプ 3rd partyのアプリ
OS X App Storeの利用
リケーション ケーション
バッテリー
HWデザイン メモリ増設 重さ 速度
持ち時価
Powerbook Intel Mac Mac Mac iPhone iPad iPad
購入／使用 購入 買替え 故障 購入 購入 故障
アップルオンラ
中古 製品の受領と開 アップルストア訪 アップルジーニア
インストアでの買
販売店 封 問 スバー訪問
い物
73
74. あなたの考慮すべきUI
あなたが経営者なら、
※GUIではない
鈴木さんの推 Youtubeの
ネット／外信／広告・宣伝／口コミ／雑誌など
奨 動画
アップルのアプ 3rd partyのアプリ
OS X App Storeの利用
リケーション ケーション
バッテリー
HWデザイン メモリ増設 重さ 速度
持ち時価
Powerbook Intel Mac Mac Mac iPhone iPad iPad
購入／使用 購入 買替え 故障 購入 購入 故障
アップルオンラ
中古 製品の受領と開 アップルストア訪 アップルジーニア
インストアでの買
販売店 封 問 スバー訪問
い物
74
75. あなたの考慮すべきUI
あなたが経営者なら、
※GUIではない
鈴木さんの推 Youtubeの
ネット／外信／広告・宣伝／口コミ／雑誌など
奨 動画
アップルのアプ 3rd partyのアプリ
OS X App Storeの利用
リケーション ケーション
バッテリー
HWデザイン メモリ増設 重さ 速度
これをデザイン経営とか言うらしい
持ち時価
Powerbook Intel Mac Mac Mac iPhone
（他の定義もあるけど） iPad iPad
購入／使用 購入 買替え 故障 購入 購入 故障
アップルオンラ
中古 製品の受領と開 アップルストア訪 アップルジーニア
インストアでの買
販売店 封 問 スバー訪問
い物
75
76. あなたの考慮すべきUI
今日はITエンジニア向けセミナーなので、
※GUIではない
鈴木さんの推 Youtubeの
ネット／外信／広告・宣伝／口コミ／雑誌など
奨 動画
アップルのアプ 3rd partyのアプリ
OS X App Storeの利用
リケーション ケーション
バッテリー
HWデザイン メモリ増設 重さ 速度
持ち時価
Powerbook Intel Mac 今日のUIはソフト
Mac Mac iPhone iPad iPad
購入／使用 購入 買替え 故障 購入 購入 故障
ウェアに限定する
アップルオンラ
中古 製品の受領と開 アップルストア訪 アップルジーニア
インストアでの買
販売店 封 問 スバー訪問
い物
76
77. ここまでのまとめ
用語 勝手な理解 評価基準
相手に対する 効率、シンプル、
デザイン
心遣い きれい等
UX 使用者の経験 満足度
UI 使用者との接点 UXへの貢献度
77
78. UXとUIの関係
UIはUXのために存在する
UI = 手段、UX = 結果
いいUXを提供するためにはいいUIが必須
78
79. UXとUIの関係
目指す 実現手段と 結果としての
UX してのUI UX
UXはUIデザインの理由であり、結果でもある
「なぜこのようなUIデザインをしたの？」
と言う問いに対する答えがUX
79
80. UI/UXデザインに必要なスキル
目指す 実現手段と 結果としての
UX してのUI UX
‣ 人に対する理解（認知心理学）
‣ 共感力（なりすまし力）
‣ 分析力
‣ コミュニケーションスキル（インタビュー、
ファシリテーション、プレゼンテーション）
80
81. UI/UXデザインに必要なスキル
目指す 実現手段と 結果としての
UX してのUI UX
UIの種類によって異なる
‣ 販売：店の立地、インテリア、BGM、店員の服装と態度、製品の陳列等
‣ ソフトウェア：機能性、安全性、安定性、ヴィジュアルの美的要素等
81
86. 自分に必要なデザインは？
多様なデザインの区分から自分に必要なものを選ぶ
ことから始める
User In Web Design CI Desig
terface n
De
Designsign
face
I nter
U ser Interaction Design
Font Design
Information Architecture User eXperience Design
Graph
ic Des
ign
Informat ion Design Communication Design
Unive rsal Design
86
92. 各デザインの説明
インタフェース
デザイン
‣ ユーザーに分かり易く、使い易
いインタフェースを考えること
‣ メニュー、ボタン、画像の配置
とサイズ等UIの構成を考える
92
93. 各デザインの説明
ナビゲーション
デザイン
‣ ユーザーが必要な情報にアクセ
スし易いメニューの構成／配置
を考える
‣ 必要な処理と情報を如何に簡単
に見つけ出し、利用できるかを
考慮
93
94. 各デザインの説明
ヴィジュアル
デザイン
‣ GUIの美的表現で雰囲気を演出
‣ 色、サイズ、形等の変化で各要
素の意味とモードの変化等を表
現
‣ ユーザーの使用性の向上を考慮
する
94
95. システムアーキテクチャとのマッピング
コンテキスト 企業
UX Design
Standards / Guidelines
Visual Design
Biz Domain
Interface Design
CI Design
IT Policy
Navigation Design Presentation Layer
Information Design
Biz Logic Layer
Interaction Design
Data Layer
Information Architecture
95
101. 近接 UI要素間の論理的な
グルーピング
101
102. 近接 スペースの重要性を
見せましょう！
‣ 関連が強いものを近くに配置する
‣ 要素間の距離を持って各要素間の関係の強さを
表現する
‣ 情報を視覚的に構造化、組織化することに
よってユーザーの理解を助ける
‣ 空間（スペース）は近接の大事な要素
102
103. スペースを排除す
近接 るとこうなる！！
‣関連が強いものを近くに配置する
‣要素間の距離を持って各要素間の
関係の強さを表現する
‣情報を視覚的に構造化、組織化す
ることに
よってユーザーの理解を助ける
‣空間（スペース）は整列の大事な
要素 103
104. 近接 情報量は増えるが 適切なスペースで
窮屈な感じになる 余裕と高級感を出す
104
112. コントラスト
コントラストの強い コントラストの弱い
デザイン デザイン
112
116. フォント
日本語のふぉんと 日本語のふぉんと
日本語のふぉんと 日本語のふぉんと
日本語のふぉんと 日本語のふぉんと
116
117. フォント：
Hiragino Maru Gothic ProN
ITエンジニアに易しい
実践的UI/UXデザイン
NCデザイン＆コンサルティング株式会社
金 成哲 (Roy S. Kim)
@Roy_S_Kim
117
118. フォント：
Hiragino Gaku Gothic StdN
ITエンジニアに易しい
実践的UI/UXデザイン
NCデザイン＆コンサルティング株式会社
金 成哲 (Roy S. Kim)
@Roy_S_Kim
118
128. やってはいけないこと
映画Monsters vs Aliensから
※映画の宣伝にもなるので画像の利用にはご理解を！
128
132. やってはいけないこと
実は、この人がUIデザイナー：
「このボタンの何が問題なんだ？」
132
141. いいUXとは
いいUXが持つべ
き特徴
http://semanticstudios.com/publications/semantics/000029.php
141
142. いいUXは機能以上の価値を提供する
満足度の向上
（UXデザインで目指
価値がある
すところ）
楽しい・共有したい
思いのまま使える
機能の提供 使いやすい
（エンジニアの慣れ
信頼できる
ている世界）
機能する
http://www.artificialindustry.com/inspiratie/81/human+centered+design
142
143. いいUXは機能以上の価値を提供する
UXデザインの
方法論が必要 価値がある
楽しい・共有したい
思いのまま使える
使いやすい
既存の方法論
でもカーバーできる 信頼できる
機能する
http://www.artificialindustry.com/inspiratie/81/human+centered+design
143
147. プロセスの反復による改善が望ましい
目指す 実現手段 結果としての
目指す 実現手段
としてのUI 結果としての
UX 目指す 実現手段
としてのUI UX
結果としての
UX UX
UX としてのUI UX
ユーザビリティ
UXデザイン UIデザイン ユーザビリティ
テスト
UXデザイン UIデザイン ユーザビリティ
UXデザイン テスト
UIデザイン
要件定義 設計 実装 機能テスト テスト
要件定義 設計 実装 機能テスト
要件定義 設計 実装 機能テスト
リリース
リリース
リリース
147
148. UXデザインのタスク
目指す 実現手段 結果としての
UX としてのUI UX
ユーザビリティ
UXデザイン UIデザイン テスト
要件定義 設計 実装 機能テスト
リリース
148
149. UXデザインのタスク
UXデザイン
ユーザー調査 ペルソナ定義 機能一覧作成 UIスケッチ
ストーリーボード データ
コンテキスト調査 画面フロー作成
作成 モデリング
メンタルモデル作成 UIプロトタイプ作成
時間軸
149
150. UXデザインのタスク
UXデザイン
ユーザー調査 ペルソナ定義 機能一覧作成 UIスケッチ
ストーリーボード データ
コンテキスト調査 画面フロー作成
作成 モデリング
メンタルモデル作成 UIプロトタイプ作成
ユーザーのゴールと
ユーザと環境の調査 機能とデータの定義 UI作成
対象範囲確定
150
152. UXデザイン
ユーザー調査
ユーザーは誰か？
‣ 目的 : 製品やサービスのユーザーを正しく定義し、
理解する
‣ 多くの場合、ITプロセスの要件定義タス
‣ 手法 クの一環として行うのが現実的
‣ マーケット調査、サーベイ ‣ ユーザー企業のIT部門の担当の話だけを
聞いてはだめ。必ず直接使用者に会う事
‣ ユーザーインタビュー、ユーザーの行動観察
‣ 既存システム分析（あれば）‣ ユーザーインタビューの参考：「ユーザー
に弟子入り」
‣ 成果物：ペルソナ ＋ 補足資料 http://opencu.tv/media/ux-research-20121010
152
154. UXデザイン
コンテキスト調査
ユーザーはどのような環境／状況にあるか？
‣ 目的 : 製品やサービスを囲む環境を理解する
‣ ITプロセスのプロジェクト立ち上げ及び
‣ 手法 スコープ確定と連携
‣ マーケット調査、サーベイ、ユーザーインタビュー
‣ プロジェクトの全てのステークホルダー
と会ってプロジェクトに対する意図を確
‣ 製品／サービスが使われる現場訪問、ユーザーとの同行、作業の体験
認。ビジネスのゴールを確認
‣ 画像／動画の入手
‣ 製品／サービスが実際に使用される環境
‣ 既存システム分析及び競合製品の分析（あれば）
を確認することが大事
‣ 成果物：ストーリーボード、メンタルモデル
‣ 関連するシステム、業務、ニーズを確認
154
156. UXデザイン
ペルソナ定義
ユーザー像をできるだけ具体的に
‣ ペルソナはユーザーの思考／行動を想像するた
めのツール
‣ 凝りすぎる必要はない。製品／サービスと関係
ある属性だけでもいい
‣ 固定の属性を持たず、必要に応じて属性を定
義する
‣ 俳優の写真やウェブで拾った写真よりは手書き
の絵が有効
‣ 目的から考えれば当たり前
‣ 実ユーザーの写真が使えたらベスト
‣ 複数のペルソナがある場合は優先順位をつける
‣ 主役ペルソナ、脇役ペルソナ
156
157. UXデザイン
ストーリーボード作成
ユーザーは何をやっているか？
‣ 目的 : ユーザーの行動を具体的に定義し、
理解する
‣ 手法
‣ 製品／サービスと関わるユーザーを行動を具体的に描写する
‣ その行動の前提条件、目的、結果の評価基準を具体的に記述する
‣ 必要に応じて写真、動画、既存システムの資料を追加する
‣ 複数のペルソナがある場合はどのペルソナのストーリーかを明確に
157
158. UXデザイン
ストーリーボード作成
ユーザーは何をやっているか？やりたいか？
‣ ユースケース作成タスクと並行、あるいは
ユースケース作成の代わりに実施
‣ ユーザーを囲む環境を描写する（時間、騒
音、明るさ、室内／外等）
‣ システムではなく、ユーザーの視点で作成
する
‣ 既存のストーリーボードと理想的なストー
リーボードを書いて比較する
‣ 目標とするストーリーボードを作成する際
には技術的制約などは考慮しない
‣ システムは魔法使いだと想定する
158
160. UXデザイン
メンタルモデル作成
ユーザーは何をやりたいか？何を考えているか？
ショップに行く事にする ‣ ユーザーの行動に対して「なぜ？」を確認す
る
新しい商品 待ち合わせ ‣ 多くの場合、ユーザーは自分の行動の動機
を買うため
友達と会うこ
を理解していない
既存の商品を
使い切った
とにした ‣ 5Whyの手法を使い、真の動機を確認する
暇つぶし
年を取った
ショップが見
つけやすい
‣ ビジネスの目的からくる動機も確認する
仕事の間で空
き時間ができ 給料をもらっ 座っていられ ‣ ユーザーが使っている既存の道具、システム
た た るから について他の代案を考える
近くのショッ 購入時期のリ 地域のショッ
‣ 既存の状況を前提にしない
プ検索 マインド プ検索 ‣ コンテキストを変えられるかを検討する
誕生日お祝い
通知
‣ ストーリーボードからは「改善」ができるが
メンタルモデルからは「改革（イノベーショ
ン）」ができる（可能性がある）
160
161. UXデザイン
メンタルモデル作成
ユーザーは何をやりたいか？何を考えているか？
ショップに行く事にする ‣ ユーザーの行動に対して「なぜ？」を確認す
る
新しい商品 待ち合わせ ‣ 多くの場合、ユーザーは自分の行動の動機
を買うため
友達と会うこ
を理解していない
既存の商品を
使い切った
とにした ‣ 5Whyの手法を使い、真の動機を確認する
暇つぶし
年を取った
ショップが見
つけやすい
‣ ビジネスの目的からくる動機も確認する
仕事の間で空
き時間ができ 給料をもらっ 座っていられ ‣ ユーザーが使っている既存の道具、システム
た た るから について他の代案を考える
近くのショッ 購入時期のリ 地域のショッ
‣ 既存の状況を前提にしない
プ検索 マインド プ検索 ‣ コンテキストを変えられるかを検討する
誕生日お祝い
弊社独自の手法：
通知
‣ ストーリーボードからは「改善」ができるが
一般的なメンタルモデル メンタルモデルからは「改革（イノベーショ
ン）」ができる（可能性がある）
の使い方とは若干異なる
161
168. UXデザイン
UIプロトタイプ作成
動きをつけて検証して見よう！
‣ 目的 : 作成した画面スケッチと画面フローでス
トーリーを実現できるかを確認する
‣ 手法
‣ ユーザー或は被験者が実際に触りながら画面操作と画面の処理フローを
確認できるようにする
‣ 最初はペーパープロトタイプも可能であるが、ある程度アイデアが
固まったら動きが表現できるツールを利用する
‣ ユーザビリティテストを行い、改善作業を行う
‣ 費用をあまりかけずにできる方法を探す
168
169. UXデザイン
UIプロトタイプ作成
動きをつけて検証して見よう！
‣ ペーパープロトタイプでも
ある程度のテストは可能
‣ ただし、動きをテストする
には効果が落ちる
‣ 想像力が貧弱な人には
テストが難しい
‣ 最近はプロトタイプ作成用
ソフトが無料か小額で利用
可能なのでそれらを利用す
ることを推奨
169
172. ユーザビリティテスト
目指す 実現手段 結果としての
UX としてのUI UX
ユーザビリティ
UXデザイン UIデザイン テスト
要件定義 設計 実装 機能テスト
リリース
172
173. ユーザビリティテスト
どこまでやる？
‣ 目的 : 作成したプログラムが目的した価値をユ
ーザーに提供しているか確認、改善点を探す
‣ 手法
‣ ユーザーテストおよび専門家によるヒューリスティックテスト
‣ 定量的に評価可能なKPIの定義と測定
‣ 初期テスト及びある程度期間を置いてのテストを行う
‣ できるだけ実環境と類似した状況でテストを行う
173
174. ユーザビリティテスト
どこまでやる？
‣ 専門的な期間にユーザーテストを依頼するとそれなりのコストが
発生する
‣ 目的 : 作成したプログラムが目的した価値をユ
‣ 期間：１ヶ月∼
‣ 費用：１００万円∼
ーザーに提供しているか確認、改善点を探す
‣ 近くのユーザーを見つけ、テストする
‣ 実際使用する部署の人
‣ 手法 ‣ 友達、紹介、隣の部署の人
‣ 「５人テスト」を行う
‣ ユーザーテストおよび専門家によるヒューリスティックテスト
‣ ５人までテストすると全ての問題のほとんどが検出できる
‣ ただし、現実的には３人でも十分価値がある
‣ 定量的に評価可能なKPIの定義と測定
‣ ヒューリスティックテストを行う
‣ 「５人テスト」から得られる情報の８０％は得られる
‣ 初期テスト及びある程度期間を置いてのテストを行う
‣ データの収集はできるだけ早期から行う
‣ 比較できるデータがないと判断ができない
‣ できるだけ実環境と類似な状況でテストを行う
174
175. そして、これらの反復
目指す 実現手段 結果としての
目指す 実現手段
としてのUI 結果としての
UX 目指す 実現手段
としてのUI UX
結果としての
UX UX
UX としてのUI UX
ユーザビリティ
UXデザイン UIデザイン ユーザビリティ
テスト
UXデザイン UIデザイン ユーザビリティ
UXデザイン テスト
UIデザイン
要件定義 設計 実装 機能テスト テスト
要件定義 設計 実装 機能テスト
要件定義 設計 実装 機能テスト
リリース
リリース
リリース
175
179. みんなを幸せにはできない
VS
‣ 人によってニーズは異なる Windows8 for
Smartphone, Tablet, and
Desktop!!??
‣ 対象を広げると質が落ちる
‣ 製品やサービスのペルソナを定義し、
そのペルソナの満足だけに集中する
179
192. 資料の在処：
‣ 弊社サイトに後日アップロードします
‣ http://nextconceptdc.com/「itエンジニアに易しい実践的uiuxデザイン勉強会」/
‣ 公開したら@ncdc_jpからつぶやきます
次のセミナー日程：2013年１月
「エンタプライズアプリの今と未来」
企業におけるスマートフォン／タブレットアプリの導入と活用
192
