Over a million developers have joined DZone.

Playing Space Invaders With Your Own Voice

DZone 's Guide to

Playing Space Invaders With Your Own Voice

We look into how to get a machine to recognize your voice by using JavaScript.

· AI Zone ·
Free Resource

Natural Language Processing and Games

After some time testing voice games in my Alexa device, one question came to my mind...

Why not try to convert a classic game control system to a Voice User Inteface?

So let's do a simple experiment with a Space Invaders written in JavaScript.

Final Result (Kind of)

\After some walkarounds I made a requirement list in order to reach my target:

Well, once I was more or less clear on what I was looking for, I use the second most important engineering lesson: don't reinvent the wheel. So, once again I did some research with Google and it led me to something called Woice.

Once I went through the tutorial for creating a new application, I charged the SDK script on my HTML and drew a few lines of code over the space invaders control system.

These lines can be explained in three concepts: Handler, Instance, and Speech Recognition Trigger.

The first concept is the Handler which is composed of two functions: canHandle, which dictates if the code of the second function, handle, should be executed or not.

I know, it's easier if we have some tangible code to look at:

var moveRightAction = {
  canHandle: (handlerInput) => {
    if (handlerInput.isIntent('moveRight')) {
  handle: (handlerInput) => {
    GlobalActionState.RIGHT = true;

The code above is as simple as this: when we match the intent (moveRight) in the Dialogflow agent (this is Woice's supported NLU), we trigger GlobalActionState.RIGHT = true.

The second concept is the instance — once we have defined our handlers we are going to build a Woice instance with these.

var Woice = window.woice.DriverBuilders.config()
  .addActionHandlers(moveRightAction, moveLeftAction, FireAction, PrintTransciption)
  .connect('f608ceeabb8237e83019cefc47a41b65', 'woice-invaders')

And the last one, we are going to attach a Speech Recognition Trigger.In this case, we associate this event to the control+B keyboard combination.

document.addEventListener("keydown", function (zEvent) {
  if (zEvent.ctrlKey && zEvent.code === "KeyE" || zEvent.ctrlKey && zEvent.code === "KeyB") {
    // active speech recognition

And the final and editable results are:


It's definitely not the best use case (gaming requires real-time action, so it's not really suited for voice) but, on the other hand, I played more times tham I would like to admit.

If you have any questions, reviews, or simply a project you want to share with me I'd be happy to hear from you!

ai ,voice assistant ,games ,javascript tutorial

Published at DZone with permission of

Opinions expressed by DZone contributors are their own.

{{ parent.title || parent.header.title}}

{{ parent.tldr }}

{{ parent.urlSource.name }}