201314Mai

Timbre.js: Klangsynthese mit HTML5 im Browser

Das virtuelle Erzeugen von Tönen durch Synthese ist im Web nicht mehr nur durch Flash (z.B. Audiotool) möglich. Auch HTML5 ermöglicht dank der Web Audio API das Generieren von Wellenformen mittels Oszillatoren. Durch die Frequenzen mehrerer Oszillatoren ist also die Frequenzmodulationssynthese möglich, wodurch sich variierende Töne und Melodien erzeugen lassen. Mit der JavaScript-Bibliothek Timbre.js stehen für den Bereich der Audio-Programmierung komfortable Werkzeuge bereit.

Timbre.js - JavaScript Library for Objective Sound Programming

Timbre.js bildet also die Brücke zur Web Audio API und bietet eine einfache Schreibweise an:

  • T("sin", {freq:880, mul:0.5}).play();

Das Framework bietet neben dem Erzeugen von Tönen auch etliche Filter (Chorus, Delay, FFT, Equalizer, Phaser, usw.) an. Weiterhin können Audio-Dateien verarbeitet und sogar in Einzelteile (Beat Slicing) zerlegt werden, um sie dann in einer neuen Reihenfolge zusammenzusetzen. Das Beatbox-Beispiel zeigt dieses Szenario.
Auf der Seite der Vorgängerversion v12 finden sich weitere Beispiele.

UPDATE
Mit dem WebSpeechShim steht übrigens ein Shim für die WebSpeech-API von HTML5 bereit, der inzwischen als GitHub-Repository vorliegt.

Kommentare

1UnitedPower schrieb am 15.05.2013 #1

Die Web Speech API, wegen der Googles Chrome neulich erst aufsehen erregte, bietet auch Möglichkeiten Texte mit synthetischen Stimmen vorlesen zu lassen. Sie wird derzeit leider von keinem Browser unterstützt, aber ich arbeite an einem Shim (https://c9.io/1unitedpower/webspeechshim).

Matthias schrieb am 15.05.2013 #2

Interessant, einen Shim dafür zu entwickeln! Das sieht ja bisher vielversprechend aus. Bitte um Info, wenn es fertig ist :-)

Update: Dirk Krause hat den WebSpeechShim von 1UnitedPower (s.o.) als GitHub-Repository angelegt. Ich hoffe, das Projekt geht weiter :)