Chrome Keyword Detection with Annyang

Recently I’ve been working a lot with continuous speech recognition and keyword detection in Google Chrome. Several months ago I found a really great library for streamlining is the process, a library called annyang.

Continuous speech recognition is an amazing tool that is currently only available in Chrome. Most of the time it’s easy to use and is very accurate depending on the quality of your microphone. However, the problem I have been running into is it doesn’t natively support keyword detection.

If you have ever used Ok Google you know how useful keyword detection is, but that is only one use case for keyword detection. Conceptually a developer could make their entire website keyword intractable using the Chrome continuous speech recognition system, if only keywords could be detected and acted on.

This is where annyang comes excels. It provides a simple to use API interface for keywords detection and better yet annyang allows you to detect keywords in a more programmatic way.

A developer can define certain keywords in a string of larger detected keywords as optional by wrapping them in parentheses as show below. This is great for making applications more natural to talk to.

var commands = {
	// "say hello to my little friend" as well as "say hello friend"
	'say hello (to my little) friend' : function() {
		// blow up cockroaches
	}
};

annyang.addCommands(commands);

annyang.start();

Annyang also provides a way of passing part of the string spoken (called an utterance) to the callback function. Tal Ater, the developer of annyang, calls these a “splat”.

var commands = {
	// e.g. saying "Show me Batman and Robin" is the same as calling showFlickr('Batman and Robin');
	'show me *term' : function() {
		// do something
	}
};

annyang.addCommands(commands);

annyang.start();

These can be combined as well which is a great way of processing spoken requests.

Annyang does have some drawbacks. Because it creates a higher level API around the Chrome speech recognition system you don’t get as much lower level control. This also makes the responses returned slightly slower than if you were to use the lower level system. However, the simplicity annyany provides is more than enough to compensate for any faults it has.