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

話題の #m5stack MIDI演奏っぽいのを試してみたよ #iotlt

n0bisuke
April 23, 2018
1.2k

話題の #m5stack MIDI演奏っぽいのを試してみたよ #iotlt

IoTLT vol38 at ウイングアーク1st https://iotlt.connpass.com/event/82485/
M5Stackがここ最近話題なので触ってます。演奏したかったので試した結果...

n0bisuke

April 23, 2018
Tweet

More Decks by n0bisuke

Transcript

  1. @n0bisuke
    ࿩୊ͷM5StackͰԋ૗ͯ͠ΈͨΑ
    SI #iotlt 2018/4/18

    View full-size slide

  2. ੁݪ ͷͼ͚͢
    dotstudio, Inc.
    ɾWeb Engineer
    ɾMicrosoft MVP (Node.js)
    ɾLINE API Expert (ࠃ಺5ਓ/ੈք22ਓ)
    ɾσδλϧϋϦ΢ουେֶେֶӃ ඇৗۈߨࢣ
    ɾIoTLT ओ࠵
    nobisuke sugawara

    View full-size slide

  3. dotstudio, inc.
    ཧ೦ : Ϟϊͮ͘ΓΛָ͠ΉਓΛ૿΍͢
    2016೥૑ۀ

    View full-size slide

  4. M5Stack
    ɾESP32ϕʔεͷ։ൃϓϥοτϑΥʔϜ
    ɾWiFi & Bluetooth
    ɾArduino + Arduino IDEͰ։ൃՄೳ
    ɾCloud IDE + MicroPython or LuaͷOTAػೳ΋
    ɾσΟεϓϨΠ / εϐʔΧʔ / Ϙλϯ౥ࡌ
    ɾ࠷ۙ࿩୊ ʢ2݄ͷIoTLTࡳຈͰॳΊͯ஌ͬͨʣ
    ɾγϟτϧϥϯ͕ग़དྷΔ

    View full-size slide

  5. લճ(4/18 SIerIoTLT)ͷ͓͞Β͍
    ɾεϐʔΧʔ಺ଂ͕໨৽͋͠͞ΔͷͰεϐʔΧʔ
    ͔ΒνϟϨϯδ
    ɾγϟτϧϥϯͷԻָͱϧʔϧΛ஧࣮ʹ࠶ݱ

    View full-size slide

  6. લճ(4/18 SIerIoTLT)ͷ͓͞Β͍2
    https://github.com/n0bisuke/M5_Shuttle_Run
    GitHubͰެ։͍ͯ͠·͢ɻ
    ελʔ͍ͩ͘͞

    ʮ͋ͳͨͷϓϩμΫτ
    ʹ؆୯ʹγϟτϧϥϯ
    ͕૊ΈࠐΊ·͢ɻʯ
    ɾγϟτϧϥϯΛϥΠϒϥϦԽ

    View full-size slide

  7. લճ(4/18 SIerIoTLT)ͷ஌ݟ(ऄ଍)
    ɾ”γϟτϧϥϯͷԻݯ͸ΈΜͳ͓ͳ͡Έ”ͩͱ
    ࢥ͍͕ͬͯͨҧ͔ͬͨ
    ɾ2001೥ͷதֶ2೥ੜ͕࠷ॳɺͦΕҎ߱ͷੈ୅(ͩ
    ͍͍ͨ32ࡀҎԼ)͕஌͍ͬͯΔ
    ɾࠓγϟτϧϥϯͬͯԿʁͬͯͳͬͯΔਓ͸33ࡀ
    Ҏ্ͩͱࢥΘΕΔ

    View full-size slide

  8. લճ(4/18 SIerIoTLT)ͷ஌ݟ(ऄ଍)
    ɾ”γϟτϧϥϯͷԻݯ͸ΈΜͳ͓ͳ͡Έ”ͩͱ
    ࢥ͍͕ͬͯͨҧ͔ͬͨ
    ɾ2001೥ͷதֶ2೥ੜ͕࠷ॳɺͦΕҎ߱ͷੈ୅(ͩ
    ͍͍ͨ32ࡀҎԼ)͕஌͍ͬͯΔ
    ɾࠓγϟτϧϥϯͬͯԿʁͬͯͳͬͯΔਓ͸33ࡀ
    Ҏ্ͩͱࢥΘΕΔ

    View full-size slide

  9. ࣍͸
    ࣗ෼Ͱԋ૗ͯ͠Έ͍ͨ

    View full-size slide

  10. ͱΓ͋͑ͣAmazonͰϙνͬͨ

    View full-size slide

  11. MIDIΩʔϘʔυ
    ɾMIDI -ʢϛσΟɺMusical Instrument Digital Interfaceʣ
    ిࢠָثͷԋ૗σʔλΛػثؒͰσδλϧసૹ͢ΔͨΊ
    ͷੈքڞ௨ن֨ɻ෺ཧతͳૹड৴ճ࿏ɾΠϯλϑΣʔ
    εɺ௨৴ϓϩτίϧɺϑΝΠϧϑΥʔϚοτͳͲෳ਺ͷ
    نఆ͔ΒͳΔɻ
    ɾMIDIΩʔϘʔυ - MIDIσʔλೖྗΠϯλʔϑΣΠε

    View full-size slide

  12. ΍Γ͍ͨ͜ͱͷΠϝʔδ
    લճ
    ࠓճ

    View full-size slide

  13. ΍Γ͍ͨ͜ͱͷΠϝʔδ
    (෼͔Γʹ͔ͬͨ࣌͘༻)


    MIDIͰΩʔλΠϓ
    Ի͕ྲྀΕΔ

    View full-size slide



  14. MIDIͰΩʔλΠϓ
    Ի͕ྲྀΕΔ
    ͨͩɺMIDIΩʔϘʔυΛ௚઀઀ଓग़དྷΔ
    ΠϯλʔϑΣΠε͕m5stackʹͳͦ͞͏
    ?

    View full-size slide

  15. Ұ୴PCͰरͬͯMQTTͰ౤͛ͯΈΔ


    MIDIͰΩʔλΠϓ
    Ի͕ྲྀΕΔ
    PCͰरͬͯ
    MQTT

    View full-size slide

  16. Web MIDI API
    ɾMIDIͷ৴߸Λϒϥ΢βͷJavaScript͔Β੍ޚग़དྷΔ
    ɾChromeͰରԠ͍ͯ͠Δ

    View full-size slide

  17. MIDIͷσʔλߏ଄
    ྫ: 144 48 110
    ࢀরݩ: http://computermusicresource.com/MIDI.Commands.html

    View full-size slide

  18. Arduinoଆ
    ɾMQTT༻ͷknolleary/pubsubclientϥΠϒϥϦΛར༻
    ɾϒϥ΢β͔ΒͷϝοηʔδΛSubscribeͯ͠ԻΛྲྀ͢
    ɾಛఆͷΩʔφϯόʔ͕དྷͨΒࢦఆप೾਺ͷԻΛग़ྗ

    View full-size slide

  19. ͱΓ͋͑ͣ
    MIDIΩʔϘʔυͱ࿈ܞͰ͖ͨ

    View full-size slide

  20. ݕূ: ͪΌΜͱ஄͚Δͷ͔

    View full-size slide

  21. ݁Ռ: ஄͚Δ͚Ͳ஗Ԇ͕ͻͲ͍

    View full-size slide

  22. ݁Ռ: MQTTͷݶքΛײͨ͡
    ɾMQTTɺϦΞϧλΠϜͳॲཧͱ͸ݴ͑Ͳ΋Իʹ͸࢖͑
    ͳͦ͞͏
    ɾWiFiΛ࢖͍ͬͯΔҎ্ɺωοτϫʔΫͷϘτϧωοΫ
    ͕͋Δ
    ɾ஗Ԇ͕͋ΔͱԻͷִ͕ؒ౷ҰͰແ͍ۂ͸͠ΜͲ͍
    ɾࠓ౓͸BLEͳͲͰ΋ࢼͯ͠Έ͍ͨ

    View full-size slide

  23. ஗Ԇ͕ൃੜͯ͠΋
    ׂͱԋ૗Ͱ͖ͨۂ

    View full-size slide

  24. ஗Ԇ͕ൃੜͯ͠΋
    ׂͱԋ૗Ͱ͖ͨۂ

    View full-size slide

  25. ஗Ԇ͕ൃੜͯ͠΋
    ׂͱԋ૗Ͱ͖ͨۂ2
    ৴߸ͷΞϨ

    View full-size slide

  26. ஗Ԇ͕ൃੜͯ͠΋
    ׂͱԋ૗Ͱ͖ͨۂ3
    γϟτϧϥϯBGM (஗ԆʹΑΓ࠷ޙ͸ٳΜͰΔ)

    View full-size slide

  27. γϟτϧϥϯ

    View full-size slide

  28. ࠓճͷͨΊʹɺຊମΑΓ΋௒Ͱ͔͍
    MIDIΩʔϘʔυΛߪೖͯ͠͠·ͬͨ
    ϑϧαΠζ88伴

    View full-size slide

  29. ݁Ռ: ࣦഊ
    (શવ࢖͑ͳ͔ͬͨ)

    View full-size slide

  30. γϟτϧϥϯ ΍Δͱ͖͸
    ྫͷϥΠϒϥϦͷํ͕ྑͦ͞͏

    View full-size slide

  31. ·ͱΊ
    ɾM5StackͰԋ૗Λࢼͯ͠Έͨ
    ɾ௨৴ʹMQTT͸஗Ԇ͕େ͖͍ͷͰࣦഊɻ
    ɹ-> վળ͠ͳ͍ͱ
    ɾWeb MIDIָ͍͠
    ɾγϟτϧϥϯ΍Δ৔߹͸ϥΠϒϥϦ࢖ͬͯͶ
    (n0bisuke/M5_Shuttle_Run)
    FB: sugawara.ryousuke
    Twitter: n0bisuke

    View full-size slide