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

Web Launchpad

Sponsored · Your Podcast. Everywhere. Effortlessly. Share. Educate. Inspire. Entertain. You do you. We'll handle the rest. →
Avatar for Orlando Del Aguila Orlando Del Aguila
October 23, 2015
Programming
380
1

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

More Decks by Orlando Del Aguila

See All by Orlando Del Aguila
Open Source + Nonprofits = 💪
Avatar for Orlando Del Aguila orlando
0
120
Web APIs 2019
Avatar for Orlando Del Aguila orlando
0
170
Managing remote teams
Avatar for Orlando Del Aguila orlando
0
88
How to be a Senior Software Engineer
Avatar for Orlando Del Aguila orlando
0
170
Terraform Workshop
Avatar for Orlando Del Aguila orlando
1
190
Infrastructure as Code with Terraform
Avatar for Orlando Del Aguila orlando
0
330
Concurrencia, Paralelismo y el Event-loop
Avatar for Orlando Del Aguila orlando
0
400
Talking Web Apps
Avatar for Orlando Del Aguila orlando
0
140
Web Launchpad - Chelajs
Avatar for Orlando Del Aguila orlando
0
260

Other Decks in Programming

See All in Programming
JAWS-UG横浜 #102 AWSサ終供養LT会 成仏できない AWS サービスたち 〜本日、三体供養します〜
Avatar for maroon1st maroon1st
0
360
PHP初心者セッション2026　〜生成AIでは見えない裏側を知る：今だからLAMPを通して仕組みを学ぶ〜
Avatar for Hideo Kashioka kashioka
0
930
React本体のコードリーディング
Avatar for high-g high_g_engineer
1
140
AI時代に設計が 最大の生産性レバーになる 意図駆動開発とデータを消さない設計｜Don't Delete Your Data or Your Intent — Design as the Deepest Lever in the AI Era
Avatar for Tomohisa Takaoka tomohisa
1
930
PHP Application における Kubernetes 内 gRPC 通信
Avatar for Shin Ohno ganchiku
0
590
Claude CodeとAgentCore Gatewayを繋ぐ際の認証認可 / Authentication and authorization when connecting Claude Code with AgentCore Gateway
Avatar for Har1101 har1101
2
280
Building a Meta Ray-Ban display app
Avatar for Akio Itaya akkeylab
0
150
SlackアプリとLambdaの 連携を構築した話
Avatar for pawn pawn_4_s
1
120
Flow は今どうなっているか
Avatar for mizdra mizdra
PRO
0
570
生成AI導入の「期待外れ」を乗り越える ー 開発フロー改革が目指す、真の組織変革
Avatar for starfish719 starfish719
0
4.5k
そこに3びきプロダクトがいるじゃろう——生成AI時代における“価値が届かない理由”の構造
Avatar for kosuke T kosuket
0
490
プロポーザルを書いてもらう
Avatar for pvcresin pvcresin
0
540

Featured

See All Featured
Efficient Content Optimization with Google Search Console & Apps Script
Avatar for Katarina Dahlin katarinadahlin
PRO
1
790
XXLCSS - How to scale CSS and keep your sanity
Avatar for Zaharenia Atzitzikaki sugarenia
249
1.3M
Intergalactic Javascript Robots from Outer Space
Avatar for Vicent Martí tanoku
273
27k
Visual Storytelling: How to be a Superhuman Communicator
Avatar for David Neal reverentgeek
2
610
Getting science done with accelerated Python computing platforms
Avatar for Jacob Tomlinson jacobtomlinson
2
430
Between Models and Reality
Avatar for mayunak mayunak
4
390
How to build a perfect <img>
Avatar for Jono Alderson jonoalderson
1
5.9k
SEO for Brand Visibility & Recognition
Avatar for Aleyda Solis aleyda
0
4.7k
Become a Pro
Avatar for Speaker Deck speakerdeck
PRO
31
6.2k
Tell your own story through comics
Avatar for letsgokoyo letsgokoyo
1
1k
Collaborative Software Design: How to facilitate domain modelling decisions
Avatar for Kenny Baas-Schwegler baasie
1
280
A Guide to Academic Writing Using Generative AI - A Workshop
Avatar for Kenji Saito ks91
PRO
1
370

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!