20130722 gumiStudy#15 UXとUXのためのデザインのはなし

UXとUXのためのデザインのはなし
プロダクト＆サービスグループ
佐々木将之

2ndFACTORYCO.,Ltd. 2
本日お話しすること
UXのはなし
UXDのはなし
HCDのはなし
弊社事例のご紹介
質疑応答など

自己紹介

自己紹介
2007年より、通信システム系受託
システム企業に入社。自社製品開
発部署にて、ホームネットワーク
系メディアプレイヤー関連のミド
ルウェア開発業務に従事。2012年
11月に株式会社セカンドファクト
リー入社。
エンジニアとしてExTOUCH、
ExTOUCH Biz、QOOpaなどのプ
ロダクト・サービス開発に従事。
佐々木将之
エクスペリエンスアーキテクト

株式会社セカンドファクトリー

セカンドファクトリーを
知ってる人、挙手お願いいたします
先生、怒らないから

セカンドファクトリーの提供できること
UX＆CLOUD Professional Services
Comfortable experience for everyone everywhere
Device CLOUD
Consulting(Engagement)
Solution & Services
Design ＆ Development

バランスのよい開発

セカンドファクトリーのチームモデル

セカンドファクトリーのチームモデル
エクスペリエンス
ストラテジスト
マネージャー
アーキテクト

自己紹介
2007年より、通信システム系受託
システム企業に入社。自社製品開
発部署にて、ホームネットワーク
系メディアプレイヤー関連のミド
ルウェア開発業務に従事。2012年
11月に株式会社セカンドファクト
リー入社。
エンジニアとしてExTOUCH、
ExTOUCH Biz、QOOpaなどの自
社プロダクト・サービス開発に従
事。
佐々木将之
エクスペリエンスアーキテクト

裏の自己紹介
「開発の楽しさを発見しよう。広
げよう。」「開発の現場を前進さ
せよう」をコンセプトとした
【DevLOVE】の裏方に2010年10
月よりジョイン。2010年度産業技
術大学院大学履修証明プログラム
人間中心デザイン履修証明取得。
2011年3月より「現場で使える人
間中心デザインの実践」をコンセ
プトとした【hcdvalue】の立ち上
げより参加。
ちゃちゃき
勉強会イベント・ワークショップの企画・運営
DevLOVE & hcdvalue
chachaki

社外勉強会コミュニティ
hcdvalue
DevLOVE
開発の楽しさを発見しよう。広げよう。
開発の現場を前進させよう。
現場で使える人間中心設計(HCD)の実践

HDIfesのご紹介
hcdvalueDevLOVE
IGDAJapan

注意！
これから話すことは
「エンジニア」視点から見たUXやデザインのお話です。
「デザイナー」視点とは異なる面があります。

私のモチベーション
エンジニアリング
(創り出す方法、生み出す方法、プラスの方向)
と
デザイン
(見分ける方法、見極める方法、マイナスの方向)
を
繋げていきたい

陰陽みたいなイメージです

UXのはなし
UXDのはなし
HCDのはなし
質疑応答など

UXのはなし

ISO9241-210における定義
 製品やシステム、サービスの利用、および/もしくは予
想された使い方によってもたらされる人々の知覚と反応
1. 使用前、使用中、使用後に起こる、ユーザの感情、新年、嗜好、近く、生理学的・心理学
的な反応、態度、達成感のすべてを含む。
2. ブランドイメージ、見た目、機能、システムのパフォーマンス、インタラクティブシステ
ムのインタラクティブな振る舞いと支援機能、事前の経験から生じたユーザの内的および
身体的状態、態度、スキルとパーソナリティ、利用状況の結果である。
3. ユーザの個人的目標という観点から考えた時には、通常はユーザーエクスペリエンスに付
随する知覚的・感情的な側面をユーザービリティは含むことができる。ユーザービリティ
の基準を用いてユーザーエクスペリエンスの諸側面を評価することができる。

ヒトとモノ・サービスの関係
コンテキスト(利用状況)
ヒト画面
(デバイス)
システム
Web
サービス

ヒト画面
(デバイス)
システム
Web
サービス
人工物
UX

ヒト画面
(デバイス)
システム
Web
サービスUX
フロントエンドバックエンド

ヒト画面
(デバイス)
システム
Web
サービスUX
インタラクション
Ix インタフェース
UI

