Google Nest Hub Interactive Canvasで苦労した話 (小ネタ) #スマスピ札幌 #スマートスピーカーミーティング

スマートスピーカーミーティング / スマートスピーカーで遊ぼう会@札幌 合同勉強会
https://play-smaspi-sap.connpass.com/event/159267/

Transcript

1. גࣜձࣾϊʔεσΟςʔϧ
   ։ൃ%JWJTJPOٕज़ਪਐ(SPVQ
   ໦ݪ୎໵
   !UBDDL
   εϚʔτεϐʔΧʔϛʔςΟϯά
   εϚʔτεϐʔΧʔͰ༡΅͏ձ!ࡳຈ
   εϚεϐࡳຈεϚʔτεϐʔΧʔϛʔςΟϯά
   (PPHMF/FTU)VC
   *OUFSBDUJWF$BOWBTͰ

   ۤ࿑ͨ͠࿩ খωλ
   
   ೥݄೔
   

   View Slide

2. !UBDDL
   εϚʔτεϐʔΧʔϛʔςΟϯά
   εϚʔτεϐʔΧʔͰ༡΅͏ձ!ࡳຈ
   εϚεϐࡳຈεϚʔτεϐʔΧʔϛʔςΟϯά
   • ໊લ
   ໦ݪ ୎໵ / @tacck
   
   • ॴଐ
   גࣜձࣾϊʔεσΟςʔϧ

   ։ൃDivision ٕज़ਪਐGroup / Leader
   
   • ओ࠵
   • ΏΔWebษڧձ@ࡳຈ
   
   • εϚʔτεϐʔΧʔͰ༡΅͏ձ@ࡳຈ
   
   • ޷͖ͳϑΟΪϡΞεέʔτͷٕ
   εϓϨουɾΠʔάϧ
   ୭
   PHP Conference Hokkaido 2019
   

   View Slide

3. !UBDDL
   εϚʔτεϐʔΧʔϛʔςΟϯά
   εϚʔτεϐʔΧʔͰ༡΅͏ձ!ࡳຈ
   εϚεϐࡳຈεϚʔτεϐʔΧʔϛʔςΟϯά
   (PPHMF/FTU)VC
   

   View Slide

4. !UBDDL
   εϚʔτεϐʔΧʔϛʔςΟϯά
   εϚʔτεϐʔΧʔͰ༡΅͏ձ!ࡳຈ
   εϚεϐࡳຈεϚʔτεϐʔΧʔϛʔςΟϯά
   ࡞Γํ͸ͪ͜ΒΛࢀߟʹ
   https://qiita.com/h-takauma/items/1425abe44a050dfb3269
   

   View Slide

5. !UBDDL
   εϚʔτεϐʔΧʔϛʔςΟϯά
   εϚʔτεϐʔΧʔͰ༡΅͏ձ!ࡳຈ
   εϚεϐࡳຈεϚʔτεϐʔΧʔϛʔςΟϯά
   • ͝ଘ஌ͷ௨Γɺ

   ը໘෇͖ͷεΩϧ (Actions) ͕࡞ΕΔɻ

   → த਎͸ Webϒϥ΢βʔ
   
   • දࣔ͢Δը໘಺ͷίϯςϯπΛɺ

   Vue.js ͳͲͷ WebϑϩϯτΤϯυͷϥΠϒϥϦͰ࡞੒Ͱ͖Δɻ
   *OUFSBDUJWF$BOWBT
   

   View Slide

6. !UBDDL
   εϚʔτεϐʔΧʔϛʔςΟϯά
   εϚʔτεϐʔΧʔͰ༡΅͏ձ!ࡳຈ
   εϚεϐࡳຈεϚʔτεϐʔΧʔϛʔςΟϯά
   ΍ͬͯΈ͍ͯ᪴ͨ
   

   View Slide

7. !UBDDL
   εϚʔτεϐʔΧʔϛʔςΟϯά
   εϚʔτεϐʔΧʔͰ༡΅͏ձ!ࡳຈ
   εϚεϐࡳຈεϚʔτεϐʔΧʔϛʔςΟϯά
   ੠͕஗Εͯฉ͑͜ΔΑ໰୊

   ɹɹɹɹɹɹ
   
   

   View Slide

8. !UBDDL
   εϚʔτεϐʔΧʔϛʔςΟϯά
   εϚʔτεϐʔΧʔͰ༡΅͏ձ!ࡳຈ
   εϚεϐࡳຈεϚʔτεϐʔΧʔϛʔςΟϯά
   • εΩϧݺͼग़͠
   
   • ը໘දࣔ
   
   • 10ඵલޙ଴ͬͯ Google Nest Hub ͕஻Γग़͢
   ੠͕஗Εͯฉ͑͜ΔΑ໰୊
   

   View Slide

9. !UBDDL
   εϚʔτεϐʔΧʔϛʔςΟϯά
   εϚʔτεϐʔΧʔͰ༡΅͏ձ!ࡳຈ
   εϚεϐࡳຈεϚʔτεϐʔΧʔϛʔςΟϯά
   
   

   View Slide

10. !UBDDL
    εϚʔτεϐʔΧʔϛʔςΟϯά
    εϚʔτεϐʔΧʔͰ༡΅͏ձ!ࡳຈ
    εϚεϐࡳຈεϚʔτεϐʔΧʔϛʔςΟϯά
    ݁࿦
    

    View Slide

11. !UBDDL
    εϚʔτεϐʔΧʔϛʔςΟϯά
    εϚʔτεϐʔΧʔͰ༡΅͏ձ!ࡳຈ
    εϚεϐࡳຈεϚʔτεϐʔΧʔϛʔςΟϯά
    • interactiveCanvas.ready(callbacks)

    ͱ

    callbacks.onUpdate()

    Λ࣮૷͍ͯ͠ͳ͍৔߹ʹɺ͜ͷݱ৅͕ൃੜͨ͠ɻ
    ࣮૷࿙Ε
    

    View Slide

12. !UBDDL
    εϚʔτεϐʔΧʔϛʔςΟϯά
    εϚʔτεϐʔΧʔͰ༡΅͏ձ!ࡳຈ
    εϚεϐࡳຈεϚʔτεϐʔΧʔϛʔςΟϯά
    υΩϡϝϯτΛಡΜͩΜͰ͕͢
    https://developers.google.com/assistant/interactivecanvas/
    reference/interactivecanvas
    

    View Slide

13. !UBDDL
    εϚʔτεϐʔΧʔϛʔςΟϯά
    εϚʔτεϐʔΧʔͰ༡΅͏ձ!ࡳຈ
    εϚεϐࡳຈεϚʔτεϐʔΧʔϛʔςΟϯά
    υΩϡϝϯτΛಡΜͩΜͰ͕͢
    https://developers.google.com/assistant/interactivecanvas/
    reference/interactivecanvas
    

    View Slide

14. !UBDDL
    εϚʔτεϐʔΧʔϛʔςΟϯά
    εϚʔτεϐʔΧʔͰ༡΅͏ձ!ࡳຈ
    εϚεϐࡳຈεϚʔτεϐʔΧʔϛʔςΟϯά
    3FRVJSFEॻ͍ͯཉ͔ͬͨ͠
    

    View Slide

15. !UBDDL
    εϚʔτεϐʔΧʔϛʔςΟϯά
    εϚʔτεϐʔΧʔͰ༡΅͏ձ!ࡳຈ
    εϚεϐࡳຈεϚʔτεϐʔΧʔϛʔςΟϯά
    ͓·͚
    

    View Slide

16. !UBDDL
    εϚʔτεϐʔΧʔϛʔςΟϯά
    εϚʔτεϐʔΧʔͰ༡΅͏ձ!ࡳຈ
    εϚεϐࡳຈεϚʔτεϐʔΧʔϛʔςΟϯά
    ͓·͚
    ಈ࡞֬ೝͰϔομ෼Լ͛Δͷ๨Εͯɺ

    onUpdate()ͷ݁Ռ൓өͰ͖ͳ͍!?!?!?

    ͱɺࢥ͍͕ͪɻ
    

    View Slide

17. !UBDDL
    εϚʔτεϐʔΧʔϛʔςΟϯά
    εϚʔτεϐʔΧʔͰ༡΅͏ձ!ࡳຈ
    εϚεϐࡳຈεϚʔτεϐʔΧʔϛʔςΟϯά
    FOE
    

    View Slide