web midi apiをうまく使うための話

16
WEB MIDI APIを うまく使うための話 面白法人カヤック HTMLファイ部 藤澤伸 / @FNOBI

Upload: shin-fujisawa

Post on 05-Dec-2014

474 views

Category:

Technology


0 download

DESCRIPTION

・WEB MIDI APIは地味なので、なんか使い道つくりたい ・実はMIDIは、必ずしも音楽に使わなくてもいい ・演出をデバイスから直接入力して、ファイルとしても保存できる、というのはなかなかステキなんじゃないか ・そんなかんじのデモつくりました

TRANSCRIPT

Page 1: WEB MIDI APIをうまく使うための話

WEB MIDI APIを うまく使うための話 面白法人カヤック HTMLファイ部 藤澤伸 / @FNOBI

Page 2: WEB MIDI APIをうまく使うための話

はじめまして! 面白い法人でWEBやANDROIDや曲を書いてます。 のびーといいます。

Page 3: WEB MIDI APIをうまく使うための話

今日は、

WEB MIDI API の話をさせて頂きます。

Page 4: WEB MIDI APIをうまく使うための話

WEB MIDI APIとは? • PCに繋いだMIDIデバイスとブラウザで、直接通信するための規格

• キーボードで弾いた音をブラウザで認識できる! • ブラウザで生成した楽譜を外部音源で再生!

Page 5: WEB MIDI APIをうまく使うための話

ポケミクでちょっと有名になった。

Page 6: WEB MIDI APIをうまく使うための話

しかし、

Page 7: WEB MIDI APIをうまく使うための話

どう考えても地味。 • 利用者のブラウザにMIDI端末がつながっている

必要がある → そうそうない • MIDIを簡単に扱える、という利点はあるが、ブ

ラウザを挟む必然性がない • ポケミクのように、デバイスを配って、それと

一緒に使ってもらうようなサイトならよいが、稀なケース

Page 8: WEB MIDI APIをうまく使うための話

というわけで、

使い道を考えてみる

Page 9: WEB MIDI APIをうまく使うための話

そもそもMIDIとは

Page 10: WEB MIDI APIをうまく使うための話

• 電子楽器の演奏データを機器間でデジタル転送するための世界共通規格

• よくある「.MIDI」ファイルは、STANDERD MIDI FILEというやつ

• 楽器への演奏データ送信の他、舞台演出装置の同期等にも使われている

• 必ずしも、音楽のための形式ではない!

Page 11: WEB MIDI APIをうまく使うための話

WEB演出のパラメータを 保存するためのMIDI というものが考えられるのでは?

Page 12: WEB MIDI APIをうまく使うための話

MIDI信号が持っている情報 • 音の開始・停止 (NOTEON・NOTEOFF) • 音階 • 音色 • 音の強さ

Page 13: WEB MIDI APIをうまく使うための話

デモをつくってみました http://140926-webmidiapi.fnobi.com/ • キーボードつないで叩くとなんか出ます • 演出保存機能あり!! • consoleから disk.startRecording() すると録音 • disk.stopRecording()すると停止・自動再生

Page 14: WEB MIDI APIをうまく使うための話

今後の展望 ちゃんと.MIDIで保存できるようにする • 音楽編集ソフトで微調整ができる!! • 既存ライブラリあるので、それを組み込む

Page 15: WEB MIDI APIをうまく使うための話

_人人人人_ > 告知 < ‾YYYY‾ 来月頭、カヤックも似たようなイベントやります。 !

!

!

!

おいしくてためになる!

Page 16: WEB MIDI APIをうまく使うための話

ありがとうございました