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

by n0bisuke

Slide 1

Slide 1 text

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

Slide 2

Slide 2 text

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

Slide 3

Slide 3 text

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

Slide 4

Slide 4 text

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

Slide 5

Slide 5 text

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

Slide 6

Slide 6 text

લճ(4/18 SIerIoTLT)ͷ͓͞Β͍2 https://github.com/n0bisuke/M5_Shuttle_Run GitHubͰެ։͍ͯ͠·͢ɻ ελʔ͍ͩ͘͞ ⭐ ʮ͋ͳͨͷϓϩμΫτ ʹ؆୯ʹγϟτϧϥϯ ͕૊ΈࠐΊ·͢ɻʯ ɾγϟτϧϥϯΛϥΠϒϥϦԽ

Slide 7

Slide 7 text

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

Slide 8

Slide 8 text

Slide 9

Slide 9 text

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

Slide 10

Slide 10 text

ͱΓ͋͑ͣAmazonͰϙνͬͨ

Slide 11

Slide 11 text

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

Slide 12

Slide 12 text

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

Slide 13

Slide 13 text

΍Γ͍ͨ͜ͱͷΠϝʔδ (෼͔Γʹ͔ͬͨ࣌͘༻) ♪ ♪ MIDIͰΩʔλΠϓ Ի͕ྲྀΕΔ

Slide 14

Slide 14 text

♪ ♪ MIDIͰΩʔλΠϓ Ի͕ྲྀΕΔ ͨͩɺMIDIΩʔϘʔυΛ௚઀઀ଓग़དྷΔ ΠϯλʔϑΣΠε͕m5stackʹͳͦ͞͏ ?

Slide 15

Slide 15 text

Ұ୴PCͰरͬͯMQTTͰ౤͛ͯΈΔ ♪ ♪ MIDIͰΩʔλΠϓ Ի͕ྲྀΕΔ PCͰरͬͯ MQTT

Slide 16

Slide 16 text

΍͍͖ͬͯ

Slide 17

Slide 17 text

Web MIDI API ɾMIDIͷ৴߸Λϒϥ΢βͷJavaScript͔Β੍ޚग़དྷΔ ɾChromeͰରԠ͍ͯ͠Δ

Slide 18

Slide 18 text

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

Slide 19

Slide 19 text

Arduinoଆ ɾMQTT༻ͷknolleary/pubsubclientϥΠϒϥϦΛར༻ ɾϒϥ΢β͔ΒͷϝοηʔδΛSubscribeͯ͠ԻΛྲྀ͢ ɾಛఆͷΩʔφϯόʔ͕དྷͨΒࢦఆप೾਺ͷԻΛग़ྗ

Slide 20

Slide 20 text

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

Slide 21

Slide 21 text

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

Slide 22

Slide 22 text

ԋ૗ ɾ

Slide 23

Slide 23 text

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

Slide 24

Slide 24 text

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

Slide 25

Slide 25 text

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

Slide 26

Slide 26 text

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

Slide 27

Slide 27 text

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

Slide 28

Slide 28 text

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

Slide 29

Slide 29 text

No content

Slide 30

Slide 30 text

γϟτϧϥϯ

Slide 31

Slide 31 text

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

Slide 32

Slide 32 text

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

Slide 33

Slide 33 text

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

Slide 34

Slide 34 text

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