Rabidgremlin's
Soapbox

Here are the next two videos in the series:

The rest of the videos can be found here

After much delay I’ve finally started recording a series of videos on creating a 2D game using Unity. Here are the first two videos. If you want to play the game then check out the Run Bunny, Run! website

Watch all the videos in the series here

Finally got over a cold so I could record part 2 of my tutorial :)

You can play the game here on the PICO-8 website

My first attempt at YouTube video/tutorial thing. Gonna try to get one of these done a week…

If you want to make games, Unity is a tool you should look at. It allows you to easily create games (both 3D and 2D) for a variety of platforms including Windows, Linux, Mac , Web , iOS, Android and Windows Phone. It also has a free version and if you ever need the pro version it is reasonable cheap to buy or subscribe to.

Check out some of the features in the upcoming version:

Here are some links to get you going:

• Unity download page
• Unity Asset Store – great place to find add ons and game assets such as art and music
• Tutorial: Creating your first Unity Android App – my tutorial
• Intro to Programming with Unity3D – a good set of video tutorials for those with little or no programming expirence
• Unity learning center – heaps of tutorials and access to documentation

Go Nuts and build the next Flappy bird!

Physics based games, especially on mobile devices have become de rigueur. It’s pretty amazing what can be done with some simply math.

I recently came across this game mechanics site which provides short examples of different game mechanics, algorithms and effects. Many of these are of course physics based and involve velocity.

Some of my favorites:

• Basic spaceship motion
• Lunar lander
• Artillery
• Flocking

Yay for maths and physics!

A few months ago, I had a group of friends over. Usually we just sit around and socialize, sometimes we play a board games or watch a movie but this time we did something different…. we played Artemis.

So what is Artemis? Well its a multi-player Starship Bridge Simulator where each player is assigned a different station (played on a PC or iPad) of a Starship Bridge. For instance there are helm, weapons, sensor, comms and engineering stations. One player is the Captain who gets to give the orders.

The aim of the game is to work together to complete Artemis’s mission.

Incredibly geeky I know and I wasn’t sure the group (especially the wives) would be into Atermis so after a couple of wines I floated the idea of trying out Artemis and showed them this video clip as an into…

Surprisingly everyone agreed to give it a go and so began the voyage of the plucky Artemis, her dysfunctional crew and their inept Captain.

Installation is pretty straight forward, after you purchase the software ($40 USD) you get an installer that run you on each of the player’s PCs (or laptops in our case). There is no licensing key and the developers rely on an honor system that you don’t share the installer outside of your 6 players. There are also a iPad and Android apps ($2.99 USD) that lets you use a tablet as a station.

One thing that you will need is one PC to act as the server. This PC also drives the view screen which lets the Captain see what is going on since they typically don’t have a PC (and as Captain you then get to yell out things like “Bring up Tactical on the view screen, Ensign Young”). My Dell Zino HTPC wired up to the living room 42-Inch LCD TV worked perfectly for this.

As a minimum you need three players to play: Captain, Helm and Weapons. Players can control more then one station but that often proves to be too tricky in the heat of battle. The game really shines when you have a full crew of 6 and all stations manned.

The game comes with a number of scripted missions but in its basic mode your mission is to just fend off waves of enemy ships that are trying to destroy you and your starbases. We have found that upping the difficultly level and setting the Sector setting to something other then “Barren” makes for quite an interesting game. You can also play in “Elite Co-Op” mode which lets a total of 6 ships (each with 6 players) play together which sounds like it would be awesome.

Over the last few months we have played with a number of different groups of people. I’ve been constantly surprised at how everyone gets drawn into the game (even the non Sci-Fi/geeky ones) and just how much fun it is. I would recommend that everyone give the game a go.

And just to set the record straight… the reason the Artemis was destroyed was that engineering did not fix the engines in time. It had nothing to do with the fact that I reversed the ship into the mine field we had just laid!

Update: Version 2.0 of Artemis was released last week and it features a ton of new features including:

