今日からできるUXデザイン

 今日からできるUXデザイン

2019/05/08に株式会社gumi様でプログラマ向けに行ったデザイン講義のスライドです。

難しく考えがちなUXデザインですが、今できることからやってこうぜって話です

クリエイティブ・コモンズ・ライセンス
この 作品 は クリエイティブ・コモンズ 表示 - 改変禁止 4.0 国際 ライセンスの下に提供されています。

第一回「これだけ守れば見やすくなるデザインの基礎」はこちら
https://speakerdeck.com/kinakobooster/koredakeshou-rebajian-yasukunarudezainfalseji-chu

第二回「UIデザインをはじめよう」はこちら
https://speakerdeck.com/kinakobooster/uidezainwohazimeyou

※訪問講座のご案内※
あなたの会社に話しに行きます。料金表はこちら
https://xemono.life/#/workwith/consulting

ご質問はTwitter@kinakoboosterまでお気軽にどうぞ。
https://twitter.com/kinakobooster

株式会社Xemonoの詳細はこちら
https://xemono.life

実践編・アイコンを実際に作る過程はこちら
https://note.mu/xemono/n/nd7b696b78702

とりいめぐみはこんなことを考えている人です
http://noubrain.hateblo.jp/entry/2019/04/05/171255

A8d382bd1bb2bc7abbb4999f32e16f4c?s=128

megumi tree

May 08, 2019
Tweet

