Subscribe to GameFromScratch on YouTube Support GameFromScratch on Patreon

29. June 2016

 

Welcome to a new tutorial series here on GameFromScratch.com where we will be looking at core concepts of game programming.  This includes data structures, design patterns and algorithms commonly used in game development.  We start the series off with Finite State Machines.

 

There is an HD video version of this tutorial available here and embedded below.

 

What is a Finite State Machine?

 

A Finite State Machine (or FSM for short) is one of those concepts that sounds much scarier than it actually is.  In the simplest form it’s a datatype that can have only one value (state) from a finite selection of values(states).  The easiest way is to understand the finite state machine is to look at a real world example.

 

trafficLight

 

Yep, a traffic light is a perfect example of a FSM, or at least, the logic controlling it is.  Consider the three possible states this particular traffic light can be in.  At any given point (assuming I suppose the power is working...) the light will be one of three states, red, yellow or green.  It can never been more than one of those states at a time, it’s always red or yellow or green.  These are the two keep concepts of a finite state machine.  There are a finite number of states ( 3 in this case ) and only one is true or active at a time.

 

It’s a very simple concept, but extremely useful in game development.

 

What are FSMs Used For?

 

In game development, one of the most common uses for finite state machines is artificial intelligence.  Consider the example of PacMan’s ghosts.  A state machine can be used to control how they behave.  A ghost may have one of several different operating modes for example waiting to be released, hunting, hunted and dead.  The state machine is what is used to drive the ghost’s actions and to switch between states.  You will find AI examples absolutely loaded with state machines, often with some fuzzy logic controlling the transition between states to give a layer of unpredictability to your characters.

AI isn’t the only place of course, think of all the different things in a game that are related, there are multiple different states they can be in, but only one can be active at a time.  Game states are a very common example, where you break your game up into a series of states, for example Loading, Main Menu, Playing, High Score, Exiting.  Many game engines ( one such example is Phaser ) split your game up into a series of states.  The ultimate controller of these states is a finite state machine.  A sequential UI ( think of a sequence of dialogs controlled by next/back buttons ) can also be implemented using FSMs.  They are also commonly used to control elements in a games world.  Consider a game with a weather system, be it day or night cycles or season cycles like Spring, Summer, etc...  these would most likely be controlled via FSMs.

 

Implementing a Finite State Machine

 

The example we are going to use here is to implement a traffic light via FSM.  At it’s core the data is going to be stored in an enum, a natural fit for state machines, but stack based or array based options are also viable.  This example is not only going to switch the traffic lights periodically, it’s also going to implement callbacks so the world at large can interact with the light.  This example is implemented using C#, but should be easily adapted to most modern programming languages.

 

using System;

namespace GameFromScratchDemo
{

    public class TrafficLight{
        // This enum represents the three possible values our state machine can 
        be
        public enum States { Green, Yellow, Red };    
        // This is the amount of time for the timer to wait before changing 
        between states
        private const int LIGHT_DURATION = 5000;

        // An actual instance of our enum.
        private States _state;

        // The timer object that is going to be used to switch between states 
        private System.Threading.Timer _timer;

        // This function is called by the timer when it's time for a light to 
        change
        public void lightChanged(){
            System.Console.WriteLine("Light Changed");
            
            //  For each state, move to the next appropriate state.  I.e, red 
            becomes green, etc. 
            switch(_state){
                case States.Green:
                _state = States.Yellow;
                break;

                case States.Yellow:
                _state = States.Red;
                break;

                case States.Red:
                _state = States.Green;
                break;
            }

            // Reset our timer, so this will all happen again and again
            _timer.Change(LIGHT_DURATION,System.Threading.Timeout.Infinite);

            // Call our event.  This is used to communicate with the outside 
            world that our state change occured
            onStateChange(_state);
        }

        // In our constructor we simply set out default state (green) and 
        create/start our timer
        public TrafficLight() {
            _state = States.Green;
            System.Console.WriteLine("Light Created with initial Green state");

            _timer = new System.Threading.Timer( _ => lightChanged(), null, 
            LIGHT_DURATION,
                System.Threading.Timeout.Infinite);
        }