• Updated UI
• Up to eight simultaneous bridges (48 players)
• Full-fledged PVP mode, where any number of sides and teams can battle each other
• Four new NPC non-combatant ships now ply the spacelanes, offering many new scenarios for Artemis crews.  These ships can be broken down, hijacked, blinded, held hostage, and more
• Major AI and pathfinding improvements
• Artemis ships play in real 3D now, with climb/dive controls (button, keyboard, and joystick).  Players can fly OVER a black hole, and come up underneath enemies

As this slightly over the top presentation shows adding motion, bounce and wiggle to your game elements can really make a game feel rich and alive:

Luckily this is easy to achieve with the GoKit tweening library that is included with Futile. The library allows you to easily change any property of an object over a specific period of time.

For instance this bit of code:

skyline.scaleY =0.1f;
Go.to(skyline, 0.75f, new TweenConfig ().     
      floatProp("scaleY", 1.0f).
      setEaseType(EaseType.BounceOut));

Sets the skyline sprite’s y scale to 0.1, it then uses the GoKit tweening library to scale the skyline sprite’s Y scale back to 1 over a period of 750ms with an ease of  BounceOut.

The effect of this is have the skyline spring out of the ground with a nice cartoony bounce. Adding some tweens to the title screen’s sprites like this:

private void AnimateIntro()
{
    bg.y = Futile.screen.height+70;
    bg.rotation = 10f;

    Go.to(bg, 0.5f, new TweenConfig ().
        setDelay(0.5f).
        floatProp("y", 0f).
        floatProp("rotation", 0f).
        setEaseType(EaseType.BounceOut));

    skyline.scaleY =0.1f;
    Go.to(skyline, 0.75f, new TweenConfig ().
        setDelay(1.0f).
        floatProp("scaleY", 1.0f).
        setEaseType(EaseType.BounceOut));

    title.scale = 0.001f;
    Go.to(title, 0.3f, new TweenConfig ().
        setDelay(1.5f).         
        floatProp("scale", 1.0f).
        setEaseType(EaseType.SineOut));

    nuke.scaleY = 0.001f;
    Go.to(nuke, 0.5f, new TweenConfig ().
        setDelay(2.3f).         
        floatProp("scaleY", 1.0f).
        setEaseType(EaseType.BounceOut));

    startButton.scaleY = 0.0f;

    Go.to(startButton, 0.5f, new TweenConfig ().
        setDelay(3.2f).
        floatProp("scaleY", 1.0f).
        setEaseType(EaseType.BounceOut));

    helpButton.scaleY = 0.0f;

    Go.to(helpButton, 0.5f, new TweenConfig ().
        setDelay(3.3f).
        floatProp("scaleY", 1.0f).
        setEaseType(EaseType.BounceOut));
}

Along with a tween to make the buttons disappear when we tap them on the game screen, gets us this:

So how exactly do these tweens work? Well it’s all down to some clever maths. The GoKit library implements what are known as the Robert Penner equations which are a set of equations that he published in a book called Programming Macromedia Flash MX. These equations can be used to produce organic feeling motions and change.

Basically these equations all take the form of a function that takes 4 parameters:

• t – current time unit
• b – the starting value
• c – the total change of the value over the duration
• d – the duration

The simplest of these doesn’t in fact result in any easing, it simply creates a linear motion:

public float EaseNone( float t, float b, float c, float d )
{
    return c * t / d + b;
}

Plotting this out on graph gives us this (with a starting point of 0, a change of 1, over 60 frames):

The bounce out equation is a bit more interesting:

public float EaseOut(float t, float b, float c, float d)
{
    if ((t /= d) < (1 / 2.75))
    {
      return c * (7.5625f * t * t) + b;
    }
    else if (t < (2 / 2.75))
    {
      return c * (7.5625f * (t -= (1.5f / 2.75f)) * t + .75f) + b;
    }
    else if (t < (2.5 / 2.75))
    {
      return c * (7.5625f * (t -= (2.25f / 2.75f)) * t + .9375f) + b;
    }
    else
    {
      return c * (7.5625f * (t -= (2.625f / 2.75f)) * t + .984375f) + b;
    }
}

