0から始めるUXデザイン（UXデザインを知る）
•
24 likes•3,070 views
第５７回HTML5とか勉強会で、発表するかもしれなかった資料です。 UXデザインについて考えるときのポイントと、（ちょっと強引ですが）HTML5によってUXデザインが変わること、について紹介しています
Recommended
More Related Content
What's hot
What's hot (20)
Viewers also liked
Viewers also liked (20)
Similar to 0から始めるUXデザイン（UXデザインを知る）
Similar to 0から始めるUXデザイン（UXデザインを知る） (20)
0から始めるUXデザイン（UXデザインを知る）
- 2. 自己紹介 金 智之（Jiji Kim） NTTコミュニケーションズ株式会社 技術開発部 UX Design Studio Lead UX Designer (Technical Leader) HCD-Net 認定 人間中心設計専門家 産業技術大学院大学 「人間中心デザイン」履修 Tabla Player 2
- 4. ０からのUXデザイン 4
- 5. 所属組織 5
- 7. UX Design Studio U X デ ザ イ ン を 社 内 で 実 践 し 、 浸 透 さ せ る 事 を 目 的 と し て 活 動 ● 目 指 し て い る 状 態 （ ビ ジ ョ ン ） 全社員が UXデザインの 重要性を 認識している UXデザインが サービス開発に 織り込まれ、 UXデザイナーが 活躍している ちゃんと儲かる サービスが 生まれ続け、 成長し続ける
- 8. 活動領域 8 UX Design Lean Startup Customer Development LeanUX Agile Development Interaction Design Business Model Generation Strategy Design Growth Hacking Design Thinking サ ー ビ ス を よ り 良 く す る た め に 効 果 が あ る 方 法 論 は 、 U X デ ザ イ ン に 限 定 せ ず 、 貪 欲 に 学 び 、 習 得 し 、 取 り 込 む 。
- 9. 活動内容 実践 ユ ー ザ 調 査 ・ 新 規 事 業 開 発 PJ サ ー ビ ス コ ン セ プ ト 検 討 ユ ー ザ ビ リ テ ィ 改 善 等 々
- 10. 活動内容 鍛錬 注 目 書 籍 の 輪 読 会 開 催 勉 強 会 ・ セ ミ ナ ー 等 へ の 参 加
- 11. 活動内容 浸透 社 内 勉 強 会 ・ W S 開 催 U X デ ザ イ ナ ー 人 材 の 規 定 開 発 プ ロ セ ス の 体 系 化
- 12. UX ? 12
- 13. 13 User experience definitions [27 definitions on this page ] http://www.allaboutux.org/ux-definitions UX って定義が色々
- 14. 14 Nielsen & Norman define UX “The first requirement for an exemplary user experience is to meet the exact needs of the customer, without fuss or bother. Next comes simplicity and elegance that produce products that are a joy to own, a joy to use. True user experience goes far beyond giving customers what they say they want, or providing checklist features. “ The Definition of User Experience http://www.nngroup.com/articles/definition-user-experience/ 人間の感情や行動を考えることっぽい
- 15. 15 ISO での UX の定義 From ISO 9241-210 “製品、システムまたはサービスを使用した時、 および／または使用を予測した時に生じる個人の 知覚や反応” UX は、使っている時とか、使う前とか、時間も関係しそう
- 16. 16 By Nodds on Flickr (https://flic.kr/p/4m48Dq) ややこしい…
- 17. 17 Action > Understanding > Memorize
- 18. 18 Experience Holistic Time Span UXをデザインするためのキーワード
- 20. 20 VS ガビガビ ヌルヌル
- 21. Experience 21 出会い: Boy meets girl 感覚: 触れた際の物理的な感覚 知覚 / 認知 : 信号が脳へと伝達＆処理 認識 : これまでの記憶と共に理解 感情 / 記憶 : 経験を思い起こし、新たに記憶 瞬時に行われる Experience Process
- 22. Experience 22 Experience process & Focus point 出会い 感覚 知覚 / 認知 認識 感情 / 記憶 第一印象 伝わり易さ 触感・質感 斬新さ・目新しさ ブランディング 使い易さ 人とサービスの接点（タッチポイント）は、経験に大きく影響する。 ユーザがどのように経験するのか、理解するとUX をデザインしやすくなる
- 24. Experience 24 experienceのプロセスを 理解することで 、 ユーザを 深 く 理 解 す る 事ができる ↓ 認知科学、 行動経済学、 Hocked Model、 とかが参考になる
- 25. 25 Experience Holistic Time Span UXをデザインするためのキーワード
- 27. 27 http://www.slideshare.net/kleinerperkins/design-in-tech-report-2015 利 用 環 境 が 大 き く 変 わ っ て き て い る
- 29. 29 多 く の 要 素 が 、 ユ ー ザ の 経 験 に 影 響 す る 。 こ れ ら 全 体 を 包 括 的 に 捉 え て 、 ユ ー ザ の 経 験 を 中 心 に 統 一 的 に サ ー ビ ス を 作 り 上 げ る 事 が 重 要 ↓ 一 つ ダ メ に な る と 、 総 崩 れ も … サ ー ビ ス や 組 織 の 規 模 が 大 き く な る と 難 易 度 が 上 が っ て い く
- 30. 30
- 31. 31
- 32. 32 Experience Holistic Time Span UXをデザインするためのキーワード
- 33. Time Span 33 hcd value UX白書日本語訳 http://site.hcdvalue.org/docs 時 間 の 範 囲 を 考 え る 事 も 大 切 。 ユ ー ザ の 経 験 と 期 待 を 作 り 上 げ る 。 口コミ ・広告 UI 口コミ ・思い出 ブランド
- 34. 34 Experience Holistic Time Span UXをデザインするためのキーワード
- 35. 35 一番、大事な要素…
- 36. 36 仮説 検証 想 定 通 り 、 ユ ー ザ は 行 動 し て く れ る だ ろ う か ？ 価 値 を 感 じ て く れ る だ ろ う か ？ 使 い 続 け て く れ る だ ろ う か ？ 確 か め る
- 42. 42 Experience Holistic Time Span UXをデザインするためのキーワード 仮説 検証
- 44. HTML5 と UXデザイン 44 リ ッ チ な タ ッ チ ポ イ ン ト を 、 素 早 く 作 っ て 、 素 早 く 検 証 ！ → 早 く 作 れ れ ば 、 早 く 検 証 で き る ！ → サ ー ビ ス の 失 敗 確 率 を 下 げ る 事 が で き る
- 45. HTML5 と UXデザイン 45 ユ ー ザ の 行 動 に 寄 り 添 っ た 、 細 や か な 対 応 が 可 能 → 入 力 フ ォ ー ム の 内 容 に 合 わ せ た バ リ デ ー シ ョ ン チ ェ ッ ク → ミ ス 連 発 で の ユ ー ザ の 離 脱 を 防 ぐ Comcomcom_taroutarou@ ※ メ ー ル ア ド レ ス は ２ ０ 文 字 ま で で す <input type="email" name="email” ng-model=“email” ng-maxlength="20"> <span ng-show="userForm.email.$error.maxlength"> ※メールアドレスは２０文字までです</span>
- 46. HTML5 と UXデザイン 46 新 た な ユ ー ザ 体 験 の 創 出 → よ り 効 率 的 に ユ ー ザ が 行 動 で き る → よ り 気 持 ち 良 く 、 ユ ー ザ が 操 作 で き る Clear : todo appVisual IVR 支払い 申込み
- 47. 47 Experience Holistic Time Span UXをデザインするためのキーワード 仮説 検証 まとめ
- 48. まとめ • 早く作って、早く検証 • ユーザの行動に寄り添った、細やかな 対応が可能 • 新たなユーザ体験の創出 48
Editor's Notes
- 有名どころの定義。 不快さを感じない。 所有する喜び、 使う喜び 色々な定義で共通するのは、「人間の感情に関わる何か」 Something that related human positive emotion.
- ISOの定義を共有しておく “製品、システムまたはサービスを使用した時、および／または使用を予測した時に生じる個人の知覚や反応” 使っている時と、使う前とか、時間も関係しそう 人の反応？
- Understanding > Memorize 理解の方が重要だし、 行動する方法につながる方がいい 本も読むだけじゃなくて、使う！そして理解して覚える！
- シンプルにキーワードだけを伝えたいと思う キーワードは、「Experience」「Holistic」「Time line」 ３つだけ知っておけば、なんとなく UX 理解できちゃう
- 「Experiencing」 UXの定義で割と共通する言葉 モノやコトに触れる喜び・楽しさ これらは、どこから、どんなタイミングで発生するんでしょうか？ それを知ると、理解しやすい
- ガビガビとヌルヌル
- 「Experiencing」 システムとコンテキスト、ユーザの関係を考える事（ユーザビリティの絵） システムとユーザが出会うタッチポイントを作り上げる ユーザに生じる変化を理解しないといけない （出会い→知覚・認知→これまでの経験・バイアス→認識→感情→記憶） どのポイントを抑えると何が分かるか？ 第一印象・使いやすさ/伝わり易さ/触感・新鮮さ/斬新さ・製品の狙い・ブランディング/プロダクトライフサイクル Experience (User/Context/Product）の本質をちゃんと知らないと、ユーザに価値を提供できない、と言える 認知科学が有効 感覚：手が火の温もりを感じる 知覚：感覚で感じた刺激が脳に伝わる 認知：刺激情報を脳が情報として処理する。「暖かい」 認識：こういうものだ、と認知の結果をこれまでの知識と 結びつけて理解する。「たきびは暖かい」 行動：もっと手を近づける
- システムとユーザが出会うタッチポイントを作り上げる ユーザに生じる変化を理解しないといけない どのポイントを抑えると何が分かるか？ 第一印象・使いやすさ/伝わり易さ/触感・質感/斬新さ・製品の狙い・ブランディング/プロダクトライフサイクル Experience (User/Context/Product）の本質をちゃんと知らないと、ユーザに価値を提供できない、と言える 認知科学が有効 ユーザのexperienceのプロセスを理解することで、ユーザを深く理解する事ができる 使い易さ ＝ メンタルモデル
- Shop manual was leadked 70度は見づらいので、手を使って修正する 触れさせる → 興味を持つ
- ユーザのexperienceのプロセスを理解することで、ユーザを深く理解する事ができる 認知科学が有効
- シンプルにキーワードだけを伝えたいと思う キーワードは、「Experience」「Holistic」「Time line」 ３つだけ知っておけば、なんとなく UX 理解できちゃう
- 「Holistic」 UXが生まれる状況を考えてみる システム・ユーザ、 関係するものは何があるでしょう？ 提供する会社・場所・ネットワークの有無・電源・他者・時間・自然環境 パートナー企業・コンテンツ・ファシリティ これらをHolisticに捉えて、ユーザの経験を中心にサービスを作り上げていくのが、UXデザイン UI Design? Interaction Design? Web Design? Visual Design? Graphic Design? Service Design? Experience Design? こう捉えると、UI < UX となる UI/UXって言い方はナンセンス まぁ、大きな問題ではないんだけども
- 「Holistic」 UXが生まれる状況を考えてみる システム・ユーザ、 関係するものは何があるでしょう？ 提供する会社・場所・ネットワークの有無・電源・他者・時間・自然環境 パートナー企業・コンテンツ・ファシリティ これらをHolisticに捉えて、ユーザの経験を中心にサービスを作り上げていくのが、UXデザイン UI Design? Interaction Design? Web Design? Visual Design? Graphic Design? Service Design? Experience Design? こう捉えると、UI < UX となる UI/UXって言い方はナンセンス まぁ、大きな問題ではないんだけども
- シンプルにキーワードだけを伝えたいと思う キーワードは、「Experience」「Holistic」「Time line」 ３つだけ知っておけば、なんとなく UX 理解できちゃう
- 「Time line」 ユーザ・コンテキスト・システムの関係が時間と共にどう変化するのか？ 時系列で考える ４つの枠の絵 経験と期待のデザイン Branding とかも関わってくるね 予期的UX : 広告・口コミ 一時的UX : UI エピソード的UX : 思い出・口コミ・オペレーション 累積的UX : ブランド
- Summary 3つのキーワードが大切だね、っと。 定義も再掲 これらが、UXってもんです。Clear?
- Summary 3つのキーワードが大切だね、っと。 定義も再掲 これらが、UXってもんです。Clear?
- Summary 3つのキーワードが大切だね、っと。 定義も再掲 これらが、UXってもんです。Clear?