        // these two work together to provide the callback functionality
        // Implementing callback is going to differ greatly from langauge to 
        language
        public delegate void StateChangedResult(States newState);
        public event StateChangedResult onStateChange;
    }

    // Our actual program.  Simply create a traffic light instance
    // Register a callback that will simply print the current state returned 
    when the light state changes
    // And finally wait for the user to hit enter before ending the program
    public class Program
    {
        public static void Main(string[] args)
        {
            TrafficLight light = new TrafficLight();
            light.onStateChange += (TrafficLight.States state) => { Console.
            WriteLine(state); };
            Console.ReadLine();
        }
       
    }
}

The example is pretty well documented in the code above.  Essentially we are creating a class TrafficLight that can internally have one of three states Green, Yellow or Red.  It also implements a timer that switches between those states.  To make the code actually useful, it also implements a callback system so code external to the TrafficLight can interact with it as a black box.  The callback will be passed the current state value every time the light changes.

 

This is obviously a simple example of a state machine but the same basic premise remains regardless to complexity.  It is a very useful data structure for organizing code, especially the flow of logic.  Coupled with callbacks, it is also a great way of keeping systems decoupled as much as possible.

 

The Video

Programming, Design , ,

23. November 2015

Infocom logo.png

Today over 4000 documents from Infocom were released on archive.org as the Infocom cabinet.  This collection of documents contains reams of design information from many classic text adventures including:

  • Planetfall
  • Sorcerer
  • The Hitchhiker’s Guide to the Galaxy
  • A Mind Forever Voyaging
  • Leather Goddesses of Phobos
  • Stationfall
  • Zork Zero

 

From the blog post announcing the release:

During the production of GET LAMP, I spent a lot of time digitizing or photographing all sorts of artifacts and documents related to Interactive Fiction and text adventures. This included books, advertisements, printouts, and various ephemera that various players or programmers had lying around from that era. This would usually involve one or two ads, maybe a map or two that someone had drawn, and one or two photos snapped at a convention.

But not in the case of Steve Meretzky.

If you’re coming into this relatively new, or even if you need a little brush-up, let me state: Steve Meretzky has earned the title of “Game God” several times over, having been at the center of the early nadir of computer games in the 1980s and persisting, even thriving, in the years since. He continues to work in the industry, still doing game design, 35 years since he started out as a tester at what would become Infocom.

But more than that – besides writing a large amount of game classics in the Interactive Fiction realm, he also was an incredibly good historian and archivist, saving everything.

EVERYTHING.

When we finally connected during production (as it turned out, we lived within 10 miles of each other), Steve showed me his collection of items he had from the days of Infocom (which spanned from roughly 1981 through to the company’s eventual closing and absorption by Activision in the early 1990s). And it was a hell of a collection

It’s of questionable use today, game design has changed a great deal, but the huge volume of information is nothing if not interesting!

GameDev News

15. November 2015

 

Just published a new quick tutorial to YouTube on retopology in Blender.  Besides being a word that spell checkers despise, retopology is the art of creating a low resolution mesh by drawing over top of a higher resolution version.  This quick video tutorial shows the process in Blender using model snapping and the shrinkwrap modifier.

 

The 1080p version is available here.

Art ,

24. April 2014

 

This post actually came about by accident.  I’ve been playing around with Telerik’s recently open sourced Kendo UI suite and I found myself needing a web back end.  Of course I could have used my own server, but every time you do something like that you open up another potential security concern.  Ages ago I did an HTML5 tutorial where I used a free version of Heroku Node hosting and a CouchDB back end, but truth is, it was kindof a pain in the ass.  This time I decided to take a look at the state of Azure and see if it was an appropriate option.

 

So what exactly is Azure… well, that’s a confusing thing to answer.  Basically it’s Microsoft’s ____________ as a service offering.  In the ___________ you can insert the words platform, database, cloud, etc.  Basically it’s a number of cloud based offerings, from straight VM based hosting like Amazon’s EC2, to a cloud based SQL server.  What we are most interested here is “Mobile”, which is a scalable back end for mobile software and websites.  This is a way for you to deploy your code to the cloud and let someone else worry about the infrastructure, scaling, backups, etc.  It is most similar to solutions like Heroku and Google App Engine, it straddles the point between running your own servers and using a prebuilt gaming solution.

 

