HTMLファイ部という職能のはなし - bonfire frontend #1

HTMLファイ部という職能のはなし - bonfire frontend #1

113cbd8c6d83239e6db3dd6fc5743ecc?s=128

Shin Fujisawa

March 26, 2018
Tweet

Transcript

  1. HTMLファイ部という 職能のはなし ໘ന๏ਓΧϠοΫ HTMLϑΝΠ෦Ϧʔμʔ ౻ᖒ৳ / @fnobi

  2. 自己紹介 • ౻ᖒ৳ / @fnobi • ໘ന๏ਓΧϠοΫ डୗࣄۀ෦ • HTMLϑΝΠ෦ʢWebϑϩϯτνʔϜʣ

    Ϧʔμʔ
  3. [1] 面白法人カヤック 受託事業部

  4. 「どれだけバズるか」 ܝ͍͛ͯΔςʔϚ

  5. όζίϯςϯπΛಘҙ෼໺ͱ͍ͯ͠Δ

  6. →「バズ」の変容

  7. ↓2016/4/1 ↓2017/4/1

  8. →「バズ」の変容 •ͨͩόζΛૂ͏͚ͩͳΒɺSNS౤ߘ༻ͷը૾ Λͭͬͨ͘Γɺهࣄॻ͍ͨ΄͏͕ૣ͍ͯ҆͘ •ೝ஌ΛͶΒ͏όζͰαΠτ੍࡞ͯ͠΋͠ΐ͏ ͕ͳ͍ •࣮ࡍΧϠοΫͰ΋ɺಈը΍SNS౤ߘͷ࢓ࣄ͕ ૿͑ͨ

  9. →時代の変化 •HTMLϑΝΠ෦ɺഇ෦…ʁ

  10. →「バズ」の変容 WebαΠτΛ௨ͯ͠ɺ
 Ϣʔβʔͷײ৘Λ༳͞ͿΔΑ͏ͳɺ
 ࢗ͞Δମݧɾ৽͍͠ମݧΛ
 ͭ͘Δͱ͍͏͜ͱʹಛԽɻ

  11. ΦϦδφϧίϯςϯπͷ
 ϑΝϯ৺ཧΛ༳͞ͿΔ
 ΋ͷͩͬͨΓ ؆୯Ͱɺ͔ͭ೤தͰ͖ ΔήʔϜମݧͩͬͨΓ

  12. [2] HTMLファイ部の アプローチ

  13. •受託事業部 •ディレクター •プロデューサー •プランナー •プロジェクトマネージャー •デザイナー •エンジニア •サーバーサイド •HTMLファイ部 •オルタナティ部(その他)

  14. HTMLファイ部 • डୗࣄۀ෦ͰWebϑϩϯτΛ୲౰͢ΔνʔϜ • σβΠφʔνʔϜ͕ίʔσΟϯάˠʮME՝ʯˠʮHTML ϑΝΠ෦ʯͱঃʑʹઐ໳Խ͍ͯͬͨ͠ • ࠓߋHTML5Λਪͯ͠΋࣌୅஗Εײ͕͋ΔͷͰɺ࠷ۙ͸ ʮWebϑϩϯτܳਓʯͬͯࣗশ͍ͯ͠Δ

  15. HTMLファイ部 Webϑϩϯτܳਓ = Webフロントで新しい体験を つくるエキスパート

  16. 事例紹介

  17. 事例紹介 Webフロント x 3Dグラフィック(WebGL) https://www.kayac.com/service/client/1557

  18. 事例紹介 Webフロント x マイク入力(getUserMedia) https://www.kayac.com/service/client/1579

  19. 事例紹介 Webフロント x AfterEffect (lottie-web) https://www.kayac.com/service/client/1529

  20. アプローチ • Web(HTML5)ͰͰ͖Δ͜ͱ͕ɺεϖοΫతɾAPIతʹ޿ ͕͍ͬͯΔ࠷தͳͷͰɺผͷ෼໺Ͱ࢖ΘΕ͍ͯͨख๏Λ Ҿͬுͬͯ͘Δͱͦͷ··৽͍͠ମݧΛͭ͘Γ΍͍͢ɻ

  21. その他やっていること

  22. その他やっていること (1) 研究室のような部内ユニット

  23. •HTMLファイ部 •プランナー・PM専攻 •演出(動画)専攻 •Web以外専攻(Unity・機械学習) 20ਓ΄Ͳ͍ΔνʔϜϝϯόʔΛײ৺ྖҬͰ3ͭʹ෼Խɾ ͦΕͧΕͷΞϯςφΛਂΊ͍ͯΔ

  24. その他やっていること (2) プランナーに 殴り込みに行く会

  25. •受託事業部 •ディレクター •プロデューサー •プランナー •プロジェクトマネージャー •デザイナー •エンジニア •サーバーサイド •HTMLファイ部 •オルタナティ部(その他)

    ݄ʹҰ౓ɺ࢖͍͍ٕͨज़Λ ϓϥϯφʔશһͷલͰ ௚઀ϓϨθϯΛ͢Δ
  26. ࣮ࡍ٬ઌͰఏҊʹߦࣾ͘һͱWebϑϩϯτͷ࠷લઢΛ
 ڞ༗ɾ࢓ࣄͱͯ͠׆༻Ͱ͖ΔՄೳੑΛߴΊΔɻ

  27. まとめ • ୯ͳΔόζͷͨΊʹWebαΠτΛ࡞Δͷ͸͍·΍ίεύ ͕ѱ͍ɻೝ஌Ͱ͸ͳ͘ମݧ·Ͱࢗ͞Δ΋ͷΛ࡞Βͳ͍ͱ ҙຯ͕ͳ͍ɻ • WebͰͲΜͳମݧΛͭ͘Δ͜ͱ͕Ͱ͖Δͷ͔ɺͱ͍͏఺ʹ ͍ͪ͹Μৄ͍͠ͷ͸ΤϯδχΞࣗ਎ɻݚڀɾఏҊ͢Δମ੍ Λͭ͘Δ͜ͱͰɺݟͨ͜ͱ͕ͳ͍ମݧΛͭ͘ΕΔՄೳੑ͕ ্͕Δ͠ɺΤϯδχΞࣗ਎΋ָ͍͠ɻ

  28. ありがとう ございました!!!