Upgrade to Pro — share decks privately, control downloads, hide ads and more …

「価値」を生むサービス開発 / Designer MeetUp+ #02

6bca1399b90f0f13eb5bb3eed7d973c5?s=47 Yasuo SHIRAI
December 18, 2019

「価値」を生むサービス開発 / Designer MeetUp+ #02

Designer MeetUp+ #02 「デザイナーとエンジニアの関わり方2.0」でのLT資料です。
https://bengo4.connpass.com/event/155382/

私が弊社1人目のUXエンジニアになった背景を説明しながら、エンジニア・デザイナーの働き方・関わり方について考察しました。

6bca1399b90f0f13eb5bb3eed7d973c5?s=128

Yasuo SHIRAI

December 18, 2019
Tweet

Transcript

  1. ʮՁ஋ʯΛੜΉαʔϏε։ൃ Designer MeetUp+ #02 ʮσβΠφʔͱΤϯδχΞͷؔΘΓํ2.0ʯ หޢ࢜υοτίϜຊ෦ ։ൃ෦ UXΤϯδχΞ നҪ ߁༤

  2. നҪ ߁༤ ͠Β͍ ΍͓͢ หޢ࢜υοτίϜຊ෦ ։ൃ෦ UXΤϯδχΞ খֶੜͷࠒ͔ΒAppleେ޷͖ Twitter: @shirauix

  3. ຊ೔͸ࢲ͕ฐࣾ1ਓ໨ͷ ʮUXΤϯδχΞʯ ʹͳͬͨཧ༝ʹ͍͓ͭͯ࿩͠͠·͢

  4. 1. UXΤϯδχΞͱ͸ʁ

  5. หޢ࢜υοτίϜͰ͸… WebΤϯδχΞͱͯ͠ͷϑϩϯτɾαʔόαΠυ։ൃ ϢʔβʔϦαʔν, ϓϩτλΠϐϯά, ػೳ΍UIͷઃܭ ϏδϡΞϧσβΠϯ

  6. ཁ͸ Ϣʔβʔଆ΁౿Έग़ͨ͠ΤϯδχΞ

  7. 2. UXΤϯδχΞΛ࢝Ίͨཧ༝

  8. ࢲ͕ߟ͑Δɺ࢓ࣄͷຊ࣭

  9. Ϣʔβʔʹରͯ͠ʮՁ஋ʯΛग़͢

  10. ച্͸Ձ஋Λఏڙͨ͠ରՁ ᶃαʔϏεΛ௨ͯ͡ʮՁ஋ʯΛఏڙ͢Δ ᶄຬ଍ͨ͠ରՁͱ͓ͯۚ͠Λ෷͏ Ϣʔβʔ اۀ

  11. Ձ஋Λग़͢ͷ͕ઌ

  12. ࢲ͕ߟ͑Δ ΤϯδχΞͷ੒௕εςοϓ Ϩϕϧ ΑΓՁ஋ΛੜΉํ๏ΛఏҊɾ࣮ݱͰ͖Δ Ϩϕϧ ઐ໳ੑΛ׆͔͠ɺݴΘΕ͍ͯͳ͍෦෼ʹ΋഑ྀͰ͖Δ ੑೳ, อकੑ, ηΩϡϦςΟ, etc...

    Ϩϕϧ ݴΘΕͨ΋ͷ͕࣮ݱͰ͖ΔͷΈ
  13. ᶃՁ஋Λૣ͘ಧ͚Δ ᶅՁ஋Λ௕ظతʹಧ͚Δ ᶄՁ஋Λଟ͘ͷਓʹಧ͚Δ ᶆՁ஋Λग़ͤΔਓΛҭͯΔ

  14. Ͱ͸ɺʮՁ஋ʯͱ͸ʁ

  15. ͔ͪʲՁ஋ʳ 1. ෺͕΋͍ͬͯΔɼԿΒ͔ͷ໨త࣮ݱʹ໾ཱͭੑ࣭΍ఔ౓ɻ஋ଧͪɻ༗༻ੑɻʮʕ͋Δ ඼෺ʯʮʕΛଛͳ͏ʯʮݴٴ͢Δʕ΋ͳ͍ʯʤນ຤·Ͱ͸ʮՁ௚ʢ͔ͪΑ͘ʣʯ͕༻ ͍ΒΕͨʥ 2. ⽡఩⽢ ળ͖΋ͷɾ๬·͍͠΋ͷͱͯ͠ೝΊɼͦͷ࣮ݱΛظ଴͢Δ΋ͷɻ಺ࡏతͳ΋ͷɾ खஈతͳ΋ͷͳͲʹΘ͔ΕΔ͕ɼಛʹɼਅɾળɾඒͳͲɼීวଥ౰ੑΛ΋ͬͨཧ૝తɾ ઈରతՁ஋Λ͍͏ɻ

    3. ⽡ܦ⽢ ঎඼ͷՁ֨ͷഎޙʹ͋ͬͯɼͦΕΛنఆ͍ͯ͠Δ΋ͷɻͦͷຊ࣭ɾݯઘͷͱΒ ͑ํʹΑͬͯ٬؍Ձ஋આʢ࿑ಇՁ஋આʣͱओ؍Ձ஋આʢޮ༻Ձ஋આʣͱ͕ରཱ͢Δɻ ʤ͜ͷޠ͸price ͷ༁ޠͷҰͭͱͯ͠ʮӳ࿨ه฽๏ࣈྨʯʢ1878೥ʣʹɼ·ͨvalue ͷ༁ޠͱͯ͠ʮෟԻૠਤӳ࿨ࣈኮ࠶൛ʯʢ1882೥ʣʹࡌΔʥ ࡾলಊ ʮεʔύʔେࣙྛʯΑΓҾ༻
  16. ͳΔ΄ͲΘ͔ΒΜ

  17. ࣗ෼ͳΓͷཧղ

  18. Ձ஋ ≒ ૬ख͕ײ͡Δʮخ͠͞ʯ

  19. 3. ʮՁ஋ʯͷॏཁͳੑ࣭

  20. ੑ࣭ᶃ ૬ख͕͍Δ ࣾ಺޲͚ ࣾһ ΫϥΠΞϯτϫʔΫ ΫϥΠΞϯτ ࣗࣾαʔϏε ΤϯυϢʔβʔ

  21. ੑ࣭ᶄ ૬खͷঢ়گͰՁ஋͕͋Δ͔ܾ·Δ • ૬ख͕͍࣋ͬͯΔ஌ࣝ • ͜Ε·ͰͷܦݧʹΑΔɺظ଴΍ෆ҆ • ݸਓతͳ޷Έ • ୲͍ͬͯΔ໾ׂ

    • etc...
  22. ʮՁ஋ʯΛੜΉͨΊͷඞཁ৚݅͸ʁ

  23. ૬खΛ஌ΓɺԿ͕Ձ஋ʹͳΔ͔Λ஌Δ͜ͱ

  24. Α͘΍Γ͕ͪͳޡΓ Ϣʔβʔʹ͍ͭͯߟ͑ͳ͍ ໝ૝ͷҬΛग़ͳ͍ શͯΛ஌ͬͨؾʹͳΔ

  25. ϢʔβʔϦαʔν͸શͯͷى఺

  26. 4. ʮՁ஋ʯΛఏڙ͢Δํ๏

  27. ඞཁͳεΩϧ͸ʁ

  28. σβΠφʔ ΤϯδχΞ PHP ΦϒδΣΫτࢦ޲ υϝΠϯۦಈઃܭ ςετۦಈ։ൃ ΞδϟΠϧ εΫϥϜ σʔλϕʔε MVC

    ૄ݁߹ SOLIDݪଇ ΫϦʔϯΞʔΩςΫνϟ HTTP TCP/IP ίϯςφ Kubernetes Linux ϚΠΫϩαʔϏε Webpack Photoshop Illustrator Figma Sketch λΠϙάϥϑΟ ϨΠΞ΢τ ഑৭ ϢʔβʔϦαʔν σβΠϯࢥߟ ϑΝγϦςʔγϣϯ ηΩϡϦςΟ Ϧʔμϒϧίʔυ Git ϓϩτλΠϐϯά ΧελϚʔδϟʔχʔϚοϓ Πϥετ HTML CSS ΞΫηγϏϦςΟ REST JavaScript IA ϦϑΝΫλϦϯά σʔλߏ଄ ΞϧΰϦζϜ ػցֶश ΠϯλϥΫγϣϯ ϫΠϠʔϑϨʔϜ Ϩεϙϯγϒ ࣸਅ άϦουγεςϜ
  29. PHP ΦϒδΣΫτࢦ޲ υϝΠϯۦಈઃܭ ςετۦಈ։ൃ ΞδϟΠϧ εΫϥϜ σʔλϕʔε MVC ૄ݁߹ SOLIDݪଇ

    ΫϦʔϯΞʔΩςΫνϟ HTTP TCP/IP ίϯςφ Kubernetes Linux ϚΠΫϩαʔϏε Webpack Photoshop Illustrator Figma Sketch λΠϙάϥϑΟ ϨΠΞ΢τ ഑৭ ϢʔβʔϦαʔν σβΠϯࢥߟ ϑΝγϦςʔγϣϯ ηΩϡϦςΟ Ϧʔμϒϧίʔυ Git ϓϩτλΠϐϯά ΧελϚʔδϟʔχʔϚοϓ Πϥετ HTML CSS ΞΫηγϏϦςΟ REST JavaScript IA ϦϑΝΫλϦϯά σʔλߏ଄ ΞϧΰϦζϜ ػցֶश ΠϯλϥΫγϣϯ ϫΠϠʔϑϨʔϜ Ϩεϙϯγϒ ࣸਅ άϦουγεςϜ Զ
  30. ʮ৬छʯͰࣗ෼Λنఆ͢Δඞཁ͸ͳ͍

  31. ࣗ෼ͳΓͷํ๏ͰՁ஋Λग़ͤ͹͍͍

  32. 5. ࢲ͕ʮUXΤϯδχΞʯʹͳͬͨཧ༝

  33. ʢٕज़Λ࣠ʹͭͭ͠ʣ खஈΛબ͹ͣ ϢʔβʔʹʮՁ஋ʯΛग़͍ͯ͘͠ ͱ͍͏ܾҙද໌

  34. ͦͯ͠ɺ͋ͳͨͷपΓͷ ಉ྅Λࢥ͍ු͔΂ͯΈ͍ͯͩ͘͞

  35. ΤϯδχΞ σβΠφʔ 43& Ϛωʔδϟʔ ܦཧ ΧελϚʔ αϙʔτ σΟϨΫλʔ Ӧۀاը ϓϩμΫτ

    Φʔφʔ Ӧۀ 2" ๏຿ ϥΠλʔ ࣄۀ෦௕ ܦӦ
  36. https://thispersondoesnotexist.com/ ʹͯੜ੒

  37. https://thispersondoesnotexist.com/ ʹͯੜ੒ ʮΤϯδχΞʯ΍ʮσβΠφʔʯ ͱ͍͏໊લͷਓ͸͍ͳ͍

  38. ಉ྅͕Ͳ͏΍ͬͯ Ձ஋Λग़ͦ͏ͱ͍ͯ͠Δ͔ ཧղ͢Δ

  39. ͦΕ͕ɺࢲͷߟ͑Δ ʮσβΠφʔͱΤϯδχΞͷؔΘΓํʯ

  40. ͝ਗ਼ௌ͋Γ͕ͱ͏͍͟͝·ͨ͠ʂ หޢ࢜υοτίϜຊ෦ ։ൃ෦ UXΤϯδχΞ നҪ ߁༤ Twitter: @shirauix