Plotting this out looks like this:

Which is a much more interesting motion.

All in all there are 31 different eases in the library. This chart shows them all:

Next up I’m going to kick things up a notch and get the basic game play in place.

So I need to find some words, more importantly I need a list of words that gradually gets more and more difficult to guess.

So what makes a word hard to guess? Doing some research on the web turns up a couple of interesting posts such as this one and this one.

It turns out that short words are harder to guess, especially ones that have “non-obvious” letters. Thus words such as “jazz”, “jug”, “by” and “gym” are much harder to guess then words such as “deployments”, “historical” or “compartmentalised”.

The list of words I have decided to use scores each word based on the relative frequencies of letters in the English language.

So “jazz” scores: j(0.153) + a(8.167) + z(0.074) = 8.394.

Whereas “deployments” scores: d(4.253) + e(12.702) + p(1.929) + l(4.025) + o(7.507) + y(1.974) + m(2.406) + n(6.749) + t(9.056) + s(6.327) = 56.928.

Lower scores indicate words that are harder to guess when you have a limited number of turns.

Letter frequency for the English language – source Wikipedia

As the blog post points out this algorithm is not perfect “cup” scores 7.469 but “gym” scores 6.396. The reality is that if “_y_” is guessed ( players often work through the vowels and then onto “Y”) there isn’t a lot of options but “gym”. However if you guess “_u_” there is quite a lot of options besides “cup”. So actually “cup” should be a harder word to guess then “gym”.

However for my purposes this list will do very nicely. Unfortunately it’s 173528 words long which is a wee bit bigger then I need :) Also my design only allows me to display words with a length of 10 characters or less so I need to cull words longer then 10 characters as well.

Enter the pig

Apache Pig is something that I have used in the past when working with “Big Data” datasets. The word list isn’t exactly Big Data but Pig will happily suit my word list mangling needs.

First off I only want words that are between 2 and 10 characters. Next I only want a sample of the 173528 words. Lastly I want the list sorted from easiest to hardest. Here is my script:

allWords = LOAD 'allscores.txt' USING PigStorage() AS (word:chararray, junk, score:float);
lessThen10 = FILTER allWords BY SIZE(word) <= 10 AND SIZE(word) > 1;
shortList = SAMPLE lessThen10 0.02;

groupAll = GROUP shortList ALL;
wordsWithMaxScore = FOREACH groupAll GENERATE FLATTEN(shortList), MAX(shortList.score) AS maxScore;

wordsWithRatio = FOREACH wordsWithMaxScore GENERATE shortList::word AS word,shortList::score AS score,
                 maxScore, (shortList::score/maxScore) AS ratio;

ordered = ORDER wordsWithRatio BY ratio DESC;
justWords = FOREACH ordered GENERATE word;

STORE ordered INTO 'wordsAndScores' USING PigStorage();
STORE justWords INTO 'words' USING PigStorage();

This produces two files, one with the words, their scores and a calculated ratio (0 to 10) based on the words score vs the maximum score in the sample list of words (wordsAndScores):

tendrilous 66.33   66.33   1.0
breathings  65.555  66.33   0.988316
rediscount  65.087  66.33   0.9812603
inoculated  64.965  66.33   0.979421
atrophies   64.735  66.33   0.9759535
stewarding  64.582  66.33   0.9736469
tailenders  64.232  66.33   0.96837026
nonethical  64.048  66.33   0.9655962
authorized  63.564  66.33   0.9582994
destroying  63.537  66.33   0.9578923

The second file (words) contains just the words:

tendrilous
breathings
rediscount
inoculated
atrophies
stewarding
tailenders
nonethical
authorized
destroying

Each file contains 2477 words sampled out of the original list of 173k words.

I was initial going to use the ratio to group blocks of similar difficulty words together but have abandoned this idea. The plan is now to simply step through the list in random increments which will have the effect of gradually increasing the difficulty of the words during a game but not result into too many words repeating between games.