This article looks at Azure for smaller mobile or HTML5 games.  Things like scoreboards, matchmaking, cloud saves, that kind of thing.  If you are looking at creating a server heavy game such as an MMO you need to look elsewhere, like here.

 

So, why Azure Mobile?

  • no server to maintain
  • easy scaling
  • a free tier is available for just getting started
  • it’s pretty cheap ( relative term of course )
  • it’s Microsoft.  They’ve literally spent billions creating Servers. Bandwidth and uptime should never be an issue
  • it’s not Google.  Every time I use a Google technology like App Engine, I want to punch a donkey
  • JavaScript and now, C# backends
  • Visual Studio tooling support
  • Authentication and Notifications built in ( Google, Twitter, MS, Facebook, etc… ).  Normally a huge pain point
  • As hard as it is to believe, they are probably better at security than you

 

Why not?

  • JavaScript/C# only… want Rails for example, Mobile isn’t for you
  • Can be confusing as hell.  Documentation isn’t as good as it should be
  • Visual Studio…  some people hate it.  It’s clearly easiest working in VS, but VS can be a daunting beast
  • It’s Microsoft, for some people this is a huge negative.
  • Less control

 

So… Costs?

 

First thing you have to head over to http://azure.microsoft.com/ and sign up.  A bit of a warning, you need to sign up and give a valid credit card, but you don’t have to pay anything.  When prompted select a Pay As You Go plan.  Oh yeah, costs, like talk about that for a minute:

 

image

 

Oddly enough, changing the region has no effect on the price.  So basically you can start for free for up to 1/2 million calls per month from 500 devices and a total of 20MB of data.  At the free tier you can have up to 10 different “services”, which considering a service can have tons of API calls, isn’t really a major limit.

When you jump into the “pay” tier, you are looking at 27$ a month per “unit”.  A unit is a theoretical computing unit, for which I couldn’t for the life of me find the definition of ( in Amazon, it is strictly defined as for example 1x 1.7ghz core, 768MB RAM, etc… ) anywhere.  API calls are tripled up to 1.5M per unit.  As you can see, the BASIC tier is the first one that allows you to start scaling up performance as needed.  So if your site is getting slammed, you can crank the processing power up to 6X the base.  Perhaps the most important aspect is there is no longer any device limits… so if you have 10 users or 10 million, same price for you.  Standard basically 10X’s the resources but at about 8X the price.

 

So, what about data costs?  20MB is obviously a pretty small amount, what’s this cost?  This is pretty straight forward as well:

 

image

 

So basically > 20MB and < 100MB is $5.27 a month.  Then another $5.27 to raise that cap to a GB, then basically a lowering amount for each additional GB as you add more, eventually settling at about 1$ a GB a month.  Trying to do direct pricing comparison to Amazon is tricky, as the bill in a completely different manner.  For example, storage for their RDS MySQL hosting is only 12.5 cents a GB however you pay for processing, transactions, etc.  Frankly it was the confusion of Amazon pricing that lead me to choose SoftLayer ages ago.

 

Creating a Mobile Services service

 

Everything is managed from the Azure portal and for the most part it’s pretty straight forward.  Its located at http://manage.windowsazure.com

image

 

All your various Azure services, websites, databases, etc… are available down the right hand side.  For now we just care about Mobile Services.

To get started, Click the Mobile Services tab then the + NEW in the bottom left corner.

image

 

Now simply click Create

image

 

The process is about as easy as it gets.  You need to select a unique ( across Azure, not just your projects ) prefix for the URL.  The key question is what kind of Backend you want, JavaScript or .NET.  I personally like .NET so that is what I am going with.

image

 

Finally you configure your database settings and then you are done:

image

 

Enter Visual Studio

 

Now head back to the Mobile Services tab if it doesn’t take you there automatically.  Now you want to select an App type ( it really doesn’t matter ), then download the project file.

 

image

 

