web audio api: brief introduction

19
Mikhail Larchanka github: larchanka twitter: MLarchanka

Upload: mikhail-larchanka

Post on 08-Jan-2017

102 views

Category:

Software


0 download

TRANSCRIPT

Page 1: Web Audio API: brief introduction

Mikhail Larchanka

github: larchanka twitter: MLarchanka

Page 2: Web Audio API: brief introduction

Web Audio API

Page 3: Web Audio API: brief introduction
Page 4: Web Audio API: brief introduction

<audio></audio>

Page 5: Web Audio API: brief introduction

<audio></audio>

• not cross-browser • no proper control • no pre-buffering • no effects • no sound analysing

Page 6: Web Audio API: brief introduction

Web Audio API

Page 7: Web Audio API: brief introduction

Web Audio API: ~cross-browser

Page 8: Web Audio API: brief introduction
Page 9: Web Audio API: brief introduction
Page 10: Web Audio API: brief introduction

Web Audio API: control

Page 11: Web Audio API: brief introduction

Web Audio API: control – source

Page 12: Web Audio API: brief introduction

Web Audio API: control – analyser

Page 13: Web Audio API: brief introduction

Web Audio API: control – destination

Page 14: Web Audio API: brief introduction

Web Audio API: pre-buffering

Page 15: Web Audio API: brief introduction

Web Audio API: effects (http://webaudioapi.com/samples/room-effects/)

•Overdrive•Filter•Cabinet•Delay•Convolver (Reverb)•Compressor•WahWah•Tremolo•Phaser•Chorus•Bitcrusher•Moog Filter•Ping Pong Delay•Panner•Gain

Page 16: Web Audio API: brief introduction

Web Audio API: analyse (http://webaudioapi.com/samples/visualizer/)

Page 17: Web Audio API: brief introduction

Code (http://jsbin.com/lenapigo/1/edit?html,css,js,output)

Page 18: Web Audio API: brief introduction

Links

• Web Audio API Mozilla.dev (https://developer.mozilla.org/en/docs/Web/API/Web_Audio_API)

• Howler.js (https://github.com/goldfire/howler.js)

• Pizzicato (https://github.com/alemangui/pizzicato)

• Wad (https://github.com/rserota/wad)

• http://codepen.io/njmcode/pen/PwaXwB

• https://mdn.github.io/voice-change-o-matic/

Page 19: Web Audio API: brief introduction

Questions