Only Connect Missing Vowels Game

On a recent edition of Only Connect Series 10, Episode 12: Coders vs. Romantics there was a team called ‘Coders’ whose team members were described such:

• Richard, a software engineer…
• Zoe, a managing director…
• Captain, David, a software developer…

Victoria Coren Mitchell then continued with the initial interchange

VCM: "United by a soft spot for software, they are the Coders. You lost to the Gamesmasters in your first heat. Have you developed some software to make sure that you win this one?"
David: "We did try to find some software online to see if we could win, but the only missing vowels apps out there are only suitable for three-year-olds.

"If the words like 'pig' and 'hat' come up, I think we will be sorted."

Now, I found it ironic that they are called coders, they have a self professed soft spot for software and there is an engineer and developer on the team yet they looked for missing vowel games? This triggered the following conversation between my wife and me

Me: "If they are coders why don't they just write a program to test themselves"
Wife: "yeah... can that be done"
Me: "oh yeah, it'd be super easy to do the missing vowels game"
Wife: "can you write one?..."

I should add at this point that my wife’s favourite part of the show is the missing vowels round, her opinion of OC is that it’d be great if the whole show was missing vowels. I’d just told her that to create that game would be super easy and she set me a challenge.

So, here is the discussion of the result :)

Design

The main premise of the missing vowels game is that a word is presented on screen with all the vowels removed, if the word contains spaces then they are relocated within the answer for example:

FRD = FORD  
L PHRM = ALPHA ROMEO

In the first example only the letter O is removed, in the second example A, E and O are removed and the space relocated behind the L.

As well as implementing the above algorithm I also wanted the ability to add new categories easily, for this reason I chose to store the data in JSON files in a directory that is scanned on instantiation, this keeps the program small and simple.

V1

The initial implementation of the program was in Java, this is primarily because I was writing the software on the train on the way home and as other West Coast Mainline users will know internet access is poor, therefore I wasn’t able to download dependencies with other technologies.

At the end of the journey I had a working version of the application which I could show my wife to get her ‘customer’ reaction.

Please see the GitHub project for the source.

Categories for the game are stored in separate JSON files, a list of JSON files is generated and a random file chosen, this is read in using Jackson. Each category has an ID, a display title and a number of answers e.g.

{
"id":"capital_cities",
"display":"Capital Cities",
"answers":[
    "Abu Dhabi",
    "Abuja"
]
}

Within the application a random answer is chosen and passed through a processing method, this strips the word of vowels, rejigs spaces and returns to the calling method. The user receives the scrambled text and presses enter when ready to go onto the next word, the answer is then displayed along with the next processed word.

Here is a small example of the output:

Categories and their words will be presented, press enter for the answer and  or the next clue

British PMs Since 1900
MRGRT THTCHR
Margaret Thatcher

JM SCLLGHN
James Callaghan

CLMNTT TL

In general V1 was well received however the limitation of having to use the command line and run on a JRE meant that the customer experience wasn’t brilliant, this was expected. My wife then gave me the next set of requirements… “it’d be great if I could play this on my phone”

V2

The simplest way to allow the game to run on the phone was to turn it into a website, this would make the game platform agnostic, and it also meant I needed to work using a client/server paradigm so that the phone can contact a server as html etc cannot be saved locally. Initially I thought about using Spring or Wicket but then decided that JavaScript technologies would make quicker development, smaller server footprint and would allow me to learn a few things.

The technology stack I decided on was:

• Node.js - run time for server side JavaScript
• Express - server side node package to simplify routing and provide support for templates; can easily create a server
• Bootstrap - client display library, provides an easy way to define layouts which are adaptable for multiple form factors

The JSON files were reused from the java project and many of the Java methods were turned into JS functions.

Please see the GitHub project for the source.

With the web version of the game the user is presented with a page that contains a scrambled work and a button, pressing the button reveals the answer and pressing the button again presents the next scrambled word. For each category, 5 random words are chosen and once all categories have been processed the application starts again with all categories and the next chosen at random.

This is the scrambled word screen

Pressing show presents the reveal screen

Pressing next presents the next word again

V3

This is a potential work in progress, my wife has more requirements and I have a few ideas, these include:

• Checklist of available categories to choose from instead of just scrolling through all categories all the time
• Install on my QNAP for easy access from multiple clients
• Store categories in a database, probably Mongo (even though the scale isn’t needed)
• Add better logic for deciding on the next word, would probably want to use a bloom filter to see if a word for a category has already been used before