The download file is simply a Visual Studio solution coupled with a NuGet install.  Extract the archive then double click the sln file to open it in Visual Studio.  Don’t worry, this works fully with the free version of Visual Studio if that’s what you’ve got.

It should look something like this:

image

 

Don’t worry, it’s nowhere near as complicated as it looks.  By default the project comes with a working value TodoItem.  You can go ahead and run your Mobile Service, it works 100% locally, which is kinda cool.  Press F5 and you will see:

image

 

Click Try it out and you will see the scaffolding it created for you:

image

Pretty cool.  Keep in mind, HighScore was created by me, so you wont have that. 

 

Mobile Services works just like any typical RESTful service.  You make a request using URLs, for example http://localhost:51289/tables/TodoItem (your port number will vary!) returns:

image

While http://localhost:51289/tables/TodoItem/1 returns the TodoItem with the id 1, like so:

image

Of course a complete description of REST is wayyyyy beyond the scope of this tutorial.  For more details IBM did a pretty good job explaining them, but there are hundreds of similar documents on the web.

 

Finally some freaking coding

 

Now let’s add our own service.  First let’s create a Controller.  A controller is basically what maps a URL to an action.  In your solution, right click the Controllers folder, select Add and Controller, like so

image

 

Select Web API 2 Controller – Empty

image

Then click Add.

 

In the dialog, name it.  This is going to be about the easiest controller you’ve ever seen in your life.  The Hello World of web services.

image

Now let’s look at some code:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Net;
using System.Net.Http;
using System.Web.Http;

namespace arghService.Controllers
{
    public class HelloController : ApiController
    {
        public string Get()
        {
            return "Hello World from GET request";
        }

        public string Post()
        {
            return "Hello world from POST request";
        }
    }
}

 

Now if you request /api/Hello/ either via POST (form) or GET (url), it will return a Hello string.

 

Of course, this example isn’t really all that useful, let’s try and create a more useful service, a simple high score board.  First we need a datatype to store our highscore’s in.  Simply right click the Models folder and select Add->Class…

image

 

Name it HighScore.cs and click Add.  Add the following code:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;

namespace arghService.Models
{
    public class HighScore
    {
        public int Id { get; set; }
        public int Score { get; set; }
        public string Name { get; set; }
    }
}

 

Now add a new Controller, just like before.  This time call it HighScoreController.cs.  Let’s take a look at some code:

 

using System;
using System.Collections.Generic;
using System.Linq;
using System.Net;
using System.Net.Http;
using System.Web.Http;
using arghService.Models;
using Microsoft.WindowsAzure.Mobile.Service.Security;

namespace arghService.Controllers
{

    public class HighScoreController : ApiController
    {
        public static List<HighScore> scores = new List<HighScore> {
            new HighScore {Id=1,Name="Mike",Score=42},
            new HighScore {Id=2,Name="Bob",Score=43}
        };

        protected override void Initialize(System.Web.Http.Controllers.HttpControllerContext controllerContext)
        {
            base.Initialize(controllerContext);
        }

        public IEnumerable<HighScore> GetAllHighScores()
        {
            return scores;
        }


        [HttpGet]
        public IHttpActionResult GetHighScoreByName(string name)
        {
            var score = scores.FirstOrDefault((s) => s.Name == name);
            if (score != null)
                return Ok(score);
            return NotFound();
        }

        public IHttpActionResult PutHighScore(HighScore highScore){
            scores.Add(highScore);
            return Ok();
        }
    }
}

 

Run this code and then in the generated help page you will now see:

image

Click the PUT api/HighScore link and you can test your new service out clicking the Try This Out link.

image

 

Now try out the GET api/HighScore link and you will see your new entry in the results:

image

 

So there you go, an ultra simple REST web service exposing a high score list.  Granted, the code is pretty awful.  It’s not thread safe, it has no persistence when the server ends, no security, etc.  But it illustrates how simple the basics actually are.

 

Going Live

 

Now that you’ve got your service working locally, its time to deploy to Azure.  Fortunately it’s as simple as right clicking your project and selecting Publish:

image

 

To configure your publish profile, you can download this from the Azure Mobile Services portal.  In the Dashboard tab, select Download publish profile.

