$30 off During Our Annual Pro Sale. View Details »

Web Launchpad

Avatar for Orlando Del Aguila Orlando Del Aguila
October 23, 2015
Programming
1
330

Web Launchpad

Using Web Audio API and Web MIDI API to sample with a Novation Launchpad in the Browser

Avatar for Orlando Del Aguila

Orlando Del Aguila

October 23, 2015
Tweet

More Decks by Orlando Del Aguila

See All by Orlando Del Aguila
Open Source + Nonprofits = 💪
Avatar for Orlando Del Aguila orlando
0
90
Web APIs 2019
Avatar for Orlando Del Aguila orlando
0
140
Managing remote teams
Avatar for Orlando Del Aguila orlando
0
71
How to be a Senior Software Engineer
Avatar for Orlando Del Aguila orlando
0
150
Terraform Workshop
Avatar for Orlando Del Aguila orlando
1
160
Infrastructure as Code with Terraform
Avatar for Orlando Del Aguila orlando
0
300
Concurrencia, Paralelismo y el Event-loop
Avatar for Orlando Del Aguila orlando
0
370
Talking Web Apps
Avatar for Orlando Del Aguila orlando
0
110
Web Launchpad - Chelajs
Avatar for Orlando Del Aguila orlando
0
230

Other Decks in Programming

See All in Programming
MAP, Jigsaw, Code Golf 振り返り会 by 関東Kaggler会|Jigsaw 15th Solution
Avatar for s.konishi hasibirok0
0
230
ZOZOにおけるAI活用の現在 ~モバイルアプリ開発でのAI活用状況と事例~
Avatar for ZOZO Developers zozotech
PRO
8
5.6k
connect-python: convenient protobuf RPC for Python
Avatar for Anuraag Agrawal anuraaga
0
400
手軽に積ん読を増やすには？/読みたい本と付き合うには？
Avatar for hideki kinjyo o0h
PRO
1
170
「コードは上から下へ読むのが一番」と思った時に、思い出してほしい話
Avatar for HideyukiKitao panda728
PRO
38
26k
Canon EOS R50 V と R5 Mark II 購入でみえてきた最近のデジイチ VR180 事情、そして VR180 静止画に活路を見出すまで
Avatar for kazuhiro hara karad
0
110
ゲームの物理 剛体編
Avatar for Fadis fadis
0
340
まだ間に合う！Claude Code元年をふりかえる
Avatar for nogu nogu66
5
820
配送計画の均等化機能を提供する取り組みについて(⽩⾦鉱業 Meetup Vol.21@六本⽊（数理最適化編))
Avatar for 伊豆原基人 izu_nori
0
150
組み合わせ爆発にのまれない - 責務分割 x テスト
Avatar for HAL halhorn
1
150
20251212 AI 時代的 Legacy Code 營救術 2025 WebConf
Avatar for mouson(墨嗓) mouson
0
130
複数人でのCLI/Infrastructure as Codeの暮らしを良くする
Avatar for Shoma Okamoto shmokmt
5
2.3k

Featured

See All Featured
Music & Morning Musume
Avatar for Bryan Veloso bryan
46
7k
Build The Right Thing And Hit Your Dates
Avatar for Maggie C. maggiecrowley
38
3k
KATA
Avatar for Megan Lloyd mclloyd
PRO
32
15k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
Avatar for Sam Stephenson sstephenson
162
16k
Speed Design
Avatar for Sergey Chernyshev sergeychernyshev
33
1.4k
The Hidden Cost of Media on the Web [PixelPalooza 2025]
Avatar for Tammy Everts tammyeverts
1
100
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
Avatar for Marc Duiker marcduiker
35
2.3k
Rebuilding a faster, lazier Slack
Avatar for samanthasiow samanthasiow
84
9.3k
Building Flexible Design Systems
Avatar for Yesenia Perez-Cruz yeseniaperezcruz
330
39k
How To Stay Up To Date on Web Technology
Avatar for Chris Coyier chriscoyier
791
250k
Build your cross-platform service in a week with App Engine
Avatar for Jose L jlugia
234
18k
Designing for humans not robots
Avatar for Tammie Lister tammielis
254
26k

Transcript

  1. Web Launchpad

  2. None

  3. orlando.delagui.la hashlabs.com eatcodetravel.com

  4. Web Launchpad

  5. Web MIDI API + Web Audio API

  6. Web MIDI API

  7. None

  8. and Opera

  9. Web Audio API

  10. None
  11. None

  12. Web Audio API

  13. AudioContext

  14. .decodeAudioData() .createBufferSource()

  15. Web MIDI API

  16. MIDIAccess

  17. .inputs() .outputs() onstatechange

  18. MIDIInputMap

  19. value.onmidimessage

  20. [144, 10, 127]

  21. [144, 10, 127] channel key note

  22. [144, 10, 0] channel key note

  23. ♥

  24. Demo

  25. Resources

  26. orlando/web-launchpad

  27. developer.mozilla.org html5rocks.com

  28. Thanks!