ヒト画面
(デバイス)
システム
Web
サービスUX
利用状況が異なれば
同じUIでもUXは
異なります

ここまでのまとめ
 UXはヒトの内面の話です
– UXとUIは関連はするが別物です
– 字面が似ているだけです
 UX「のための」デザインです(Design for UX)
– UX「を」デザインするのではないです(Design UX)
– 私達開発者がデザインする対象は「人工物」です
 利用状況の把握が大事です
– 全く同じUIでも、利用状況が異なれば全く違うものになります

ここまで
大丈夫です？抽象的すぎます？

UX白書について
 UX白書とは？
UXの薄い本
ドイツのDagstuhlで専門家(研究
者・実務家)30名が「UXの概念」に
ついて共通認識を形成すべく、
2010年9月に実施したセミナーにて
議論された内容をまとめた宣言文。
2011年2月英語版web公開。
2011年12月日本語版web公開。
http://www.allaboutux.org/uxwhitepaper
http://site.hcdvalue.org/docs

UX白書における定義(期間的概念)
予期的
UX
利用前
一時的
UX
利用中
エピソード
的UX
利用後
累積的
UX
利用時間
全体
体験を
想像する
体験するある体験を
内省する
回想する
iPhoneに触れる前、
CMなど
iPhoneを
使ってる間
iPhoneを思い返す iPhoneが
無くてはならない
ものになる

UXのはなしのまとめ
 UXは製品・サービスに「触れている間」だけではない
– 製品・サービスに触れる前
– 製品・サービスに触れた後、思い返す時
– それによって「意味」が形成される

UXのはなし
UXDのはなし
HCDのはなし
質疑応答など

UXDのはなし

UXDの話
では、製品・サービスに対する反応は、
全部「UX」なのではないか？
⇒はい。私はそう思います。
⇒大事なのは「UX」ではなく「UXD(Design for UX)」
の視点だと思っています。

UXDの話
 デザイン
– 意匠(装飾)
– 設計(こちらの意味で使っています！)
 UXのために「設計」する
 UXのために「計画」する
⇒UXを「再生産可能」なものにする

産業革命以降の話
使い手作り手
1:1
産業革命
以前
使い手
作り手
N:1
産業革命
以後
「一点もの」
使い手にfixしたものづくり
大量生産・大量消費
コスト競争
高機能化

あるUXを共通の認識に
あるUX
開発者デザイナ運用担当
ユーザー
サポートマーケタ

ん？？
急に話変えました？

UXDのレイヤー構造
ユーザーを共通認識とした
組織のデザイン
ユーザーのシナリオのデザイン
ユーザーのことを考えた
UI・グラフィックのデザイン

UXのための
人工物のデザイン

UXのための
UXを提供するための
仕組みのデザイン

UXのための
UXを提供する仕組み
の仕組みのデザイン

「仕組み」をつくる

あるUXを軸に組織をつくる
あるUX
開発者デザイナ運用担当
ユーザー
サポートマーケタ

 開発者にとって、大事なのはUXそのものよりUXD
 再生産可能な体験を提供するための話をしましょう
 どのレイヤの話をしたいのか
– UXを考えたUIのデザイン
– ユーザーシナリオのデザイン
– ユーザーシナリオを考えられる組織のデザイン

UXのはなし
UXDのはなし
HCDのはなし
質疑応答など

HCDのはなし

どう作る？
 UXDが大事なのはなんとなく分かった。
 じゃあ、どうやってつくるの？

ここのレイヤの話をします

こうやったらいいのでは？
ユーザーやその周辺のことを
分析する
ユーザーのための製品・サービ
スを企画する・作ってみる
ユーザーが体験できているか
評価する
ユーザーやその周辺のことを
調べる

こうやったらいいのでは？
分析する
作ってみる
評価する
調べてみる
よしやろう！
いい製品だ！

ISO9241-210のHCDプロセス
ユーザーの
要求事項の
明示
ユーザーの
要求を満たす
解決策の作成
要求事項に
対する
設計の評価
利用状況の
把握と明示
人間中心設計
プロセスの計画
システムが
ユーザーの要求
事項を満たす

調査・分析の対象
ユーザーの
要求事項の
明示
ユーザーの
要求を満たす
解決策の作成
要求事項に
対する
設計の評価
利用状況の
把握と明示
人間中心設計
システムが
事項を満たす

ヒト画面
(デバイス)
システム
Web
サービスUX

