making music on the web with midi technology - music china

Photo by Takuya Oikawa

Web MusicApps & Actvites in Japan

Ryoya Kawai (Yamaha)

Ryoya KAWAI＞ From ＜ - Yamaha Corporation

＞ Community ＜ - Web Music Developers JP (260members)

google.com/+RyoyaKawai

Web Audio API&

Web MIDI API

Web Audio API&

Web MIDI API

>> Web Audio API <<

Web Browser & Signal Processing

>> Web MIDI API <<

Connect between

Web Browser & MIDI Devices

Signal Processing Apps, MIDI Apps??

● Possible to develop these apps on....o Mac, Windows, iOS, Android...

>> What do we develop those apps?

SDK :

Collaboraton : Library, Wrapper ...

How about on Web Platorm??

SDK :

Collaboraton : no Library, no Wrapper !.

ex) Media Capture, Speech Recogniton, Sensors, Graphics, and more!!

Big Idea With

Less Work, Less Code!

Source CodeSource Code

● Only 5 lines of JavaScript!!

<script type="text/javascript"> var midiins=[], midiouts=[]; navigator.getMIDIAccess(function(access) { midiins=access.inputs(); midiouts=access.outputs(); }, function(msg){ console.log(msg);}); </script>

midiins[0].onmidimessage=function(data){ // write code what you want to do }

midiouts[0].send([0x90, 0x45, 0x7f], 0);

How to connect to MIDI devices

Pocket-Miku & Web MIDI App

URL

Web MIDI is Ready

Actvites in JapanActvites in Japan

Hack-a-thon

VJ App with Tenorion

Google Spreadsheet Sequencer

Face Tracking Efector

Why don't we start play with music on

Web Platorm!

Why don't we start play with music on

Web Platorm!

Web MIDI is Ready

Thanks!Thanks!