デザインを共有するための言語化の取り組み

 デザインを共有するための言語化の取り組み

#html5j
#html5j_e

Webやアプリを世に出すにはエンジニアの力が欠かせませんが、競争が激しくユーザーの要望も高まっている現在、デザインは大きな差別化に繋がります。

同じモノ作りをする職業ですが、課題解決の取り組み方から評価の仕方まで違いがあります。その違いが誤解に繋がることもあれば、「よく分からない」と遠ざけてしまうことになります。お互いの力を合わせることでより良いプロダクトが生まれるはずですが、機会を失うことになります。趣向・感覚が違うという単純な話で片付けることはできません。

本セッションでは、エンジニアとデザイナーが協働していくためのアプローチと「相手に何かを伝える」というコミュニケーションの仕方を紹介します。

9eb7e7de20420d02ad289b8713be6823?s=128

Yasuhisa Hasegawa

November 25, 2018
Tweet

Transcript

  1. )5.-$POGFSFODF ௕୩઒ګٱ ೥݄೔

  2. ͳΜ͔ σβΠϯͬͯ ॏཁͦ͏Ͱ͢Ͷ

  3. None
  4. A 100-Year View of User Experience

  5. The DMI Design Value Scorecard

  6. ʮσβΠϯܦӦ ʯએݴ

  7. ʜͦΕͱ΋෇ᝦࢴ͕ม͍͑ͯΔͷ͔ͳʁ

  8. σβΠϯ Ͱ͢ɻ ॏཁ

  9. σβΠϯ ॏཁ ͲΕ͘Β͍ͷൣғΛࢦ͢ͷ͔ ୭ʹͱͬͯԿ͕ॏཁͳͷ͔

  10. ͱΓ͋͑ͣ Կ͔࡞ͬͯΑ ͦ͏͡Όͳ͍ͷ!

  11. σβΠϯͷղऍͷ ҧ͍͕ੜΉڑ཭ײ σβΠϯ෼͔͍ͬͯͳ͍"

  12. ૣ͘࡞ͬͯ ໛ࡧ͢Δ ௐࠪʹج͍ͮͯ ઃܭ͢Δ

  13. σΟςʔϧΛ ࡞ΓࠐΉ ૣ͘࡞ͬͯ ໛ࡧ͢Δ ௐࠪʹج͍ͮͯ ઃܭ͢Δ σβΠϯ

  14. ͳΔ΄Ͳ UX ϏδωεߩݙͩΑͶ ͦΕΑΓ ૣ͘Կ͔࡞ͬͯ ๻ͨͪ΋ ߩݙ͍ͯ͠ΔΑ ͭ·Γ˓˓Ͷ

  15. ύϑΥʔϚϯε ΞΫηγϏϦςΟ Φʔ ϓϯ Web ॏཁʂ ͱʹ͔͘ ૣ͘Կ͔࡞ͬͯ Ͱɺ Ṷ͔Δͷʁ

    ΋ͬͱ େࣄͳ͜ͱ͋Δ
  16. શମݟͯ΄͍͠ ྑ͍ٕज़Ͱ ྑ͍Ϟϊ࡞Γ͍ͨ Կ΍͍ͬͯΔ͔ ෼͔Βͳ͍

  17. None
  18. Τίʔνϟϯόʔݱ৅ʹؾ෇͍͍ͯͳ͍ ಉۀऀײ֮ͷίϛϡχέʔγϣϯ զʑͷਖ਼͍͠͸ʰ͋Δࢹ఺ʱʹա͗ͳ͍

  19. զʑ͸ྑ͍ϞϊΛ࡞Γ͍ͨͱئ͏஥ؒͰ͋Δɻ ͔͠͠·ͩຒΊͳͯ͘͸͍͚ͳ͍ߔ͕͋Δ ҟۀछͷํͱର࿩͢ΔͨΊͷΞϓϩʔν͕ෆ଍͍ͯ͠Δ

  20. ڠಇͷͨΊʹ Ͱ͖Δ͜ͱ ݴޠԽ ໌จԽ

  21. None
  22. CANCEL

  23. Bootstrap Foundation

  24. Bootstrap Foundation Panel Callout Carousel Orbit Navbar Top Bar Popover

    Tooltip
  25. /BWCBSͲ͏͠Α͏Ͷ͐ #PPTUSBQ೿ ʜͲ͜ʁ 'PVOEBUJPO೿

  26. MBCFMͲ͏͠Α͏Ͷ͐ 'PVOEBUJPO೿ )5.-ͷ͜ͱ͔ͳʁ ϑϩϯτΤϯυ ˞#PPUTUSBQͰʮ#BEHFʯʹͳΓ·ͨ͠

  27. None
  28. ΨΠυϥΠϯʹͳ͍ݴ༿͕ߦ͖ަ͏ ։ൃɾσβΠϯҎ֎ͷࢹ఺΋ߟྀ 6*΍ػೳͷଊ͑ํΛڞ༗ɾֶश

  29. χϡΞϯεͷ ڞ༗ ྑ͍ͬͯԿʁ Կ͕େࣄͳͷʁ

  30. ࣗݾ࣮ݱ ଚॏ ࣾձ ҆શ ਎ମతɾ৺ཧత

  31. ࣗݾͷ੒௕ʹܨ͕ΔՁ஋ ࣗ෼ͷࢥ͍௨ΓʹͰ͖͍ͯΔঢ়ଶ पΓ͔Βྑ͍ͱࢥΘΕΔՁ஋ ࢖͍ଓ͚ΔՁ஋ɾҙຯ ͔ܽͤͳ͍Ձ஋؍

  32. ۀछΛ௒͑ͨݴ༿ͷڞ༗ ݴ༿ͷχϡΞϯεΛཧղ͢Δ৔ νʔϜʹ͓͚Δ ʮྑ͍ʯ ͱ͸

  33. ݴ༿ ݪଇ χϡΞϯεͷཧղ νʔϜͷڞ௨ݴޠ Ձ஋ʹج͍ͮͨධՁ

  34. Ձ஋ʹج͍ͮͨධՁ ՝୊Λղܾ͍ͯ͠Δ͔Ͳ͏͔ Ϣʔβʔ΁ఏڙ͢ΔՁ஋͸Կ͔ ϓϩδΣΫτϝϯόʔ͕ೲಘͰ͖Δࢪࡦ

  35. ɾɾɾɾ ͜ΕͲ͏Ͱ͔͢ʁ

  36. ʮ͜Ε͸Ͳ͏Ͱ͔͢ʯ ͸ةݥ৴߸ ηϯεɾ޷ΈɾҒ͍ਓ͕ܾΊΔ ޙ໭Γɺ ໎૸ͷݪҼʹͳΔ͜ͱ΋

  37. ͖ͪΜͱ ໌จԽ σβΠφʔʹ΋ ಇ͖͔͚ͯ

  38. #ௐࠪͰಘͨχʔζ $ͦͷଞ՝୊ %Ծઆ ⚖ࢦඪ 'σβΠϯҊ (मਖ਼߲໨ ▶࣍ͷΞΫγϣϯ ఆੑɾఆྔௐࠪͷ֓ཁ Ϗδωεɺ։ൃ͔Βग़ͨ՝୊ σβΠϯ͕ղܾ͢΂͖՝୊͸Կ͔

    ,1* 69ࢦඪ ϝϦοτɺσϝϦοτɺϦεΫ ϑΟʔυόοοΫ ࣍ʹ΍Δ͜ͱ
  39. None
  40. ՝୊ղܾ΁ٞ࿦Λγϑτͤ͞Δ σβΠϯͷܦҢΛه࿥͢Δ จॻͷఆܕԽΛ৺͕͚Δ

  41. #F9D5D5 3JWFSTJEF 3JZBEI 1.4:1 15.5:1 #F08600 4BO"OUPOJP 4FBUUMF 2.6:1 8.1:1

    5BJQFJ 3.4:1 5SPOEIFJN 8.3:1 #E02F2F 8BSTBX ;BSBHP[B 4.6:1 4.6:1 #F5F5F5 -BT7FHBT -F²O 1.1:1 19.3:1 #DDDDDD -ZPO .JMBO 1.4:1 15.5:1 #B6B6B6 /BUBM /PSXJDI 2:1 10.4:1 #737373 0TBLB 0TMP 4.7:1 4.4:1 #2D2D2D 1BSJT 1PSUMBOE 13.8:1 1.5:1 #E7E7E7 1SBHVF 1SFUPSJB 1.2:1 17:1 "NTUFSEBN "VDLMBOE 10.9:1 1.9:1 #CCE4F7 #JMCBP #SJTCBOF 1.3:1 16:1 #0077D9 #0069BF #005BA6 #003866 #002A4D #001C33 #VEBQFTU $PQFOIBHFO %FOWFS %VCMJO &EJOCVSHI 'SBOLGVSU )BOH[IPV )ZEFSBCBE *OEJBOBQPMJT +BDLTPO ,SBL²X -BIPSF 4.5:1 5.8:1 3.8:1 6.9:1 3:1 12:1 1.8:1 14.6:1 1.4:1 17.3:1 1.2:1 4.6:1
  42. ໌Δ͍৭ʹόϥπΩ͕͋Δ ໌Δ͍৭ͷ࠼౓͕௿Ί ҉͍৭΋ؚΊͯൺֱతόϥϯε͕ྑ͍

  43. None
  44. None
  45. None
  46. ෳ਺ਓ͕σβΠϯΛ৮ΕΔ࢓૊Έ࡞Γ ෦඼͚ͩͰͳ͘ߟ͑ํ΋ ·ͣ͸৭͔ΒγεςϜԽ

  47. ݴޠԽ ໌จԽ ݴ༿ɾ΍Γํ͕গ͠ ҧ͏͚ͩͰ ΍͍ͬͯΔ͜ͱ͕ಉ͜͡ͱ΋ ݴޠڞ༗ͷͨΊʹ σβΠϯ΋ υΩϡϝϯτΛపఈ

  48. ௕୩઒ګٱ @yhassy mail@yasuhisa.com *