Tic Tac Toe – Finished

I have finally completed a small game project: Tic Tac Toe!

Because of the awesomeness that is Unity it is available on the web, however it is currently hosted on my own tiny server so this might be a bit slow and access to it might be intermittent.


Over the last few weeks I stopped posting game updates and focused on getting a VERY small game project done. The result was this Tic Tac Toe implementation. I decided to finish the simplest thing possible and I am happy with that choice. I also decided to accept help from a great artist friend of mine in order to finish. Now that it is basically done I thought I would chat through a bit of how it was made for those interested.

Attempt #1

I was really excited to do an iPhone project but told myself I couldn’t spend money on it until I could finish a project using just the simulator. In roughly 8-12 hours I wrote a version of Tic Tac Toe that looked roughly like the Unity one that I completed later. Only the main board was working and only 2 player (no A.I.). At this point in the project another artist friend of mine bugged me to try out Unity. In 4 hours I caught up to where I was and it looked like it would go even faster in Unity AND it would give me the ability to have an OS X, Windows, Web and iPhone version! So I happily switched.

Tic Tac Toe in Unity

Opening up Unity was a bit awkward for me at first being someone more familiar with Visual Studio than with asset creation tools like Maya. About five minutes later I was completely converted. I love that Unity acts as a sort of “asset hub” where you collect all of your game data and double clicking any asset opens its own application to edit the file. The documentation and tutorials were great, but rather than reading a bunch of how to documents (I still haven’t), I just opened up a JavaScript file and started writing my game in the OnGui() function. My entire game was contained in one JavaScript file and I did not run into that many troubles creating the game.

Phase 1 – Play board and scoring (4-8 hours)

The first thing I did was create a grid of 9 buttons and a storage array in to say what buttons were set. You can pass a GUI.Button an image so based on what space was taken I would select one of the button images. After this worked, I wrote some code to see if an entire row, column or diagonal was filled and then I would score points for that row. Next I added in detection for a draw. Finally I wrote some code to display the score and had a basic Tic Tac Toe game going with myself.

Phase 2 – Functionality and A.I. (4-8 hours)

With the basic game running I was moving into new territory for this code (I had already done the above in xcode). I started with simple A.I. Easy – Pick a random open space. Medium – Win if you can, block other player from winning, random. Hard – Same as medium. Then I went through and enabled a turn indicator (lights up X or O for whose turn it is), reset board button, reset score button and sliders for 1 player/2 players and easy/medium/hard difficulty.

Phase 3 – “Polish” and audio (4 – 8 hours)

My final phase of work on the demo was finishing the audio and making all of the graphics look great (alignment, correct textures, etc.). To customize sliders I had to use the GUISkin class and I noticed that all of the button, box, label and slider classes all have padding and borders on them. This is what was causing my misalignment. After removing those all I needed to do was override the slider and slider thumb textures and my application looked great! Audio was probably the most fun and surprising part of making the game for me. I used the terminal “say” command to output the generated speech to an audio file. Adding this and a button press file from this site and my audio was complete.

I don’t even think I used Unity in the way it was intended and I still found it very easy to use!

Thoughts on building Tic Tac Toe

I’m very happy that I picked such a small project and actually finished it. The project took a total of 12-24 coding hours and roughly 4-5 art hours. Had you asked me before starting how long Tic Tac Toe would take and I probably would have said 4-8 hours. Without polish that was true, but to actually “finish” the game it took three times as long. The range is because I didn’t journal my time working on the game. If I had to pick a number I would say the project took 24 hours or three full-time working days including the time to learn Unity. This information will help me plan my future projects to make sure that they are accomplish-able. I will probably post more intermediate progress steps on future projects.

If people are interested in the source code or a tutorial on this please let me know in the comments and I will write-up a follow-up post, otherwise I will be happily working on the next game.

This entry was posted in 2D, Games and tagged , , , . Bookmark the permalink.

12 Responses to Tic Tac Toe – Finished

  1. Owen Goss says:

    Thanks for posting these details. Unity is something I should really try out at some point. Now that you can try it for free, I have no excuse not to at least look at it. πŸ™‚

  2. tastygraph says:

    This is a pretty nice little game you made, I actually ended up playing it for at least 15+ minutes or so on medium diffulty πŸ™‚

    I would be very interested in seeing the source for this or a tutorial if you’re still interested in writing something like that πŸ™‚

    I’m quite new to programming and Unity myself, so everything that relates to java/programming for unity is of interest to me πŸ™‚
    Also, I am looking forward to seeing the results of your next game πŸ™‚

    Keep up the good work!

    • jhuculak says:

      Thanks for the feedback tastygraph. I do plan on returning to this code for a tutorial but two things will delay it a little:

    • I am focusing on finishing another Unity game
    • I would like to do the tutorial “right”
    • Given that this was my first unity project and I did not read the manual, I think I should have another project under my belt before doing a tutorial. Check back for more! If you are interested in the code without a tutorial I would email it to you.