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
320

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
84
Web APIs 2019
Avatar for Orlando Del Aguila orlando
0
130
Managing remote teams
Avatar for Orlando Del Aguila orlando
0
69
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
280
Concurrencia, Paralelismo y el Event-loop
Avatar for Orlando Del Aguila orlando
0
350
Talking Web Apps
Avatar for Orlando Del Aguila orlando
0
97
Web Launchpad - Chelajs
Avatar for Orlando Del Aguila orlando
0
210

Other Decks in Programming

See All in Programming
あなたとJIT, 今すぐアセンブ ル
Avatar for monochrome sisshiki1969
1
600
コーディングは技術者(エンジニア)の嗜みでして / Learning the System Development Mindset from Rock Lady
Avatar for mackey0225 mackey0225
2
390
Flutter로 Gemini와 MCP를 활용한 Agentic App 만들기 - 박제창 2025 I/O Extended Seoul
Avatar for JaiChangPark itsmedreamwalker
0
130
バイブコーディングの正体——AIエージェントはソフトウェア開発を変えるか？
Avatar for Shinichi Takayanagi stakaya
5
860
Flutterと Vibe Coding で個人開発！
Avatar for Hayami Shuhei hyshu
1
250
令和最新版手のひらコンピュータ
Avatar for KOBA789 koba789
13
7.4k
Android 15以上でPDFのテキスト検索を爆速開発！
Avatar for tonionagauzzi tonionagauzzi
0
200
CLI ツールを Go ライブラリ として再実装する理由 / Why reimplement a CLI tool as a Go library
Avatar for ktr ktr_0731
3
1k
Nuances on Kubernetes - RubyConf Taiwan 2025
Avatar for Andrey Novikov envek
0
140
11年かかって やっとVibe Codingに 時代が追いつきましたね
Avatar for yimajo yimajo
1
260
「リーダーは意思決定する人」って本当？～ 学びを現場で活かす、リーダー4ヶ月目の試行錯誤 ～
Avatar for Marina Nakagawa marina1017
0
210
大規模FlutterプロジェクトのCI実行時間を約8割削減した話
Avatar for teamLab teamlab
PRO
0
460

Featured

See All Featured
Facilitating Awesome Meetings
Avatar for Lara Hogan lara
54
6.5k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
Avatar for Morgane Peng morganepeng
131
19k
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
Avatar for Rebecca Miller-Webster rmw
34
3.1k
Embracing the Ebb and Flow
Avatar for Simon Collison colly
86
4.8k
Art, The Web, and Tiny UX
Avatar for Lynn Fisher lynnandtonic
301
21k
A Modern Web Designer's Workflow
Avatar for Chris Coyier chriscoyier
695
190k
How to Ace a Technical Interview
Avatar for Jacob Kaplan-Moss jacobian
278
23k
Designing for humans not robots
Avatar for Tammie Lister tammielis
253
25k
Code Reviewing Like a Champion
Avatar for maltzj maltzj
524
40k
How To Stay Up To Date on Web Technology
Avatar for Chris Coyier chriscoyier
790
250k
StorybookのUI Testing Handbookを読んだ
Avatar for Shingo Yamazaki zakiyama
30
6k
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
Avatar for Michelle Schulp Hunt marktimemedia
31
2.5k

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!