ヒト画面
(デバイス)
システム
Web
サービスUX
• インタビュー
• アンケート
• 参与観察
• ペルソナ・シナ
リオ法や構造化
シナリオ法
• KJ法やカード
ソート
• KA法

解決策作成の対象
ユーザーの
要求事項の
明示
ユーザーの
要求を満たす
解決策の作成
要求事項に
対する
設計の評価
利用状況の
把握と明示
人間中心設計
システムが
事項を満たす

ヒト画面
(デバイス)
システム
Web
サービスUX

ヒト画面
(デバイス)
システム
Web
サービスUX
• ペーパープロト
タイピング
• モックアップ
• アクティングア
ウト

評価の対象
ユーザーの
要求事項の
明示
ユーザーの
要求を満たす
解決策の作成
要求事項に
対する
設計の評価
利用状況の
把握と明示
人間中心設計
システムが
事項を満たす

評価の対象
ヒト画面
(デバイス)
システム
Web
サービスUX

評価の対象
ヒト画面
(デバイス)
システム
Web
サービスUX • ユーザーテスト
• インタビュー

 UXD(シナリオのデザイン)の一例としてのHCDプロセ
スをご紹介しました
 調査→分析→試行→評価のプロセスは単なるPDCAです
し、手法・技法もおおよそ揃ってきました。約10年の積
み上げがありますので、使わない手はないかなぁと思い
ます。

UXのはなし
UXDのはなし
HCDのはなし
質疑応答など

QOOPa
 クラウドアプリケーション
– 常に最新アプリケーションを提供
– 必要期間にご利用可能（SaaS）
 スマートフォンを利用
– 高価なハンディ不要
 BYOD・ソーシャル
– SNSを活用して広告可能

QOOPa
ハンディ端末お客様の
スマートフォン
オーダーシステム
クラウドアプリケーション
Wifi や 3G で利用可能
常に最新のアプリケーションをご提供！
お客様のスマホでも！
キッチン端末

タスクボードの導入

これはUXD？
 UIデザインと開発の協業
 スマートフォンを中心としたシナリオデザイン
 そこに至るためのチームのタスク・意識の共有

UXのための
UXを提供する仕組み
の仕組みのデザイン

デザインとエンジニアリング
Development
Engineering Design

プロセス
開発プロセス
プロセス
デザイン
プロセス
1
2
7
8
3
4
5
6
調査
分析
解決策
評価
要件定義
設計
実装
テスト

Incremental と Iterative
Design?
Engineering?

UXのはなし
UXDのはなし
HCDのはなし
質疑応答など

私のモチベーション
(創り出す方法、生み出す方法、プラスの方向)
と
デザイン
(見分ける方法、見極める方法、マイナスの方向)
を
繋げていきたい

まとめ(1/4)
 UXはヒトの内面の話です
– UXとUIは関連はするが別物です
– 字面が似ているだけです
 UX「のための」デザインです(Design for UX)
– UX「を」デザインするのではないです(Design UX)
– 私達開発者がデザインする対象は「人工物」です
 利用状況の把握が大事です
– 全く同じUIでも、利用状況が異なれば全く違うものになります

まとめ(2/4)
 UXは製品・サービスに「触れている間」だけではない
– 製品・サービスに触れる前
– 製品・サービスに触れた後、思い返す時
– それによって「意味」が形成される

まとめ(3/4)
 開発者にとって、大事なのはUXそのものよりUXD
 再生産可能な体験を提供するための話をしましょう
 どのレイヤの話をしたいのか
– UXを考えたUIのデザイン
– ユーザーシナリオのデザイン
– ユーザーシナリオを考えられる組織のデザイン

まとめ(4/4)
 UXD(シナリオのデザイン)の一例としてのHCDプロセ
スをご紹介しました
 調査→分析→試行→評価のプロセスは単なるPDCAです
し、手法・技法もおおよそ揃ってきました。約10年の積
み上げがありますので、使わない手はないかなぁと思い
ます。

We are designing future experience.

20130722 gumiStudy#15 UXとUXのためのデザインのはなし

Recomendados

Recomendados

Más contenido relacionado

Similar a 20130722 gumiStudy#15 UXとUXのためのデザインのはなし

Similar a 20130722 gumiStudy#15 UXとUXのためのデザインのはなし (20)

Más de chachaki chachaki

Más de chachaki chachaki (20)

20130722 gumiStudy#15 UXとUXのためのデザインのはなし