Upgrade to Pro — share decks privately, control downloads, hide ads and more …
Sign up for free

Brincando de músico usando WebAudioAPI

Sponsored · Ship Features Fearlessly Turn features on and off without deploys. Used by thousands of Ruby developers. →
Avatar for Diógenes Fernandes Diógenes Fernandes
February 27, 2014
Technology
92
0

Brincando de músico usando WebAudioAPI

Using Javascript!

Avatar for Diógenes Fernandes

Diógenes Fernandes

February 27, 2014

More Decks by Diógenes Fernandes

See All by Diógenes Fernandes
How OpenTofu uses LSP to power its text editors plugins
Avatar for Diógenes Fernandes diofeher
0
22
Conseguindo seu primeiro emprego remoto na gringa
Avatar for Diógenes Fernandes diofeher
0
49
Hackeando a votação do BBB com Python
Avatar for Diógenes Fernandes diofeher
0
160
ES6 - Consertando as partes ruins do JavaScript
Avatar for Diógenes Fernandes diofeher
0
110
How I made a Spacedrum
Avatar for Diógenes Fernandes diofeher
0
110

Other Decks in Technology

See All in Technology
Vibe Coding で作ったプロダクトをどう安全に動かすか / How to Safely Run Products Built with Vibe Coding
Avatar for Akira Maeda glidenote
0
460
AIエージェントの権限管理 3:  Agentic RAG の Fine grained access control 編
Avatar for Renya Kujirada ren8k
0
180
SREは、MCPとAutopilotをこう使え！
Avatar for kazumax55 kazumax55
3
940
データ_AIの事業の勝敗をわけるもの
Avatar for KJ(Kenji Matsuda) nek0128
1
470
Issue 駆動でスペシャリストの意図を届ける、AI 実装のアクセシビリティ向上
Avatar for thkt thkt
0
130
おい、エージェントを使って終わらせろ
Avatar for nwiizo nwiizo
2
840
エージェントはローカル、検証はMicroVM — Lambda MicroVMsでつくるServerless CI
Avatar for fujioka-a fujioka6789
3
650
アプリをもっと"iOSアプリっぽく"する小さな工夫 / Small Touches That Make Your App Feel More Like an iOS App
Avatar for matsuji matsuji
2
1k
.NET WebAssemblyで実現するクライアントサイドAI推論：NuGetからViteまで、2つのエコシステムを繋ぐビルド戦略
Avatar for Yusuke Yamada yamachu
0
420
積み重なった技術負債への挑戦 〜初手としての全社ゴト化〜
Avatar for PERSOL CAREER Dev | techtekt techtekt
PRO
0
1.5k
品質と信頼性を地続きにする
Avatar for gr1m0h grimoh
2
900
Azure Serverless 2026：Production-ready な AI エージェント基盤 / Azure Serverless 2026: Production-Ready AI Agent Platform
Avatar for miyake miyake
2
490

Featured

See All Featured
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
Avatar for mongodb mongodb
50
10k
Impact Scores and Hybrid Strategies: The future of link building
Avatar for Tamara Novitovic tamaranovitovic
0
440
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
Avatar for Eileen M. Uchitelle eileencodes
141
35k
Leveraging LLMs for student feedback in introductory data science courses - posit::conf(2025)
Avatar for Mine Cetinkaya-Rundel minecr
1
400
The untapped power of vector embeddings
Avatar for Frank van Dijk frankvandijk
2
1.9k
How to Think Like a Performance Engineer
Avatar for Harry Roberts csswizardry
28
2.8k
Leveraging Curiosity to Care for An Aging Population
Avatar for Cassini Nazir cassininazir
1
500
Designing for Timeless Needs
Avatar for Cassini Nazir cassininazir
1
480
Avoiding the “Bad Training, Faster” Trap in the Age of AI
Avatar for Mike Taylor tmiket
0
240
Darren the Foodie - Storyboard
Avatar for Kevinho.art khoart
PRO
4
3.9k
エンジニアに許された特別な時間の終わり
Avatar for watany watany
109
250k
How to Get Subject Matter Experts Bought In and Actively Contributing to SEO & PR Initiatives.
Avatar for Liv Day livdayseo
0
200

Transcript

  1. Brincando de músico usando WebAudio API @diofeher

  2. Diógenes Fernandes http://diofeher.net http://github.com/diofeher @diofeher

  3. Um pouco de história

  4. -bgsound (IE) -embed (Netscape) -flash (cross-browser) -<audio>

  5. WebAudio API!!

  6. None

  7. getUserMedia() XHR createOscillator() <audio>

  8. Estrutura

  9. demo | console

  10. Sintetizado! http://eshiota.github.io/retro-audio-js/

  11. White Noise demo | rain.html

  12. XHR

  13. demo | app1.html

  14. demo | app2.html

  15. getUserMedia() live

  16. ? @diofeher