GameDev Week 2: UI and Game Design

James Kim
4 min readMay 1, 2017

This week, I have been a bit busy with other stuffs, such as spending entire Saturday evening trying out Javascript after an amazing day at Dev Academy. I was also being lazy, binge-watching the entire second half of Designated Survivor(a show where Jack Bauer realises politics is way harder than killing everyone). Thus, not much work has been done on my game. Only two things have been done: trying out Abstract Factory Pattern and thinking about UI implementation.

Abstract Factory Pattern

On Monday, while reading random stuff about programming, I just came across something called builder pattern, and after few more clicks, I was reading about abstract factory pattern. The pattern utilised interfaces, a feature that I have never used, and promised greater flexibility to the client code. So I went on my experimental branch of my git and tried to rewrite my code in abstract factory pattern. How did it go? This screenshot of my git says all:

On second thought, let’s not go to abstract factories, `tis a silly place

After spending half a day on it, I decided what I was doing was over-engineering, and I really should be focusing on other stuff like AI, UI, Turret deployment system, save system, enemy AI, art …. So I started working on the UI implementation of the turret AI system.

UI vs Game Design

I spent some time musing over the UI design and I felt like I was a little out of depth. I was not sure on where to even begin. So I did some research first. After watching many GDC videos, trying out UIs of various apps and games, I decided that the starting point was minimising the amount of text in my game. However, I soon realised that this was easier said than done (like everything), and I had to wonder if I had to change my game design to achieve the goal.

Should the UI affect game design, or should the UI be designed around the game? I think a bad UI, regardless of platform, can break my love for a game, and for mobile games, even more so. Thus, I think the UI should affect game design, or at least a game should be designed with the UI in mind. What use is having a great story, or a great game mechanic if a player can’t enjoy it due to a bad UI design? There are many RPGs on mobile app stores that I just cannot enjoy because their UI is so horrendous with touch screens.

Anyway, on this topic over UI vs game design, I found this talk given by the UI design team for Hearthstone to be fascinating and insightful: Hearthstone: How to Create an Immersive User Interface

Moving on, the original plan was to create a flexible AI system, letting players craft their own turret AI, how they want it. Essentially, this meant that the players could drag and drop any AI command cards, to any open AI slots, in any order and the program would create a turret AI by combining all the command cards in the slot. I thought it would be quite fun to have enemies that changed up their behaviours as the game went on and players adapt to those changes by changing their turret AI.

What is this? a gif for an ant? I don’t know why the gif ended up so small

But I have realised that this flexibility necessitates so much texts (as well as being hard to program). Firstly, I would have to tell the players how the system actually worked when the players first loaded up the AI set-up screen. I realised that there were so many implicit rules, which players would not know, that had to be explicitly laid out. In what order should the command cards be in? what do the cards mean? What happens if I place two or more targeting commands in a row?No matter how clearly I could write, there would still be long texts. There would still be confusions. The UI would not be intuitive. This was not what I wanted at all.

Secondly, players are bound to make some bad choices when they are given complete freedom over something. For example, they may forget to put any ‘attack’ commands in the list, making the turret useless. Checking and reminding the players for their mistakes is time consuming, and in my opinion, probably frustrating for players too. So, I decided to remove all meaningless choices.

This meant the players could no longer freely drag and drop their AI cards on any slots, but rather could only choose from a valid set of commands for the currently active slot. For example, if a player had chosen a targeting command card, then the player would be given attack command cards to choose from because having two targeting command card in a row would be meaningless. This way, players would always make a meaningful choice without having to learn about boring rules on it all worked.

Anyway, I have yet to actually make this system. So I will be spending this week implementing this. Thanks for reading, and as always, please send comments and questions to @LLHorizon on Twitter!

--

--

James Kim

Backend Engineer working at Xero. Also passionate about UX, writing and illustration.