O slideshow foi denunciado.
Seu SlideShare está sendo baixado. ×

0から始めるUXデザイン(UXデザインを知る)

Anúncio
Anúncio
Anúncio
Anúncio
Anúncio
Anúncio
Anúncio
Anúncio
Anúncio
Anúncio
Anúncio
Anúncio

Confira estes a seguir

1 de 49 Anúncio

0から始めるUXデザイン(UXデザインを知る)

第57回HTML5とか勉強会で、発表するかもしれなかった資料です。
UXデザインについて考えるときのポイントと、(ちょっと強引ですが)HTML5によってUXデザインが変わること、について紹介しています

第57回HTML5とか勉強会で、発表するかもしれなかった資料です。
UXデザインについて考えるときのポイントと、(ちょっと強引ですが)HTML5によってUXデザインが変わること、について紹介しています

Anúncio
Anúncio

Mais Conteúdo rRelacionado

Diapositivos para si (20)

Quem viu também gostou (20)

Anúncio

Semelhante a 0から始めるUXデザイン(UXデザインを知る) (20)

Mais recentes (20)

Anúncio

0から始めるUXデザイン(UXデザインを知る)

  1. 1. 0から始めるUXデザイン (UXデザインを知る) UX Design Studio Jiji Kim
  2. 2. 自己紹介 金 智之(Jiji Kim) NTTコミュニケーションズ株式会社 技術開発部 UX Design Studio Lead UX Designer (Technical Leader) HCD-Net 認定 人間中心設計専門家 産業技術大学院大学 「人間中心デザイン」履修 Tabla Player 2
  3. 3. やってきたこと コールセンターオペレーション ・営業推進とか Engineer 音楽配信・映像配信 研究 データマイニング レコメンドエンジン開発 c / Perl UXデザイン 4年ほど 3
  4. 4. 0からのUXデザイン 4
  5. 5. 所属組織 5
  6. 6. 技術開発部 • 事業を持たないオーバーヘッド部門 • サービスレイヤ間横断の技術開発 6
  7. 7. UX Design Studio U X デ ザ イ ン を 社 内 で 実 践 し 、 浸 透 さ せ る 事 を 目 的 と し て 活 動 ● 目 指 し て い る 状 態 ( ビ ジ ョ ン ) 全社員が UXデザインの 重要性を 認識している UXデザインが サービス開発に 織り込まれ、 UXデザイナーが 活躍している ちゃんと儲かる サービスが 生まれ続け、 成長し続ける
  8. 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. 9. 活動内容 実践 ユ ー ザ 調 査 ・ 新 規 事 業 開 発 PJ サ ー ビ ス コ ン セ プ ト 検 討 ユ ー ザ ビ リ テ ィ 改 善 等 々
  10. 10. 活動内容 鍛錬 注 目 書 籍 の 輪 読 会 開 催 勉 強 会 ・ セ ミ ナ ー 等 へ の 参 加
  11. 11. 活動内容 浸透 社 内 勉 強 会 ・ W S 開 催 U X デ ザ イ ナ ー 人 材 の 規 定 開 発 プ ロ セ ス の 体 系 化
  12. 12. UX ? 12
  13. 13. 13 User experience definitions [27 definitions on this page ] http://www.allaboutux.org/ux-definitions UX って定義が色々
  14. 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. 15 ISO での UX の定義 From ISO 9241-210 “製品、システムまたはサービスを使用した時、 および/または使用を予測した時に生じる個人の 知覚や反応” UX は、使っている時とか、使う前とか、時間も関係しそう
  16. 16. 16 By Nodds on Flickr (https://flic.kr/p/4m48Dq) ややこしい…
  17. 17. 17 Action > Understanding > Memorize
  18. 18. 18 Experience Holistic Time Span UXをデザインするためのキーワード
  19. 19. Experience 19 なにが、どんなタイミングで発生しているのか? モノやコトに触れる喜び・楽しさ
  20. 20. 20 VS ガビガビ ヌルヌル
  21. 21. Experience 21 出会い: Boy meets girl 感覚: 触れた際の物理的な感覚 知覚 / 認知 : 信号が脳へと伝達&処理 認識 : これまでの記憶と共に理解 感情 / 記憶 : 経験を思い起こし、新たに記憶 瞬時に行われる Experience Process
  22. 22. Experience 22 Experience process & Focus point 出会い 感覚 知覚 / 認知 認識 感情 / 記憶 第一印象 伝わり易さ 触感・質感 斬新さ・目新しさ ブランディング 使い易さ 人とサービスの接点(タッチポイント)は、経験に大きく影響する。 ユーザがどのように経験するのか、理解するとUX をデザインしやすくなる
  23. 23. 23 触れる事で親しみを感じ、興味が高まる
  24. 24. Experience 24 experienceのプロセスを 理解することで 、 ユーザを 深 く 理 解 す る 事ができる ↓ 認知科学、 行動経済学、 Hocked Model、 とかが参考になる
  25. 25. 25 Experience Holistic Time Span UXをデザインするためのキーワード
  26. 26. Holistic 26 何が、ユーザの経験や感情に影響するのか?
  27. 27. 27 http://www.slideshare.net/kleinerperkins/design-in-tech-report-2015 利 用 環 境 が 大 き く 変 わ っ て き て い る
  28. 28. Holistic 28 User UI以外にも様々
  29. 29. 29 多 く の 要 素 が 、 ユ ー ザ の 経 験 に 影 響 す る 。 こ れ ら 全 体 を 包 括 的 に 捉 え て 、 ユ ー ザ の 経 験 を 中 心 に 統 一 的 に サ ー ビ ス を 作 り 上 げ る 事 が 重 要 ↓ 一 つ ダ メ に な る と 、 総 崩 れ も … サ ー ビ ス や 組 織 の 規 模 が 大 き く な る と 難 易 度 が 上 が っ て い く
  30. 30. 30
  31. 31. 31
  32. 32. 32 Experience Holistic Time Span UXをデザインするためのキーワード
  33. 33. Time Span 33 hcd value UX白書日本語訳 http://site.hcdvalue.org/docs 時 間 の 範 囲 を 考 え る 事 も 大 切 。 ユ ー ザ の 経 験 と 期 待 を 作 り 上 げ る 。 口コミ ・広告 UI 口コミ ・思い出 ブランド
  34. 34. 34 Experience Holistic Time Span UXをデザインするためのキーワード
  35. 35. 35 一番、大事な要素…
  36. 36. 36 仮説 検証 想 定 通 り 、 ユ ー ザ は 行 動 し て く れ る だ ろ う か ? 価 値 を 感 じ て く れ る だ ろ う か ? 使 い 続 け て く れ る だ ろ う か ? 確 か め る
  37. 37. 37 ・注意すべき事は、画面に書いてあるから、 ユーザは読んで、考えるはず!
  38. 38. 38 ・注意すべき事は、画面に書いてあるから、 ユーザは読んで、考えるはず! 読まない… 気づかない…
  39. 39. 39 最初は、ソーシャルチェックインアプリだった
  40. 40. 40 最初は、ソーシャルチェックインアプリだった 複雑で特徴もなく、何も 新しさをもたらしていなかった ※そこそこウケてた位…
  41. 41. 仮説検証 • 自分と向き合おう! 41
  42. 42. 42 Experience Holistic Time Span UXをデザインするためのキーワード 仮説 検証
  43. 43. 43 HTML5 とか、の登場で何が変わるのか?
  44. 44. HTML5 と UXデザイン 44 リ ッ チ な タ ッ チ ポ イ ン ト を 、 素 早 く 作 っ て 、 素 早 く 検 証 ! → 早 く 作 れ れ ば 、 早 く 検 証 で き る ! → サ ー ビ ス の 失 敗 確 率 を 下 げ る 事 が で き る
  45. 45. HTML5 と UXデザイン 45 ユ ー ザ の 行 動 に 寄 り 添 っ た 、 細 や か な 対 応 が 可 能 → 入 力 フ ォ ー ム の 内 容 に 合 わ せ た バ リ デ ー シ ョ ン チ ェ ッ ク → ミ ス 連 発 で の ユ ー ザ の 離 脱 を 防 ぐ Comcomcom_taroutarou@ ※ メ ー ル ア ド レ ス は 2 0 文 字 ま で で す <input type="email" name="email” ng-model=“email” ng-maxlength="20"> <span ng-show="userForm.email.$error.maxlength"> ※メールアドレスは20文字までです</span>
  46. 46. HTML5 と UXデザイン 46 新 た な ユ ー ザ 体 験 の 創 出 → よ り 効 率 的 に ユ ー ザ が 行 動 で き る → よ り 気 持 ち 良 く 、 ユ ー ザ が 操 作 で き る Clear : todo appVisual IVR 支払い 申込み
  47. 47. 47 Experience Holistic Time Span UXをデザインするためのキーワード 仮説 検証 まとめ
  48. 48. まとめ • 早く作って、早く検証 • ユーザの行動に寄り添った、細やかな 対応が可能 • 新たなユーザ体験の創出 48
  49. 49. A : 0から、UXデザインを知る 49 ご静聴いただき、 ありがとうございました!

Notas do Editor

  • 有名どころの定義。
    不快さを感じない。
    所有する喜び、
    使う喜び

    色々な定義で共通するのは、「人間の感情に関わる何か」
    Something that related human positive emotion.

  • ISOの定義を共有しておく

    “製品、システムまたはサービスを使用した時、および/または使用を予測した時に生じる個人の知覚や反応”

    使っている時と、使う前とか、時間も関係しそう

    人の反応?
  •   Understanding > Memorize
      理解の方が重要だし、
      行動する方法につながる方がいい

      本も読むだけじゃなくて、使う!そして理解して覚える!
  • シンプルにキーワードだけを伝えたいと思う
      キーワードは、「Experience」「Holistic」「Time line」

    3つだけ知っておけば、なんとなく UX 理解できちゃう
  •   「Experiencing」
      UXの定義で割と共通する言葉
       モノやコトに触れる喜び・楽しさ


    これらは、どこから、どんなタイミングで発生するんでしょうか?
    それを知ると、理解しやすい 
  • ガビガビとヌルヌル
  •   「Experiencing」

      システムとコンテキスト、ユーザの関係を考える事(ユーザビリティの絵)
      システムとユーザが出会うタッチポイントを作り上げる

      ユーザに生じる変化を理解しないといけない
       (出会い→知覚・認知→これまでの経験・バイアス→認識→感情→記憶)

       どのポイントを抑えると何が分かるか?
        第一印象・使いやすさ/伝わり易さ/触感・新鮮さ/斬新さ・製品の狙い・ブランディング/プロダクトライフサイクル
      Experience (User/Context/Product)の本質をちゃんと知らないと、ユーザに価値を提供できない、と言える
       認知科学が有効

    感覚:手が火の温もりを感じる
    知覚:感覚で感じた刺激が脳に伝わる
    認知:刺激情報を脳が情報として処理する。「暖かい」
    認識:こういうものだ、と認知の結果をこれまでの知識と
       結びつけて理解する。「たきびは暖かい」
    行動:もっと手を近づける

  •   システムとユーザが出会うタッチポイントを作り上げる
      ユーザに生じる変化を理解しないといけない

       どのポイントを抑えると何が分かるか?
        第一印象・使いやすさ/伝わり易さ/触感・質感/斬新さ・製品の狙い・ブランディング/プロダクトライフサイクル

      Experience (User/Context/Product)の本質をちゃんと知らないと、ユーザに価値を提供できない、と言える
       認知科学が有効

    ユーザのexperienceのプロセスを理解することで、ユーザを深く理解する事ができる

    使い易さ = メンタルモデル
  • Shop manual was leadked
    70度は見づらいので、手を使って修正する
     触れさせる → 興味を持つ

  • ユーザのexperienceのプロセスを理解することで、ユーザを深く理解する事ができる

    認知科学が有効
  • シンプルにキーワードだけを伝えたいと思う
      キーワードは、「Experience」「Holistic」「Time line」

    3つだけ知っておけば、なんとなく 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」

    3つだけ知っておけば、なんとなく UX 理解できちゃう
  •   「Time line」
      ユーザ・コンテキスト・システムの関係が時間と共にどう変化するのか?
      時系列で考える
      4つの枠の絵
       経験と期待のデザイン
       Branding とかも関わってくるね
      
    予期的UX : 広告・口コミ
    一時的UX : UI
    エピソード的UX : 思い出・口コミ・オペレーション
    累積的UX : ブランド
  •   Summary
      3つのキーワードが大切だね、っと。
      定義も再掲
      これらが、UXってもんです。Clear?
  •   Summary
      3つのキーワードが大切だね、っと。
      定義も再掲
      これらが、UXってもんです。Clear?
  •   Summary
      3つのキーワードが大切だね、っと。
      定義も再掲
      これらが、UXってもんです。Clear?

×