image

 

And now your Azure service is online, assuming there were no errors.  Mine for example is at http://argh.azure-mobile.net/.  Now here is one of the infuriating parts of dealing with Microsoft…  no matter how far I search, I cant figure out the authentication being requested here if you want to access the generated HTML5 scaffolding.  Fortunately it shouldn’t matter at this point, as you should only be accessing your service from code at this point.

 

 

Let’s look at calling our service in Fiddler.

Here is a request:

image

And here is the response:

image

 

Woot!

 

Other nice things

 

There are a few other perks to using Azure…  first is the out of the box authentication options:

image

 

Writing OAuth code is frankly a bit of a pain in the ass, so its nice to see Microsoft have taken care of it for you.  So if you want your users to authenticate against Twitter, Facebook, Google, etc… it’s incredibly simple.

 

The Database.  We never each touched on the SQL side of Azure and it makes your life pretty easy.  Basically it works just like the Azure project did, you download a local project to work and test with, then deploy it back to Azure:

image

 

You have a standard SQL Connection string you can connect with, so you can treat an Azure database just like any other local or remote DB.

 

Push Notifications.  Just like they have made authenticating to multiple services easy, so have they done with push notifications:

image

Windows, Windows Phone, Apple and Google Notification are all supported.

 

Automatic scaling…

image

While not supported on the free tier, you can easily set up your service to scale up when needed, or perhaps more important, to not scale up.

 

 

All told, Azure is a pretty impressive service but needs better documentation.  You spend a lot of time trying to work out things that should be extremely simple ( not what account to log in with… ), but what is there is pretty intuitive.  The scope of Web API ( the library used for actually writing the code ) is massive and again, could use some better documentation.  Normally MSDN is a bastion of information, but in this case, the pickings are pretty slim.

 

From my experiences, this is vastly more polished than Amazon’s offerings… or at least, easier.  That said, Amazon has an entire ecosystem built over their offerings that provide that polish for you.  Google…  well it’s just crap frankly.  Besides after they pulled this and with their habit of killing of popular products rather suddenly, I wouldn’t dream of using their services personally.

General, Programming ,

11. March 2014

 

From this post on reddit I have learned of the open sourcing of Sony’s game tool creation kit Authoring Tools Framework (ATF).  The ATF is a comprehensive .NET/C# based framework for creating game tools.  It has been used to create all kinds of tools for several shipped games including the level editor for Naughty Dog’s epic Last of Us.

 

In Sony’s own words:

Authoring Tools Framework (ATF) is a set of C#/.NET components for making tools on Windows. ATF has been used by most Sony first party game studios to make many custom tools such as Naughty Dog’s level editor and shader editor for The Last of Us, Guerrilla Games’ sequence editor for Killzone games (including theKillzone: Shadow Fall PS4 launch title), an animation blending tool at Santa Monica Studios, a level editor at Bend Studio, a visual state machine editor for Quantic Dream, sound editing tools, and many others. ATF has been in continuous development in Sony's Worldwide Studios central tools group since early 2006.

 

The license is Apache Version 2, which is a very liberal license with no GNU style conditions.

 

Sample Level Editor created using ATF

 

When I said comprehensive earlier, I meant it.  This is an incredibly well documented project.  There is a 75 page PDF DOM programming guide, a 30 page Getting Started PDF as well as a comprehensive online Wiki, including the ATF Programmer’s Guide.

 

The framework itself contains a number of classes.  It is provided as a Visual Studio 2010 project.  As you can see, ATF provides GUI components, Collada and Perforce support and more.  The core however is um… in Atf.Core, which provides the backbone of the framework itself.

 

image

 

From my quick scan, ATF appears to provide a game orriented MFC style document model.  It’s complex, it will take some time digging before I can fully appreciate what this framework provides.  However, to assist in that, there are a number of included samples:

image

 

Unfortunately, a few of them are missing, including probably the one you would be most interested in, LevelEditor.  Hopefully these get released in short order.

 

It is getting increasingly common to create games using C# and this toolkit should make the job a heck of a lot easier!  Very cool release Sony!

News , ,

Month List

Popular Comments