Gamezone Part 1: Battle Mechanics

As I went to start coding, the early stuff went easy. I decided to stick with what I knew and code a react based game. This is more about the process and not so much about learning a new language.

So, I programmed a simple piece of code. Orion goes hunting.

Why have “pronoun”? Because I’m planning on coding multiple hunters. This way, if I make multiple hunters, I can very easily plug and play.

Alright, good, so we have a working react app that puts some simple text on the page. The easy stuff is done. Whew.

Now I sit here with a bit of a dilemma. To explain this dilemma, I’m going to take us back a few steps.

Battles in video games are all very specific to the tone of the game itself. A realistic shooter is going require something quite different from a turn based RPG. How many “hits” should any given foe be able to take? What about the protagonist?

Some games have a very simple approach to damage. Take Fire Emblem for instance.

Damage = Attack Power(Attack+Weapon Might) — Defense Power(Defense)

Cut, dried, and simple. Lyndis (Attack of 4), with an Iron Sword (Weapon might of 5) will deal 6 damage to Batta the brigand (defense value of 3). Since he has 21 hit points, it will take her 4 attacks to defeat him. Fire Emblem character stats in this game max out at 30 (With Health being the exception at 80). Because weapons always add damage to the formula, they always ensure that a character with maximum attack fighting against a character with maximum defense will still result in damage.

Boom. Now lets look at something more complex…

Credit to Bulbapedia for the formula images

Every time I see this, I’m a little scared. This, my friends, is Pokemon’s attack formula. Pokemon takes multiple degrees of modifiers into question on top of the already impressive formula. This formula allows for low level moves to scale very effectively against higher level moves.

Now, Star Wars: Galaxy of Heroes has a simple formula that has modifiers like Pokemon does:

DMG = [ Attack Rating — (Armor — Armor Penetration) ] * Attack Multiplier

The one thing I don’t like about Galaxy of Heroes is that the numbers are all so massive, it’s hard to really keep up with what’s happening. It’s the same reason I struggled with Yu-Gi-Oh. When the attack rating is in the thousands, multiplied by more factors, it’s hard to keep track of what’s happening. So… let’s make things simple.

Keep it simple stupid. Especially up front.

Right now the objects are very small. They’ll obviously get larger and more complex as the game grows.

If all my online research told me anything, its that when it comes to game design, it’s better to start small and incrementally go up. Create smaller simpler versions of the games and use what you learn to move forward. So, like Magic the Gathering, I’m going to use just health and attack first. No defense calculation yet, no weapons, just good old subtraction. Unlike Magic the Gathering, damage will accumulate, instead of a one and done situation.

Orion is going hunting! Time to make his quarry.

Now, a part of the question becomes how easy should a regular foe be to eliminate? If this was going for a Pokemon like tone (like the first fight with your rival), two combatants taking turns striking each other should be a close match. If it’s like Fire Emblem’s first fight, the main protagonist should have a chance to take out 2 enemies. Since Fire Emblem is the main influence for the game I hope to ultimately make, we’ll use that as the inspiration.

A small, simple foe.
Each blight Orion hunts should be taken out in 2 hits, and in this “tutorial” level, they shouldn’t be able to deal enough damage to destroy Orion over the 4 turns it would take.

As cut and dried as possible. Now, even if both foes are attacking at the same time.

Adding in some simple CSS to display the information we’ve made, we have a very simple static page!

Excellent! Now all I need is something that does a thing…. I know! A simple attack button! Something that lowers Axel’s health by a value equal to Orion’s health… simple math it is!

Just a button and its corresponding code.

Now, we have a simple button that will do damage! Two strikes, and it’s curtains for Axel! Quickly throw in a win condition…

And suddenly, it’s a super boring game that does what it needs to!

Sorry for the small resolution!

It’s a very simple conditional application right now. Nothing pretty is happening, but we have a living app that does exactly what it needs to. Next, I’m going to tackle the idea of the turn based combat! Axel gets to strike back!