Creating satisfying, readable hitboxes is fundamental to developing a great game. If it’s too easy or too hard to hit a given character, your players will get frustrated — and more often than not, quit.
Fully Illustrated and Darkwind Media worried about this while developing their 2D beat-‘em-up Wulverblade, which debuted in January, and they took a number of steps to ensure their hitboxes were just right.
Most notably, they took pains to ensure that every character had a similar reach, and they made sure to effectively implement the hitboxes around the art.
In Wulverblade, players choose from three playable warriors who are revolting against the Roman Empire: Caradoc, Brennus, and Guinevere. The goal is straightforward: move from left to right, decapitating Romans and traitorous tribes with your weapons and taking on bosses that get progressively stronger as you advance through the levels.
Design enemies with the player’s hitbox in mind
Creative director Michael Heald (a big fan of both ancient history and classic Capcom arcade beat-’em-ups) was responsible for all of the art within the game, and keyframed the majority of the animations.
One major problem he had from the beginning was that the game used weapons, which meant that it was much harder to balance enemy reach than if all the characters fought with their hands.
“One thing you find initially when you start creating a beat-‘em-up that uses weapons is the reach of the character is a lot further than that of a traditional beat-‘em-up where they’re using their fists,” says Heald, explaining that this makes enemies that don’t have longer weapons much easier to kill, which feels less challenging and not as rewarding.
“That was a hurdle to overcome initially: to make sure every enemy that attacks you has a weapon with a reasonable range,” he continues. “And if the weapon they’re carrying doesn’t have a reasonable range, then their primary attack has to give them that reasonable range.”
He gives the example of characters who wield hammers, knives, and shorter swords. These characters all have leaping attacks, to counter their limited range. This gives them a range that is equal to the player’s, allowing combat to be much more balanced and affording them a much better chance of threatening the player’s hitbox.
Finding the right hitbox, and dialing in the damage zones
Another challenge was deciding on the types of hitboxes used. One of the major problems was that the game was made in Unity (Unity2D was released halfway into development), meaning the game is essentially 3D with the 2D perspective achieved through off-axis projection and the game being drawn in three distinct layers: foreground, background, and battlefield.
Wulverblade’s method of hit detection went through a bunch of revisions, because of this, before the team settled on a solution that gave them adequate control.
For the damage zones, the team used a simple box for each character with tweaked dimensions. They wanted the damage zones to be tied closely to the design. This meant adjusting the hitboxes to each character’s individual size.
“They generally are dependent on the character’s apparent width,” says Brian Johnstone, the lead programmer on the game. “We didn’t want it to be too disconnected from the visuals otherwise a player will think it looked like they should have hit but they don’t. So, some enemies have wider hitboxes than others.”
Sometimes, the best hitbox is a hitsphere
The querying, the process by which the collision is confirmed and tested against the game’s date, is achieved through another method.
Johnstone explains, “[It] ended up being a series of width-adjustable sphere queries extending out along the path of attack. This allowed us to precisely control both the length and the width of the attack (how far in the Z plane up and down your attack could hit things).”
These were used because the game’s engine is much faster at checking for sphere intersections; this allowed a query with a lot of control over the attack zone, permitting the devs to change the sweep angle and have as many sweeps as they want to cover an area. So, if the player is controlling the sword-wielding Cardoc, they can quickly swipe their blade out over and over to hit numerous incoming targets.
Surprise! Let’s add a blocking mechanic
The addition of blocking also complicated the development process. In Wulverblade, players can block attacks using a shield, a feature not typically included in beat-‘em-up games. This meant that more time had to be spent on animations and that the code required altering to give out a much lower damage output whenever players successfully block an attack.
Initially, Heald was reluctant to add the blocking mechanic, in large part because of his desire to adhere to rules established by older games in the genre.
“Being a fancy pants illustrator and only being bothered with the aesthetic, I wanted my characters to hold shields purely because I thought they looked cool,” says Heald. “I had no interest in adding blocking in, because that wasn’t really something you got in side-scrolling beat-‘em-ups. Blocking doesn’t really exist.”
“It was after the initial combat design but still quite early on where people constantly brought up the fact that our characters were carrying shields but could not block,” adds Johnstone. “It complicated things a lot in the sense that there was an entirely new input for the game with new actions.”
However, he admits that “It opened up some nice opportunities though. Without blocking we wouldn’t have been able to add the perfect block slowdown counter attack moves which I find endlessly satisfying to execute.”
In the end, Wulverblade debuted in January as a love letter to classic beat-’em-ups with a few of its own unique twists. Devs may appreciate knowing that, when asked to reflect on what he might do differently if he could do it all over again, Heald wishes he’d made it easier to swap in new content.
“I would probably make it easier […] to change the character’s main weapon. Right now, it would be a case of a lot of redrawing to make that happen,” he says. “Also, making characters more easily reskinnable would be another change. So, we can widen the character set with a lot more ease. [At the moment], it would be an absolute beast of a task.”