Brain Games

An online multiplayer puzzle solving game, on Alexa!

Comment

Inspiration

Ever since we started making skills, we had visions of creating a online multiplayer voice game, games are best enjoyed with friends and family and we wanted to make this a possibility, even if you aren't together.

What it does

Brain Games is an online multiplayer voice puzzle game. Here's all the things you can do within:

  • Create and edit to 4 custom user profiles, each with unique nicknames, and outfits and rankings.

Choose from 4 minigames:

  • Maths Master - Use numbers and operators to make the randomly generated number at the top.
  • Anagram Magic - Find the longest word possible in a 9 letter anagram.
  • Word Wheel - Find as many words as possible, using letters from the word wheel - you have to use the middle letter in the wheel!
  • Speedy Sums - 1000 BrainBucks - Solve as many mathematical questions as you can against the clock.

Earn Brain Bucks to spend in the Brain Games store to unlock new outfits and games! Buy them through the Brain Buck Bundle ISP. Earn them buy playing and winning the minigames.

How I built it

The visual interface was built using vanilla HTML and CSS, all being hosted on an Azure app service plan.

We found some really great 3rd party libraries:

  • anime.js - this was the power behind all the animation in the game.
  • Colyseus - this is a Node framework for multiplayer match making, this provided utilities to match players against each other in real time.

To interact back between the site and the skill, we used the HTML WebAPI, we used the following commands:

  • alexa.skill.sendMessage - send messages back to the skill
  • alexa.skill.onMessage - detecting messages being sent from the skill to the site
  • alexa.speech.onStopped - listener to see if alexa has stopped speaking

We used the ASK-SDK for general skill management and deployment, this had a pretty standard setup, with the skill being hosted through an AWS lambda function, with audio and imagery stored in AWS S3 buckets and persistent user data being stored in DynamoDB.

Challenges I ran into

A hurdle we had to overcome was speech clipping. This is when Alexa's speech suddenly cuts off mid sentence.

Our WebAPI code was sending multiple messages back to the skill, each message instructed Alexa to play a speak command. However, since the timing between message sent was too short, the next message would cut off.

To fix this we created a "messageQueue". Our site would have a constantly running SetInterval function, that would check if the message queue was populated. If there was a message, and Alexa had stopped speaking (alexa.speech.onStopped). We would send the message!

Accomplishments that I'm proud of

The way we setup custom characters was quite cool. On first play when your character is created, it will render loads of layers of the different image components over each other, i.e. eyes => ears => mouth => hair (always last!).

We discovered the inefficiency of rendering layers over and over every single play, so we came up with a solution.

We draw your avatar layers onto a canvas and then save the image using the method toDataURL to store the image in our DynamoDB, so the next time you play we don't have to render all those layers again.

What I learned

Our main learnings in Brain Games has been from the voice flow perspective.

Initially we had a long setup phase which involved the user having to go through 10 different sections choosing items for their character.

We back traced some game state logs and found that users were dropping off a lot in this stage. We changed it to be a "shuffle" of random outfits, in doing this we saw a large increase in players getting the lobby and playing some games.

What's next for Brain Games

These are on our roadmap for Brain Games...

Enhancing competition:

  • Add leader boards to track player rankings through Amazon GameOn
  • Add friends list functionality, this would allow you to play against your friends, instead of random opponents

Localisation:

  • Expanding into more countries would be great, we're only covering English speaking locales at the moment. However there are more obstacles here rather than just converting the language, the subtleties of Japanese syllabary would make Anagram Magic quite difficult!

Built With

Share this project:

Updates