Skip to content

Sprachausgabe im Browser: Das Speech Synthesis API

Geschrieben von Matthias Gutjahr am

Die neuesten Browser-Versionen von Googles Chrome (seit Version 33) und Apples Safari (seit Version 7, hier eine Übersicht der Browser-Kompatibilität) unterstützen das Speech Synthesis API. Dabei handelt es sich um ein Web API zur Sprachsynthese. Das heißt grob: Der Browser kann Texte mit einer menschlichen Stimme vorlesen.

Google Chrome hat aktuell zehn Sprechstimmen in neun Sprachen integriert: Neben einer britischen Frauen- und einer britischen Männerstimme, jeweils eine Frauenstimme, die amerikanisches Englich, Spanisch, Französisch, Italienisch, Deutsch, Japanisch, Koreanisch und Chinesisch spricht. Eine Liste der angebotenen Stimmen gibt die Methode getVoices() zurück.

window.speechSynthesis.getVoices();

Update: Rene Kriest hat mich darauf hingewiesen, dass die getVoices()-Methode asynchron funktioniert, und auch gleich ein Code-Beispiel geliefert.

Hallo Welt

Soll ein Text als gesprochen Sprache ausgegeben werden, muss zunächst eine "Äußerung" (utterance) erstellt werden. Dieses Objekt kann über weitere Eigenschaften konfiguriert werden, beispielsweise wird hier die Sprache gesetzt:

var hallo = new SpeechSynthesisUtterance("Hallo Welt.");
hallo.lang = "de-DE";
window.speechSynthesis.speak(hallo);

"Sprachausgabe im Browser: Das Speech Synthesis API" vollständig lesen

Recursive Drawing

Geschrieben von Matthias Gutjahr am

Vor einer Woche ist GIMP 2.8 mit dem von vielen ersehnten Ein-Fenster-Modus (und jeder Menge weiterer toller Features) erschienen. Aber das nur am Rande, denn hier soll es um ein innovatives Grafikexperiment gehen, das im Browser stattfindet.

Recursive Drawing ist ein beeindruckendes Zeichentool auf HTML5-Basis. Sprichwörtlich mit wenigen Mausklicks ist es möglich, sehr interessante Effekte zu erzielen. Ohne überhaupt selbst zu versuchen, das Prinzip dahinter zu erklären, verweise ich auf das folgende Video:

Recursive Drawing from Sundialtone on Vimeo.

Am besten probiert ihr das Tool im Anschluss einfach selbst aus. Leider lassen sich die erzeugten Kunstwerke aktuell weder speichern noch exportieren oder verlinken. Aber da der hauptsächlich auf CoffeeScript basierende Quellcode auf Github liegt, dürfte das nur eine Frage der Zeit sein.

Danke an @krahe fürs Finden.

Datenschutzerklärung / Impressum