Web Speech Api

by Javi Perez

La Plata Js

05/2016

Why speech?

Natural

Hands Free

No screen needed

No keyboard

No mouse

Magic - action at a distance

 

talk is cheap

It’s easy, almost effortless

Our preferred way of communicating

In fact, we love to do it all the time 

Some of us can’t stop 

The easiest form of work 

One of the first things you learn 

and probably the last thing you will do

ease of use

voice allows zero-click interface 

effortless 

No clicking, no typing, just say the magic words

No reading, just listen

voice commands

Very hard to do well

Frustrating for users

To reduce errors, we have to limit vocabulary 

The user has to know or guess the available commands 

Big penalty for getting a command wrong 

Errors in speech recognition cannot be avoided

User errors are also unavoidable

error correction

command line

  1. up arrow
  2. arrow left
  3. type over the error
  4. submit

voice

 

  1. repeat entire command until it is recognized

Web Speech Recognition Api

Now we can talk and get a transcript

Web Speech Recognition Api

Security notes

  • Pages hosted on HTTP need to ask permission each time they want to make an audio capture.
  • Pages on HTTPS do not have to repeatedly request access.
  • Previously authorised application can record audio without let you know.
  • All of the data is going to remote server and you can't know if somebody is listening.

Web Speech Synthesis Api

Now the browser can speak for you

play time!

Libraries & Tools

annyang! SpeechRecognition that just works

annyang is a tiny javascript library that lets your visitors control your site with voice commands.

https://talater.com/annyang/

 

<voice elements>

A COUPLE OF WEB COMPONENTS THAT CAN DO
AMAZING STUFF USING THE WEB SPEECH API

http://zenorocha.github.io/voice-elements/#recognition-element

Demos

Speech recognition demo

 

Speech Synthesis Demo

  • http://codepen.io/matt-west/pen/wGzuJ

Browser Support

Browser Support

Want to know more?

Keep in touch and ask for help

Recommended links

Web Speech Api

By Javier Perez

Web Speech Api

  • 694