Transcript

  1. ࠓ೔͔ΒͰ͖ Δ69 גࣜձࣾ9FNPOP QFSGPSNFECZͱ Γ͍Ί͙Έ!LJOBLPCPPTUFS  9FNPOPσβΠ ϯߨ࠲ ʢʣ

  2. ͩΕ ʁ ͱ Γ͍Ί͙Έ גࣜձࣾ9FNPOP୅ද ೥ੜɻ ϓϩάϥ ϛ ϯά͕ Ͱ͖

    ΔσβΠφʔɻ ୹ՎΛͭ ͘ Δਓɻ ࿩͠૬ख͕ཉ͠ ͘ ͯCPUΛࣗ ࡞ͨ͜͠ ͱ͕͋Δɻ ౦ژେֶཧՊҰྨೖֶɺ จ ֶ෦फڭֶफڭֶ࢙ଔۀɻ
  3. ࠓճͷ࿩    σβΠ ϯͷجૅ 6*σβΠ ϯΛ͸͡ΊΑ ͏ 69ͷߟ͑ํ

  4. ͓͠ͳ͕͖         69ͬͯԿ

    ʁ ࠓ೔͔ΒͰ͖ Δ69 จষ ίʔσΟ ϯά ྲྀΕͷσβΠ ϯ ਓؒʹ͍ͭͯ ओޠͷͰ͔͍࿩ · ͱΊ
  5. ର৅ 6*σβΠ ϯʹ ೖ໳Ͱ͖ͨਓ

  6. ໨త 69֓೦Ͱ ࢹ໺Λ޿͘ ͢Δ

  7. ୈೋճͷ͋Β͢ ͡

  8. 6*σβΠ ϯ͸ ࢼߦࡨޡ ୈೋճͷ͋Β͢ ͡

  9. օ஌ͬͯΔ ύʔπΛ ૊Έ߹ΘͤΑ ͏ ୈೋճͷ͋Β͢ ͡

  10.  69ͬͯԿ ʁ

  11. 6TFS&YQFSJFODF ʢϢʔβʔମݧʣ 69

  12. 6TFS ࢖͏ਓ &YQFSJFODF ମݧ

  13. 6*69ͷ୲౰ྖҬ 6* ͳʹ͔͍ͨ͠ˠ ࢖͏ ˠຬ଍ͯ͠ؼΔ 69

  14. Կ͔ؾ͖ͮ ·ͤΜ͔

  15. कඋൣғͰ͔͗͢ͳ͍ ʁ

  16. 69͸ ΫισΧओޠ

  17. ͳͥ कඋൣғ͕ Ͱ͔͍ͷ͔

  18. ࢹ໺޿Ίʹ 6*ͷ͜ ͱ Λ ߟ͑ΔͨΊ

  19. 6*69ͷ୲౰ྖҬ ʢ࠶ܝʣ 6* ͳʹ͔͍ͨ͠ˠ ࢖͏ ˠຬ଍ͯ͠ؼΔ 69

  20. ੡඼Λ࢖͏ಈػ ·Ͱߟ͍͑ͨ

  21. ը໘ͷ֎΋ ߟ͑Δͷ͕ 69

  22. 69ຊʹ͸Կ͕ॻ͍ͯ͋Δͷ͔

  23. Ϣʔβʔ ௐࠪͷ ΍Γํ

  24. ϓϩ τλΠ ϐϯά ϖϧιφ ΧελϚʔδ ϟ ʔχʔ ϢʔβʔΠ ϯλ Ϗϡ

    ʔ
  25. Ϣʔβʔ͕ ԿΛߟ͑ͯΔ͔ Θ͔Γ͍ͨ

  26. ओޠ͕Ͱ͔͍͔Β Ϣʔβʔͷ࿩͔͠ Ͱ͖ ͳ͍

  27. ࣮ࡍͲ ͏࡞Ε͹͍͍ͷ ʁ

  28. 69Λߟ͑ΔͨΊͷҰͭͷ໰͍

  29. ͦΕςΫ ϊϩδʔͷ ౎߹ʹ ߹Θͤͯͳ͍ ʁ

  30. ςΫ ϊϩδʔͷ౎߹ʹ߹Θͤͨిྗܭ IUUQTFOXJLJQFEJBPSHXJLJ&MFDUSJDJUZ@NFUFS

  31. ਓؒͷ౎߹ʹ߹ΘͤΔɺ ͱ͸

  32. ൑அྗΛ ແବଧͪ ͤ͞ͳ͍

  33. ࣌ؒΛׂ͔͚ͨʹ ׬੒඼͕ແ೉ ˣ ͔ͳ Γਖ਼ղ

  34. ΍Γ͕ͪ

  35. ͍Β ͳ͍ը໘ ࡞ͬ ͪ Ό ͏ ΍Γ͕ͪ

  36. #FTUJOUFSGBDF JT /PJOUFSGBDF ࢀߟ ɿ ʰ͞ Αͳ Βɺ Π ϯλʔϑ

    Σ ʔεʱ
  37. ྫ ंͷ伴Λ ։͚Δ

  38. ෺ཧ伴ํࣜ ंʹۙͮ͘ ˠ伴Λग़͢ˠ։͚Δ εςο ϓ

  39. ंʹۙͮ͘ ˠ伴Λग़͢ˠ։͚Δ ෺ཧ伴ํࣜ εςο ϓ ंʹۙͮ͘ ˠεϚϗग़͢ˠ ϗʔϜը໘͔ΒΞϓϦ Λ୳ͯ͠։͘ ˠ

    ղৣϘλϯΛԡͯ͠։͚Δ ψϧ͍ं؅ཧΞϓϦ εςο ϓ
  40. 69σβΠφʔ͕͍Δ ͱʜ ʁ

  41. Α Γ Α͍伴 ిࢠϩο ΫΛ࣋ͬͯंʹۙͮ͘ ˠ υΞϊ ϒͷϘλϯΛԡͯ͠ղৣ εςο ϓ

  42. 69͸ ը໘ʹͱ ΒΘΕͳ͍ ΫισΧࢹ໺

  43. Ϣʔβʔ͕ تͿ΋ͷΛ ͭ͘ Ζ ͏ ʢ΄ͱΜͲͷਓ͸ཉ๬Λ֮ࣗͯ͠ͳ͍͚ͲͶʣ

  44. "#ςε τͷ݁Ռ ঃʑʹϘλϯ͕ Ͱ͔͘ ͳΔ ΍Γ͕ͪ

  45. ਓ͸ҙࢤʹ൓ͯ͠ Ϙλϯԡͤ͞ΒΕͨ͜ ͱ ͙ Β͍ ͪ ΌΜͱΘ͔Δ

  46. Ϣʔβʔ͸۪͔Ͱ͸ͳ͍

  47. ͤΊͯؾ࣋ͪΑ ͘ ϘλϯΛԡͯ͠΋ Β͓͏

  48. ࢹ໺޿Ίʹ 6*Λߟ͑Δ ࠓ೔͔ΒͰ͖ Δ ͜ ͱ

  49. Τϥʔ ϝ οηʔδ ͕Μ͹Δ ͨͱ ͑͹

  50. Ұը໘Ͱ໌ࣔ͢Δ ɾ ͍·Ͱ͖ Δ ͜ ͱ ɾ Ͳ ͜ʹߦ͘ ͷ͔

    ɾ ͍· Ͳͷลͳͷ͔ ɹ ʢՌ͕ͯ͋Δͷ͔ͳ͍ͷ͔ʣ ͨͱ ͑͹
  51.  ࠓ೔͔ΒͰ͖ Δ69

  52. ਓؒͷ౎߹ʹ߹ΘͤΔ ൑அྗΛແବݣ͍ͤ͞ͳ͍ ઈରʹϢʔβʔςε τ͢Δ    69ࡾՕ৚

  53. 69 ࢹ໺͕Ͱౕ͔͍͕ ڧ͍

  54. ͋Δ ͱྑ͍஌ࣝ จষ͕ॻ͚Δ ϓϩάϥϜΛॻ͚Δ σβΠ ϯ͕Ͱ͖ Δ ਓؒ৺ཧʹৄ͍͠ اը͕Ͱ͖ Δˡ͜Ε͸·ͨผͷػձʹ

       
  55. 69Ͱߟ͑Δ ͜ ͱ ੡඼ͷ΄΅શ෦

  56. · ͱΊͯ࿩͢ͱ ΫισΧओޠ τʔΫʹ ͳ ͬ ͪ Ό ͏

  57. 69΍Δʹ͸ ݖྗ͕͍Δ

  58. Ͱ͖ Δ ͱ ͔͜Β ΍ͬͯ ͘ ͔͠ͳ͍

  59.  จষ

  60. શମͷྲྀΕΛ ߟ͑ͯ จষΛ࡞Δ

  61. None
  62. $MJDLͰࠓ͙͢ങ͏

  63. ͜Θ͍ ͚Ͳ͍͢͝ηϯε

  64. িಈങ͍Λ༠ൃ͍ͨͬ͠Ά͍

  65. ɾ ϫϯΫ Ϧ ο ΫͰ͙͢ങ͑ΔΞϐʔϧ ɾ ࢄʑΞϚκϯͰങͬͯΔ͔Β άμάμݴ Θͳ ͘

    ͯ΋͍͍Ͱ͠ ΐײ ɾ ഑৴ઌΛҰॹʹғ͏ ͜ ͱ Ͱɺ ଈ%-͞ΕΔ ͜ ͱ Λදͯ͠Δ $MJDLͰࠓ͙͢ങ͏
  66. Ϙλϯ୯ମͰ೰Ήͱ ೔࿨ͬͨจষ͔͠Ͱ͖ ͳ͍ ొ࿥ͨ͠Ϋ ϨΧͰߪೖ͢Δ ߪೖͯ͠μ΢ϯϩʔ υΛ࢝ΊΔ ߪೖ͢Δ

  67. ʮিಈങ͍ͤͯ͑͞ʙʯ ͕͋Δ͔Β ʮ$MJDLͰࠓ͙͢ങ͏ʯ ͕੒ཱ͢Δ

  68. Ͳ ͏ ͯ͠΄͍͔͠Ͱ ʮਖ਼ղʯ ΋ มΘΔ

  69.  ίʔ υ

  70. ։ൃͷ69 Λ Α ͘ ͍ͨ͠

  71. ࣗಈԽͰ͖ Δ ͱ ͜͸ ࣗಈԽ

  72. XFCQBDLXBUDI ίϯύΠϧࣗಈԽͷྫ

  73. ίʔ υελΠϧ΋GPSNBUUFS࢖͏

  74. ελΠ Ϧ ϯάࣗಈԽͷྫ FTMJOUpY

  75. ࠶ར༻Ͱ͖ Δ ͱ ͜͸ ࠶ར༻

  76. ίϯϙʔωϯ τ ͷ ෼͚ํ

  77. ڍಈ͕༧ଌͰ͖ Δ ύʔπΛ ૊Έ߹ΘͤΔ

  78. ౷Ұײͷ͋Δ σβΠ ϯΛ ࡞Γ͍ͨ

  79. جຊ BUPNJDEFTJHO ͰΑ͍

  80. Ϩΰϒϩο ΫΛ σβΠ ϯ ͯ͠ ૊Έ߹ΘͤΔ BUPNJDEFTJHOͷߟ͑ํ

  81. ͜ΕҎ্෼͚ΒΕͳ͍ ࠷খύʔπ͔Β ߟ͑Δ BUPNJDEFTJHOͷߟ͑ํ

  82. ͨͩ஫ҙ఺͸ ͋Δ

  83. BUPNJDEFTJHO IUUQBUPNJDEFTJHOCSBEGSPTUDPNDIBQUFS

  84. ݪࢠ

  85. ෼ࢠ

  86. ߏ଄ମ

  87. ςϯϓϨʔ τ ςϯϓϨʔ τ

  88. ͏ · ͘ ߦ͖ ͦ ͏ײ ͋Δ

  89. ໰୊఺ ͦΜͳ៉ྷʹ෼͚ΒΕͳ͍ ͙͢૊Έ߹Θͤരൃ͢Δ ৭΍ܗͷهड़Λ੾Γ෼͚ͯόϦΤʔγ ϣ ϯ࡞ΕΔΑ ͏ʹ͓ͯ͜͠ ͏ Ұ౓͔͠࢖Θͳౕ͍ͱ͔ग़ͯ ͘

    Δ ΋ ͏ ͜Ε͸࢓ํͳ͍ ˠͱ Γ͋͑ͣ෼ׂෆՄೳͳ΋ͷΛݪࢠʹ͓ͯ͜͠ ͏
  90. ໰୊఺ Α ͘ Ͱ͖ͨύʔπ͕͋ͬͯ΋ ܭը͕ͳ͍ͱ ݁ہΧΦε

  91. Ϩΰόέπ౉͞Εͯ΋ ͍ΖΜͳ΋ͷ࡞Εͪ Ό ͏

  92. ܭըΛཱͯΑ ͏ BUPNJDEFTJHO ੒ཱͷͨΊʹ

  93. ܭըΛཱͯΑ ͏ ϨΠΞ΢ τ࡞੒ ϧʔϧ੍ఆ ɾ ఆ਺Խ ϧʔϧΛ ΋ ͱʹ૿΍͢

      
  94. ϧʔϧ੍ఆ ɾ ఆ਺Խ ଍ͯͬͨ͠ ઌͷΧΦεΛ ճආ͢ΔͨΊʹ

  95. ༨നͱαΠζͷ બ୒ࢶΛ ݮΒ͢ DTT

  96. DTTͷྫ FMFNFOU\ DPMPSCH''  TQBDFCSPBEQY  TQBDFCBTJDQY  TQBDFOBSSPXQY ^

  97. ཁૉ͕૿͑ͯ ࠔΒ ͳ͍͔ ߟ͑Δ ڞ௨ԽͷΩϞ

  98. ؾʹ͢Δ ͱ ͜ Ζ ͕ଟ͘ ͳΔ ˣ ѱ͍ڞ௨Խ

  99. ૿΍͠΍͍͢ ˣ ྑ͍ڞ௨Խ

  100. ʰϦ ʔ μϒϧίʔ υʱ ͸͍͍ຊ

  101.  ྲྀΕͷσβΠ ϯ

  102. ࢹ໺޿͘ σβΠ ϯΛ͢Δ ख๏

  103. ΧελϚʔδ ϟ ʔχʔ

  104. Ϣʔβʔ͕ ͲΜͳཉ๬Ͱ Ͳ ͏੡඼Λ৮Γ Ͳ ͏ຬͨ͞ΕΔ͔    

    ΧελϚʔδ ϟ ʔχʔ ʜʜΛ૝ఆͯ͠σβΠ ϯ͢Δ
  105. ྫ *OTUBHSBN

  106. ຊ୨͕΄͠ ͘ ͯ Π ϯελΛݟΔਓ

  107. Π ϯελ։͘

  108. ݕࡧԡ͢

  109. ຊ୨ͬͯೖΕͯ ຊ୨ԡ͢

  110. Θʔ͍ Ίͬ ͪ Όຊ୨ݟΕΔ

  111. շదεςο ϓ

  112. ࣍΋Π ϯελͰ ୳ͦ ͏͔ͳ ͬͯͳΔ ˢ Π ϯελͷΊ͋ͯ

  113. Ϣʔβʔ͕ ΄͍͠΋ͷΛಘΔ ·Ͱͷܦ࿏Λߟ͑Δ

  114. ͜ΕΛԿຊ͔ߟ͑ շద͞ Λ σβΠ ϯ ͍ͯ͘͠

  115. ͜ͷख๏ͷܽ఺

  116. ͏ · ͘ ͍͔ͳ͍ ܦ࿏Λ ૝ఆͮ͠Β͍ ͜ͷख๏ͷܽ఺

  117. ࢖͏ਓʹ ৮ͬͯ΋ Β͓͏

  118.  ਓؒʹ͍ͭͯ

  119. લ൒ͷ෮श Ϣʔβʔ͸۪͔Ͱ͸ͳ͍

  120. ։ൃऀΑ Γ͸ෆ׳Ε

  121. ࣮؀ڥ͸ ։ൃ؀ڥΑ Γ Α ͬΆͲաࠅ

  122. ਓؒ͸ ։ൃऀͷ૝ఆΛ ௒͑ͯ ͘ Δ

  123. Ϣʔβʔςε τ ͠Α ͏

  124. ΍Γํ Ϣʔβʔςε τ

  125. ͳΜͱ͔ͯ͠ ϢʔβʔΛ ั·͑Δ Ϣʔβʔςε τ

  126. ͜ΕͰ ʙͯ͠ ͘ ͩ ͍ͬͯ͞ ݴͬͯ౉͢ Ϣʔβʔςε τ

  127. Ϣʔβʔςε τ ࿥ը΋͋Γ ༷ࢠΛ ޙΖ͔Β Α ͘ ݟΔ

  128. ॏཁ ࠔΓ࢝Ίͯ΋ ॿ͚ͳ͍ Ͳ ͜Ͱ٧· ͔ͬͨΑ ͘ ݟ͓ͯ͜ ͏

  129. ͳΜΒ͔ͷܗͰ ऴΘΔ

  130. ೋճ໨Λ΍Δ ॏཁ

  131. ಉ͡ ͜ ͱ Λ ͯ͠΋ Β͍ͳ͕Β Ͳ ͜Ͱࠔ͔ͬͨฉ͘

  132. ͓ྱΛݴ͏

  133. ݁ՌΛ࣋ͪؼΓ ӳ༤ѻ͍

  134. ݁ՌΛ΋ ͱʹ ࠞཚϙΠ ϯ τΛ ௵͍ͯ͘͠

  135. ͜Ε͸ΞϓϦͰ΋ ϖʔύʔϓϩ τͰ΋ Ͱ͖ Δ

  136.  ओޠͷσΧ͍࿩

  137. اըͱ͸ ΄͍͠΋ͷΛ ࡞Δ ͜ ͱ

  138. ࣗ෼ͷͰ΋ଞਓͷͰ΋ ΄͍͠΋ͷΛ ࡞Δ ͜ ͱ اըͱ͸

  139. ࣗ෼΋ϢʔβʔͷҰਓ 74 Ϣʔβʔ͸૝૾Λ௒͑ͯ ͘ Δ

  140. Ϣʔβʔͷ ݴ͍ͳ Γ͸ ͏ · ͘ ͍͔ͳ͍

  141. ࢹ໺Λ޿͛ͯ ແҙࣝͷཉ๬Λ ͢ ͘ ্͍͛Δ

  142. ೔ʑ ࣗ෼ͷཉ๬ʹ ޲͖߹͏

  143. ࣗ෼ͷ ཉ๬Λ ݚ͗੅·ͦ ͏

  144. ͦ ͯ͠

  145. ͱ͔ݴͬͯݏ͕ΒΕΔͷ͕69ऀ ͜ͷը໘ ΄ΜͱʹϢʔβʔ ΄͍͔͠ͳ ʁ

  146. ࠓճͷ · ͱΊ

  147. ςΫ ϊϩδʔͰͳ ͘ ਓؒͷ౎߹ʹ ߹ΘͤΑ ͏

  148. ൑அྗΛ ແବଧͪ ͤ͞ͳ͍

  149. ࢖ͬͯ΋ Β ͬͯ ޙΖ͔ΒݟΑ ͏

  150. ࣍ճ༧ࠂ

  151. ࣍͸͋ͳ͕ͨͨͪ ࡞Δ൪Ͱ͢

  152. ͱ Γ͍Ͱ ͨ͠ !LJOBLPCPPTUFS

  153. ࣍ʹಡΉ΋ͷ Ұਓ͔Β࢝ΊΔ69σβΠ ϯ ɹࣗ෼ʹ΋Ͱ͖ ͦ ͏ײ͋Δ XFC੡࡞ऀͷͨΊͷ69σβΠ ϯΛ͸͡ΊΔຊ  69͸ݖྗͩͬͯ࿩͕ͪ

    ΌΜͱॻ͍ͯ͋Γ ·͢ ήʔϜྨ  ੈքͷશͯΛࢀߟʹ͠Α ͏
  154. એ఻ ࢓ࣄͱڠྗऀ ืूத גࣜձࣾ9FNPOPͰݕࡧ ʂ

  155. ΞϓϦσβΠ ϯ ΢Σ ϒ੍࡞ σβΠ ϯߨ࠲ Ͱ͖ ΔΑ

  156. גࣜձࣾ9FNPOP෭ࣾ௕ɹ͔Θͷ ೥ੜɻ Վਓ ΋ͷ͜͝ Ζ͍ͭͨͱ ͖͔ΒখઆΛॻ͖࢝Ίͨɻ จষΛಡΉ͜ ͱ ͱॻ͘ ͜

    ͱҎ֎Կ΋ ͨ͜͠ ͱ͕ͳ͍ɻ ౦ژେֶେֶӃ ʢത࢜՝ఔʣ Ͱϑ Ν ϯλδʔͷݚڀͳ Ͳ Λ ͍ͯ͠Δɻ ۝೥΄Ͳલ͔Β୹ՎΛ࡞Γ࢝Ίͨɻ ೥ɺ ୹Վͷ৽ਓ৆Ͱ͋ΔՎ ஃ৆Λड৆ɻ ࡶࢽ ʰݱ୅୹Վʱ ʹͯ ʮՎஃ࣌ධʯ ࿈ࡌதɻ ΄͔ɺ ୹Վ ɺ ॻධɺ ΤοηΠ ͳ Ͳ Λ୹Վࡶࢽ΍৽ฉͳ Ͳʹॻ͍͍ͯΔɻ ͜ͷձࣾͰͷ໾ׂ͸൑அྗ୲౰ɻ ෭ࣾ௕΋ΑΖ ͠ ͘
  157. ධ࿦ ໋໊ ୹Վ Ͱ͖ ΔΑ

  158. &/%