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

Web Launchpad

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

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
71
Web APIs 2019
Avatar for Orlando Del Aguila orlando
0
120
Managing remote teams
Avatar for Orlando Del Aguila orlando
0
59
How to be a Senior Software Engineer
Avatar for Orlando Del Aguila orlando
0
130
Terraform Workshop
Avatar for Orlando Del Aguila orlando
1
150
Infrastructure as Code with Terraform
Avatar for Orlando Del Aguila orlando
0
270
Concurrencia, Paralelismo y el Event-loop
Avatar for Orlando Del Aguila orlando
0
340
Talking Web Apps
Avatar for Orlando Del Aguila orlando
0
87
Web Launchpad - Chelajs
Avatar for Orlando Del Aguila orlando
0
200

Other Decks in Programming

See All in Programming
RubyKaigi Dev Meeting 2025
Avatar for Aaron Patterson tenderlove
1
1.3k
Orleans + Sekiban + SignalR でリアルタイムWeb作ってみた
Avatar for Tomohisa Takaoka tomohisa
0
230
KANNA Android の技術的課題と取り組み
Avatar for Yosuke Watanabe watabee
0
180
RuboCop: Modularity and AST Insights
Avatar for Koichi ITO koic
2
2.4k
音声プラットフォームのアーキテクチャ変遷から学ぶ、クラウドネイティブなバッチ処理 (20250422_CNDS2025_Batch_Architecture)
Avatar for Koki Senda thousanda
0
380
Носок на сок
Avatar for Bo0oM bo0om
0
1.1k
Thank you <💅>, What's the Next?
Avatar for Hayashibara Yuto ahoxa
1
590
Cursorを活用したAIプログラミングについて 入門
Avatar for 株式会社レクト rect
0
160
Empowering Developers with HTML-Aware ERB Tooling @ RubyKaigi 2025, Matsuyama, Ehime
Avatar for Marco Roth marcoroth
2
950
Make Parsers Compatible Using Automata Learning
Avatar for TSUYUSATO Kitsune makenowjust
2
6.9k
By the way Google Cloud Next 2025に行ってみてどうだった
Avatar for Kento.Yamada ymd65536
0
110
Cursor/Devin全社導入の理想と現実
Avatar for Ryoichi Saito saitoryc
28
21k

Featured

See All Featured
Automating Front-end Workflow
Avatar for Addy Osmani addyosmani
1370
200k
Being A Developer After 40
Avatar for Adrian Kosmaczewski akosma
91
590k
ReactJS: Keep Simple. Everything can be a component!
Avatar for Pedro Nauck pedronauck
667
120k
The Cult of Friendly URLs
Avatar for Andy Hume andyhume
78
6.3k
The Art of Programming - Codeland 2020
Avatar for Erika Heidi erikaheidi
54
13k
Embracing the Ebb and Flow
Avatar for Simon Collison colly
85
4.7k
GitHub's CSS Performance
Avatar for Jon Rohan jonrohan
1031
460k
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
Avatar for Stéphanie Walter stephaniewalter
280
13k
Understanding Cognitive Biases in Performance Measurement
Avatar for Philip Tellis bluesmoon
29
1.7k
Mobile First: as difficult as doing things right
Avatar for Swwweet swwweet
223
9.6k
The Straight Up "How To Draw Better" Workshop
Avatar for Dennis Kardys denniskardys
233
140k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
Avatar for Sam Stephenson sstephenson
160
15k

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!