Web Speech API

Web Speech API

52a875784c4e4ce4fc57ee28bd190dfe?s=128

Pascal Helfenstein

March 04, 2015
Tweet

Transcript

  1. Web Speech APIs

  2. $WHOAMI I am Pascal Helfenstein nicam

  3. Why speech?

  4. None
  5. None
  6. What do we need?

  7. Speech Recognition Speech Synthesis “It can talk” “It can hear”

    Some Intelligence “It can think”
  8. The browser can do it!

  9. How does it speak? var msg = new SpeechSynthesisUtterance('Hello World');

    // Config (optional) msg.voice = 'Google UK English Male'; msg.volume = 1; // 0 <-> 1 msg.rate = 1.5; // 0 <-> 1 msg.pitch = 1; // 0 <-> 2 speechSynthesis.speak(msg);
  10. How does it listen? var recognition = new webkitSpeechRecognition(); //

    Config (optional) recognition.lang = "en-US"; // "de-DE", "en-IN" recognition.continuous = true; recognition.interimResults = true; recognition.addEventListener('result', function(event) { console.log(event.results[0][0].transcript); // "whats the time" console.log(event.results[0][0].confidence); // 0.93414807319641 }); recognition.addEventListener('end', function(event) { // Start your action }); recognition.start();
  11. How does it think? \_(ツ)_/¯

  12. Ask \_(ツ)_/¯

  13. DEMO

  14. WebSockets API Calls Demo architecture Speech Recognition Speech Synthesis

  15. Browser Support

  16. None
  17. None
  18. What to look out for • interactivity requires SSL… •

    synthesising long texts breaks it • it’s not good in noisy environments
  19. Questions?

  20. Thanks!