One problem with the list is that it contains words that are not in common usage for example “tendrilous” (adjective for “tendril”, a specialized threadlike leaf or stem that attaches climbing plants to a support by twining or adhering) and “kohlrabies” (plural of “kohlrabi”, A cabbage of a variety with an edible turnip like swollen stem). So I will need to manually groom the list at some stage :)

Loading the word list

Loading the word list in Unity is pretty straight forward. Firstly I copy the file into my project’s resource folder and name it words.txt, next I use the following code to load the words into a string list:

List words;

void LoadWordList()
{
    words = new List ();
    StringReader reader = null;

    TextAsset words = (TextAsset)Resources.Load("words", typeof(TextAsset));

    reader = new StringReader (words.text);
    if (reader == null)
    {
        Debug.Log("words.txt not found or not readable");
    } else
    {
        string txt;

        // Read each line from the file
        while ((txt = reader.ReadLine()) != null)
        {
            words.Add(txt);
        }
    }

    Debug.Log("Loaded " + words.Count + " words");
}

With the word list in place, I think I will next focus on getting the game’s screen flows sorted. Onwards and upwards!

_Update: _Click here for the next post in this series

So I’ve decided to knuckle down and build AND actually release a game. I read somewhere (probably Reddit) that publishing a development diary really helps on the motivation front. It sounds like a good idea so here we are :-)

Some constraints

First off to narrow my focus I have decided that:

• I will make a 2D game. My 3D modeling is OK but it takes a loooong time.
• My target is a mobile app. So distribution is taken care off.
• Android is my initial platform: I already have test devices and dev platforms
• I’m going to use the Unity3D platform. I bought the Android and iOS platform licenses a while back so I should really use them. Also its a very nice cross-platform tool.

Time

Nothing kills a side project like the distractions of everyday life. Luckily Mrs Gremlin suggested a few weeks ago that I earmark Monday nights for doing some game development. I’m taking her up on her offer. My wife is the best!

but Unity isn’t 2D…

No it isn’t but it handles lots of polygons which when textured and put on a plane equals lots of GPU accelerated sprites.

After digging around I found Futile. It’s new, has zero documentation but the intro videos and sample code looked good.

The developer also set up a Futile sub-reddit and he is very active on it. So I decided to give it a go.

I knocked together a shell of a space invader game using these neat graphics. Futile appears to do exactly what it says on the tin and it seems intuitive to use. Here is a short clip of my test project:

The pitch

Ok now for the elevator pitch:

The game is hangman with a time limit rather then guess limit. When a player guesses a word they are presented with a new one. The words the player gets to guess get progressively harder as the game goes one. The game has a time limit of 120 seconds with a progress bar incrementing towards game over every second. Each correct letter guess reduces the bar by 2 seconds. Each failed guess adds 1 second. Completing a word knocks off 10 seconds.

The game has a nuclear armageddon theme. The progress bar is broken up into DEFCON levels 5 to 1. The game is named “Word War III”.

Kick off

First up I sketched out some screen flows and layout ideas. Things like high score tables etc can come later:

Mrs Gremlin offered to build a title page for me (using Illustrator) and I knocked up the game page to test out the layout of the letter keys. I’m normally create game graphics using Inkscape which is vector based, this allows graphics to be easily scaled and resized as things develop. Here is the title page and the game page layout test:

The fonts are Passion One and Hand of Sean. Unfortunately it looks like the license for Hand of Sean has recently changed and it is no longer free so I’ll need to find a replacement for it.

Using BMFont I created some font atlases and then used TexturePacker (I bought the Pro version) to pack all the assets into the following atlas:

One issue I had is that I failed to export the font images as 32bit images. This caused all sorts of weirdness when TexturePacker created the atlas.

Also Futile spat the dummy when tring to load the smaller of the font sets. Some array index out of bounds error that I haven’t had time to track down.

Next I got down to some actual coding using the FSprite, FLabel and FButton classes I created the game screen. Testing on a actually device showed that my buttons were too small. Mrs Gremlin also pointed out that the keys should laid out in a QWERTY fashion. Some more tweaking and I ended up with this:

Not a bad start for a few hours of work.

Update: Click here for the next post in this series