Making Music in the Browser

Resources and more: https://github.com/stevekinney/making-music

Transcript

1. Making Music with the Web Audio API Steve Kinney — @stevekinney
2. Hello. I'm Steve.
3. http://turing.io
4. Nodebots Colorado: Denver, June 3 http://nodebots.co/
5. synthesizer web browser Someone put a . in your
6. The Web Audio API.
7. It all starts with some context.
52. Source: http://commons.wikimedia.org/wiki/File:Waveforms.svg
56. A4 440 Hz
57. A4 440 Hz A5 880 Hz
58. A3 220 Hz A4 440 Hz A5 880 Hz
59. A4 440 Hz A5 880 Hz B4 C5 C#5 D5 D#5 E5 F5 F#5 G5 G#5
60. Note Frequency (hz) A 440.00 A̅ 476.67 B 513.33 C 550.00 C̅ 586.67 D 623.33 D̅ 660.00 E 696.67 F 733.33 F̅ 770.00 G 806.67 G̅ 843.33 A 880.00 A̅ B C
61. Note Frequency (hz) Frequency (hz) A 440.00 A̅ 476.67 B 513.33 C 550.00 550.00 C̅ 586.67 595.83 D 623.33 641.67 D̅ 660.00 687.50 E 696.67 733.33 F 733.33 779.17 F̅ 770.00 825.00 G 806.67 870.83 G̅ 843.33 916.67 A 880.00 962.50 A̅ 1008.33 B 1054.17 C 1100.00
63. http://github.com/stevekinney/octavian
71. Emits a keyDown event
72. Emits a keyDown event
73. keyDown event
74. keyDown event
88. keyDown event
91. keyUp event
94. synthesizer web browser Someone put a . in your
95. synthesizer web browser Someone put a . in your
96. +
98. Emits a facetrackingEvent
104. +
105. 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 0 C3 E3 G3 A3 C4 E4 G4 A4 C5 E5 G5 A5
111. +
118. Music is pretty awesome.
119. The web is pretty awesome.
120. Music and the web are even more awesome when their together.
122. http://github.com/stevekinney/making-music
123. Thank you. Twitter, Github, and like everything else: @stevekinney Slides and demos: http://github.com/stevekinney/making-music Be a mentor or hire our students: http://turing.io