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

Webサイトをつくってきた人々の進化 ― Era Web Architect の30人のインタビューから

Webサイトをつくってきた人々の進化 ― Era Web Architect の30人のインタビューから

2022年3月12日に、福井県で開催されたセミナー・イベント「4人のプロフェッショナルが語る - ウィズコロナ・DX時代のWeb活用のトレンドとコアスキル」で講演したプレゼンスライドです。

Ed946da673ee07c8b3b41b7aa8268e13?s=128

Takashi Sakamoto

March 12, 2022
Tweet

More Decks by Takashi Sakamoto

Other Decks in Design

Transcript

  1. WebαΠ τΛͭ͘ ͖ͬͯͨਓʑͷਐԽ &SB8FC"SDIJUFDUਓͷΠϯλϏϡʔ͔Β ެӹࡒஂ๏ਓ;͍͘࢈ۀࢧԉηϯλʔ;͍͘%9ΦʔϓϯϥϘ #fukuidxlab @bookslope

  2. ࣗݾ঺հ &SB8FC"SDIJUFDUTϓϩδΣΫτ ΩϟϦΞͰΈΔਓ օ͞Μ΁ͷϝοηʔδ օ͞Μ΁ͷ࣭໰ @bookslope ໨࣍

  3. ࡔຊو࢙ εϚʔτϞϏϦςΟࣄۀਪਐࣨࣨ௕ ΦϯϥΠϯίϛϡχςΟӡӦ دߘɾߨԋଟ਺ ஶॻʰ*"γϯΩϯάʱʰ*"69ϓϥΫςΟεʱͳͲ ࣗݾ঺հ @bookslope ౦ژࡏॅͷσβΠφʔͰ͢ɻσδλϧϓϩμΫτʹ͓͚Δʮ৘ใΞʔΩςΫ νϟʯ΍ʮ69σβΠϯʯͳͲΛֶͼɺݱࡏ͸ʮϞϏϦςΟʯ΍ʮ.BB4ʯ ʹ͓͚Δࣄۀ։ൃɾαʔϏε։ൃʹܞΘ͍ͬͯ·͢ɻ

    @bookslope
  4. ࣄۀ։ൃࢧԉ εϚʔτϞϏϦςΟࣄۀͷਪਐɾۀքͷ׆ੑԽ ϝσΟΞ഑৴ .BB4ؔ࿈ࣄۀͷاըɾఏҊ 84ϑΝγϦςʔγϣϯࢧԉ σδλϧϓϩμΫτͷσβΠϯࢧԉ χϡʔεαΠτʮϨεϙϯεʯ࿈ࡌத औࡐ͔ΒࡱӨɾࣥච ηϛφʔɾΠϕϯτͷاըɾߨԋ @bookslope

  5. #MaaSମݧه ෱ҪݝӬฏࣉொͰͷऔࡐ @bookslope

  6. ⽇産⾃動⾞ ドッツ 2017 2019 リンクス ネットイヤー 
 グループ 2000 2002

    パイナップル 
 カンパニー ヴイロジック 1999 1999 JDS 1997 άϥϑΟοΫ 
 σβΠφʔ 8FC 
 σβΠφʔ 8FC 
 σΟϨΫλʔ σδλϧશൠ 
 69σβΠφʔ ࣗಈं 
 69σβΠφʔ ϞϏϦςΟࣄۀ 
 ίϯαϧ 2001 8FC 
 σΟϨΫλʔ Πϯϋ΢ε ΩϟϦΞαϚϦ 1995 େࡕ ౦ژ 2021 ݱࡏ @bookslope
  7. @Era Web Architects .BSDIUI )*304)*(&("--&3:

  8. Era Web Architects イベント Event 書籍刊⾏ Book ライブ Online 写真展

    Exhibition @Era Web Architects
  9. @Era Web Architects Πϯλʔωοτᴈ໌ظ

  10. @Era Web Architects Photo by TAKAMITSU SAKAMOTO

  11. @Era Web Architects Photo by TAKAMITSU SAKAMOTO ਓͷ΢ΣϒΞʔΩςΫτ ϙʔτϨʔτࡱӨ ࣸਅల։࠵

    ΦϯϥΠϯΠϯλϏϡʔ هࣄԽ ॻ੶Խ ࡔຊو࢙ ࠤ౻৳໻ ௕୩઒ರ࢜ ৿ా༤ ଜӽޛ ্ฏਸਔ Ԟ͍ͣΈ খٱอߒେ࿠ ໦ୡҰਔ ্໺ֶ ২໦ਅ Ѩ෦३໵ ࿨ాՅ߂ ௕୩઒ګٱ ฏ໺ल޾ ໼໺ΓΜ ྛਅཧࢠ தଜ࿱ ͜΋Γ·͖͋͞ ҆౻௚ل ଍ཱ݈ࢽ ߴࢁ࿨໵ ౻઒ਅҰ Ҫొ༑Ұ ਗ਼ਫ੣ தଜڗհ ݪҰߒ ॅଠཅ ੴڮलਔ ਆ৿ษ
  12. @Era Web Architects

  13. ࡔຊو࢙ ২໦ਅ ্໺ֶ ࠤ౻৳࠸ ໼໺ΓΜ ॅଠཅ ਗ਼ਫ੣ ௕୩઒ګٱ ࿨ాՅ߂ Ԟ͍ͣΈ

    ਆ৿ษ ݪҰߒ ॅଠཅ ͜΋Γ·͖͋͞ ҆౻௚थ ਗ਼ਫ੣ ্ฏਸਔ ৿ా༤ Ҫొ༑Ұ ࠤ౻৳࠸ ্໺ֶ ͜΋Γ·͖͋͞ ໦ୡҰਔ Ҫొ༑Ұ ࠤ౻৳࠸ தଜڗհ ໼໺ΓΜ ౻઒ਅҰ ௕୩઒ರ࢜ @Era Web Architects
  14. @Era Web Architects ग़ձ͍ ৘ใൃ৴ ࣥච தଜڗհ ౰࣌ɺΞο プ ϧετΞۜ࠲

    で ΍͍ͬͯͨ $44/JUFʢηϛφʔΠ ベ ϯτʣ で ɺ 1IPUPTIPQͳ ど ͷޮ཰ԽςΫχοΫʹ ͍ͭͯ࿩Λͨ͠ͱ͖ が ͋Δͷ で ͢ が ɺ 
 ͦͷͱ͖ʹձͬͨग़൛ࣾͷํʹ ʮ+BWB4DSJQUͷຊΛग़ͯ͘͠ だ ͍͞ʯͱ ࿩ͨ͠Βɺٯʹʮॻ͍ͯ͘ΕʯͱݴΘΕ ʮΘ͔Γ·ͨ͠ɻॻ͍ͯΈ·͠ΐ͏ʯͱ ͍͏ྲྀΕʹͳͬͯɺ+BWB4DSJQUͷຊΛ ॻ͘͜ͱʹͳΓ·ͨ͠ɻ
  15. @Era Web Architects ਓͷΠϯλϏϡʔ ΦϯϥΠϯγϣοϓ#"4&Ͱൢചத Ձ֨ ԁʢ1%'൛͋Γʣ ࠃཱࠃձਤॻؗ΁΋دଃ

  16. άϥϑΟοΫ σβΠφʔ 8FC 
 σβΠϯ ৘ใ 
 ΞʔΩςΫνϟ ࣗಈं ۀք

    .BB4 ্ژ @Era Web Architects ΩϟϦΞͰΈΔਓ
  17. @Era Web Architects άϥϑΟοΫ σβΠφʔ 8FC 
 σβΠϯ ৘ใ 


    ΞʔΩςΫνϟ ࣗಈं ۀք .BB4 ্ژ ΩϟϦΞͰΈΔਓ
  18. @Era Web Architects άϥϑΟοΫ σβΠφʔ 8FC 
 σβΠϯ ৘ใ 


    ΞʔΩςΫνϟ ࣗಈं ۀք .BB4 ্ژ ΩϟϦΞͰΈΔਓ ඒज़ σδλϧ ϑϨʔϜϫʔΫ ΋ͷͮ͘Γ Ҡಈ ϥΠϑ
  19. ʮଟ͘ͷ͜ͱʹڵຯΛ࣋ͪ૑଄Λ௥ٻ͢Δਓʯͷ͜ͱɻڵຯͷ͋Δ͜ͱΛݟ͚ͭͨ ΒͦΕʹऔΓ૊Ήɻ͠͹Β͘͢Δͱผͷ໘നͦ͏ͳ͜ͱΛݟ͚ͭΔͷͰɺͦͬͪʹ ҠͬͯऔΓ૊ΉɻͦΜͳੜ͖ํΛ܁Γฦ͢ͷ͕ϚϧνϙςϯγϟϥΠτͰ͢ɻ Multipotentialite ͋ͳͨ͸εϖγϟϦετͰ͔͢ʁͦΕͱ΋ϚϧνϙςϯγϟϥΠτͰ͔͢ʁCZ-*(Ώ· ΤϛϦʔɾϫϓχοΫ @bookslope ϚϧνɾϙςϯγϟϥΠτ

  20. େֶ 
 ݚڀձ Ҿ͖͜΋Γ ϑϦʔϥϯε όφʔ৬ਓ 
 (*'Ξχϝ 8&#σβΠϯ τϨϯυ

    ϝϧϚΨ ൃߦ 8*OEPXT Πϯλʔωοτ αʔΫϧ ΞϝϦΧ ཹֶ 8FC੍࡞ձࣾ େاۀ ΞϧόΠτ ϗʔϜϖʔδ ύϯΫ όϯυ Իָ Ϩʔϕϧ ֨ಆٕͷੈք ΫϧʔτϨΠϯ ϚχϑΣετ σδϋϦ ݐઃձࣾ ύιίϯ ΧϥΦέ όΠτ .BD ಠֶ Ξϯάϥܥ ϑϦʔϥϯε ࣥච ِ໊ ग़൛ࣾ σβΠφʔ ৽ଔ ӦۀϚϯ ঎ࣾ λΠग़ு %SFBNXFBWFS ΞυϏߨࢣ ࣄۀձࣾ ஍ݩ ҹ࡮ձࣾ @Era Web Architects ΩϟϦΞͰΈΔਓ
  21. େֶ 
 ݚڀձ Ҿ͖͜΋Γ ϑϦʔϥϯε όφʔ৬ਓ 
 (*'Ξχϝ 8&#σβΠϯ τϨϯυ

    ϝϧϚΨ ൃߦ 8*OEPXT Πϯλʔωοτ αʔΫϧ ΞϝϦΧ ཹֶ 8FC੍࡞ձࣾ େاۀ ΞϧόΠτ ϗʔϜϖʔδ ύϯΫ όϯυ Իָ Ϩʔϕϧ ֨ಆٕͷੈք ΫϧʔτϨΠϯ ϚχϑΣετ σδϋϦ ݐઃձࣾ ύιίϯ ΧϥΦέ όΠτ .BD ಠֶ Ξϯάϥܥ ϑϦʔϥϯε ࣥච ग़൛ࣾ σβΠφʔ ৽ଔ ӦۀϚϯ ঎ࣾ λΠग़ு %SFBNXFBWFS ΞυϏߨࢣ ࣄۀձࣾ ஍ݩ ҹ࡮ձࣾ @Era Web Architects ΩϟϦΞͰΈΔਓ
  22. μΠϠϧ2 ύιίϯ௨৴ ޿ࠂ୅ཧళ 'MBTI 8FC σΟϨΫγϣϯ +BWB4DSJQU ձࣾ )5.- ςΩετ

    ΞϝϦΧ ࠃࡍϏδωε Πϯλʔωοτ ؼࠃ 8FC੍࡞ձࣾ ৘ใઃܭ Φʔφʔζ Ϋϥϒ ৘ใσβΠϯ तۀ اۀ σβΠφʔ ڞಉݚڀ ڭ͑Δ ϐλΰϥεΠον Πϯλʔωοτ ܝࣔ൘ Ӊ஦։ൃ ௗਓؒ ίϯςετ όΠτ ίʔσΟϯά /"4%" 8FCϚελʔ ݹ૥ ΞΫηγϏϦςΟ ిࢠϝʔϧ େֶ ωοτΧϑΣ ϓϩόΠμʔ ۈ຿ ࣥච ւ֎ࡏॅ ग़࢈ "OESPJE ϚϧνϝσΟΞ @Era Web Architects ΩϟϦΞͰΈΔਓ
  23. ϑΝϛίϯ ෺ཧ෦ ػց޻ֶ ϩϘοτݚڀ σδϋϦ ϞόπΠ ύιίϯ௨৴ ٻਓࢽ Ӧۀاը Πϯλʔωοτ

    8FC೥ؑ ฤू ࣄۀձࣾ ΞΫηγϏϦςΟ ্ژ σδϋϦ ିҥ૷԰ σδϋϦ ۈ຿ ෆ໷৓ ਓࡐ։ൃ ΫϦΤΠλʔ ΩϟϦΞࢧԉ ΩϟϦΞ ηϯλʔ ߴઐ ϩϘοτେձ ݚڀࣨ ύιίϯ υοτίϜ Πϕϯτ ϓϩάϥϚʔ ىۀ ্ژ .49 ύιίϯ ϛϡʔδγϟϯ ΞϝϦΧ ཹֶ $44ίϛϡχςΟ (PPHMF 888 @Era Web Architects ΩϟϦΞͰΈΔਓ
  24. POINT 1 ࢠڙͷ͜Ζ͔Βύιίϯʹ৮ΕڵຯΛ΋͍ͬͯΔɻ ཹֶͳͲͷػձ΍ͻͱͭͷग़ձ͍͕ɺͦͷޙͷબ୒ʹ ͭͳ͕͍ͬͯΔɻ POINT 2 Πϯλʔωοτ΍8FCͱ͸ɺͨ·ͨ·ग़ձ͍ͬͯΔʹ ա͗ͳ͍ɻ POINT

    3 Ұ౓ܦݧͨ͠ɺࠓͱ͸ؒٯͳ؀ڥ΍࢓ࣄʹڵຯ͕͋Δɻ POINT 4 Πϯλʔωοτ΍8FC͸ΦʔϓϯͰ͋Γɺͦͷٕज़Λ ׆༻͍ͯ͘͠৔Λօ͕໛ࡧ͍ͯ͠Δɻ POINT 5 @Era Web Architects ΩϟϦΞͰΈΔਓ
  25. ࢲʹ͸ಛผͳ࠽ೳͳͲ͋Γ·ͤΜɻ ͨͩɺ ΋ͷ͘͢͝޷ح৺͕ڧ͍͚ͩͰ͢ɻ ΞϧϕϧτɾΞΠϯγϡλΠϯ @Era Web Architects ΩϟϦΞͰΈΔਓ

  26. @Era Web Architects օ͞Μ΁ͷϝοηʔδ 8FC΍Πϯλʔωοτۀք΁ͷϝοηʔδ MESSAGE

  27. 8FC΍Πϯλʔωοτۀք΁ͷϝοηʔδ ๻͸ʮ࠷ظ·Ͱͭ͘ΔਓʯΛ૿΍͍ͨ͠ɻͦ͏͍͏Ωϟ ϦΞ΋͋Δͱ͍͏͜ͱΛ఻͍͑ͨͰ͢ɻ ݪҰߒ ͜Ε͔Βͷੈ୅ͷਓʹ͸ʮܧଓ͸ྗͳΓʯͱ఻͍͖͑ͯ ͍ͨɻ ͜΋Γ·͖͋͞ σβΠφʔ͕ͨ͘͞Μू·ΕΔΑ͏ͳ৔Λ࡞Γ͍ͨͱ͍ ͏ࢥ͍͕͋Γ·͢ɻ ਆ৿ษ

    8FC΍Πϯλʔωοτͷ৽͍͠ՄೳੑΛҰॹʹͭ͘Δ ͜ͱ͕Ͱ͖ͨΒ͍͍ͳɺͱࢥ͍·͢ɻ ଍ཱ݈ࢽ ͍͔ͭࣗ෼΋ޙଓͷྐʹͳΔͱ͖͕͘Δɻͦͷ೔ͷͨΊ ʹɺޙଓΛࢧ͑ΒΕΔഎࠎΛ͓͍ͭͬͯͯ͘΄͍͠ɻ ҆౻௚ل @Era Web Architects 
  28. ʮجૅΛͪΌΜͱษڧ͠Α͏ʯͱ͍͏͜ͱͰ͢ɻ தଜڗհ ݸਓʹͱͬͯ΋૊৫ʹͱͬͯ΋ɺ͞Βʹ͸ۀքશମʹ ͱͬͯ΋ӹͷ͋ΔऔΓ૊ΈΛ͢Δ͜ͱɺͦ͏͍͏จ຺Λ ݟ͚ͭΔ͜ͱ͕େࣄͩͱࢥ͍ͬͯ·͢ɻ ໦ୡҰਔ ʮ࡞ΔͨΊʹ࣌ؒΛ͔͚ͨΓ͓ۚΛ͔͚ͨΓ͢Δ͜ͱ ྑ͍͜ͱʯ͔ΒҰาҾ͍ͯ΋ͷ͝ͱΛߟ͑Δ΄͏͕͍͍ ͷ͔ͳͱࢥ͍·͢ɻ ໼໺ΓΜ

    8FC͸จԽΛͭ͘ΕΔɻ৽͍͠จԽΛҰॹʹͭ͘Ζ͏ ͥɻ ฏ໺ल޾ ڞ༗஌ʹରͯ͠ͷײ֮͸࣋ͬͯ΋Β͑Δͱ͍͍ͳͱࢥ͍ ·͢ɻ ্ฏਸਔ @Era Web Architects 8FC΍Πϯλʔωοτۀք΁ͷϝοηʔδ 
  29. ࣌୅ͷมԽͷͱ͖ʹอकతʹͳΒͳ͍Ͱ΄͍͠Ͱ͢ɻ ౻઒ਅҰ ࣾձ΁ͷӨڹͱ͔ʮެڞੑʯʹҙࣝΛ޲͚Δۀքਓ͕૿ ͑ͯ΄͍͠ͱࢥ͍ͬͯ·͢ɻ ੴڮलਔ ָ͠Ήͱ͍͏͜ͱͱɺָ͍͠ͱࢥ͑Δ͘Β͍ਂ͘ಥͬࠐ ΜͰ΍͍͚ͬͯ͹͍͍ͱࢥ͍·͢ɻ খٱอߒେ࿠ ʮҰॹʹΞΫηγϏϦςΟΛ΋ͬͱߴΊ͍͖ͯ·ͤΜ ͔ʯͱ͍͏ײ͡Ͱ͔͢Ͷɻ

    ২໦ਅ Ұ൪େࣄͳͷ͸ɺࠓ͍Δ৬৔ɺࣗ෼ͷډ৔ॴͰ໾ʹཱ ͭ࢓ࣄͷܦݧΛੵΜͰ͍͘͜ͱͰ͢ɻ ྛਅཧࢠ @Era Web Architects 8FC΍Πϯλʔωοτۀք΁ͷϝοηʔδ 
  30. Կ͔ʹເதʹͳͬͯɺ೰ΜͰ΋͍͍ࣦ͠ഊͯ͠΋͍͍ͷ ͰɺԿ͔Λͭ͘Δͱ͍͏͜ͱΛͲΜͲΜ΍͍͚ͬͯ͹͍ ͍͔ͳͱࢥ͍·͢ɻ Ѩ෦३໵ ੜ·Εͨͱ͖ΑΓ΋NNͰ΋ੈͷதΛΑͯ͘͠ࢮ͵ͷ ͩͱ͍͏ؾ֓Λ࣋ͬͯఘΊͣʹಆͬͯཉ͍͠Ͱ͢ɻ தଜ࿱ ෺ࣄͷղ૾౓Λ্͛Δʹ͸ʮ଎͘ɺਂ͘જΔʯ͕Φε εϝͰ͢ɻ ଜӽޛ

    ͻͱΓͰͰ͖Δ͜ͱ͸ݶΒΕͯ·͔͢Βɺ๻ͱ͍ͬ͠ΐ ʹ࢓ࣄ͠Α͏ɺͱ͍͏ײ͡Ͱ͢ɻ ৿ా༤ ͜Ε͔Βָͯ͘͠΋ͬͱ͍͍ࣾձʹͳ͍ͬͯ͘͜ͱʹܞ Θ͍͚ͬͯΔͱࢥ͍·͢ɻҰॹʹϫΫϫΫָͯ͠͠ΜͰ ͍͚Ε͹͍͍ͳͱࢥ͍·͢ɻ ࿨ాՅ߂ @Era Web Architects 8FC΍Πϯλʔωοτۀք΁ͷϝοηʔδ 
  31. 8FCͷྖҬ͸Ұͭͷૉཆͱͯ͠׆༻͍͖͍ͯͨͩͨ͠ ͳͱࢥ͍·͢ɻ Ҫొ༑Ұ 8FCͷΤϦΞʹ͹͔ͬΓด͜͡΋Βͳ͍Α͏ʹ͢Δͱ ͍͍Μ͡Όͳ͍͔ͳͱࢥ͍·͢Ͷɻ ਗ਼ਫ੣ ए͍ਓʹ͸ɺͨ͘͞Μͷөը΍খઆʹ৮Εͯཉ͍͠ͱࢥ ͍·͢ɻ ॅଠཅ ͱʹ͔͘Կ͔͠ΖɺͰ͢Αɻࠓ͙͢ʹɻ

    ௕୩઒ହٱ ࠜຊతͳςΫχΧϧίϛϡχέʔγϣϯ͕ܰࢹ͞Ε͍ͯ Δͷ͕ؾ͕͔ΓͰ͢ɻ ߴࢁ࿨໵ @Era Web Architects 8FC΍Πϯλʔωοτۀք΁ͷϝοηʔδ 
  32. ୭͔͕͜͏͔ͨ͠Βࣗ෼΋ͦ͏͢Δͱ͔͡Όͳͯ͘ɺଞ ਓͱҧ͏͜ͱΛ͕Μ͹ͬͯΈͯɺ೥ޙ΍೥ޙʹ໾ ཱͭΑ͏ʹ͢Ε͹͍͍Μ͡Όͳ͍͔ͱࢥ͍·͢ɻ ࠤ౻৳࠸ ͍·৽͍͠Ձ஋؍͕ɺͲ͏͍ͬͨςΫϊϩδʔ΍ͦͷप ลͷߟ͑ํ͔ΒੜΈग़͞Εͨͷ͔ɺͱ͍͏ࢹ఺Λ࣋ͬͯ ࣾձΛݟ͍ͯ͘ͱ໘ന͍Μ͡Όͳ͍͔ͳͱࢥ͍·͢ɻ ௕୩઒ರ࢜ ࣗ෼ͷϐʔεͷཧղͱɺͲ͜ʹϋϝΕ͹͏·͘ػೳ͢Δ ͔ͷࢹ఺͕͋Δͱ͍͍ͳͱࢥ͍·͢ɻ

    ࡔຊو࢙ ࣗ෼ͷಘҙͳ͜ͱ΍޷͖ͳ΋ͷͱ͔ɺͦΕΛ࣠ʹ͢Δ ͱ΍Δ͜ͱͬͯ͋Μ·ΓมΘΒͳ͍ɻͦ͏͍͏ͷΛݟͭ ͚ΒΕΔͱ͍͍ͳͱࢥ͍·͢ɻ Ԟ͍ͣΈ σβΠφʔʹͳΓ͍ͨਓ͸ɺͦ͏͍͏εϖΫλΫϧͷѱ ͍΄͏͔Βൈ͚ग़͞ͳ͍ͱ͍͚ͳ͍ͱࢥ͍·͢ ্໺ֶ @Era Web Architects 8FC΍Πϯλʔωοτۀք΁ͷϝοηʔδ 
  33. @Era Web Architects օ͞Μ΁ͷ࣭໰ ͋ͳͨ͸εϖγϟϦετͰ͔͢ ͦΕͱ΋ϚϧνɾϙςϯγϟϥΠτͰ͔͢ QUESTION

  34. @Era Web Architects ਓͷΠϯλϏϡʔ ΦϯϥΠϯγϣοϓ#"4&Ͱൢചத Ձ֨ ԁʢ1%'൛͋Γʣ ࠃཱࠃձਤॻؗ΁΋دଃ

  35. :PVUVCFͰ΋഑৴த ਓͷΦϯϥΠϯΠϯλϏϡʔؚΉ ϥΠϒ഑৴ઌ:PVUVCF'BDFCPPL5XJUUFS ຖि໦PS༵ۚ೔ ࣌ؒ @Era Web Architects

  36. @bookslope WebαΠτΛ͖ͭͬͯͨ͘ਓʑͷਐԽ ― Era Web Architect 30ਓͷΠϯλϏϡʔ͔Β ͋Γ͕ͱ͏͍͟͝·ͨ͠ɻ