On this 13th of October in the year of our wargod 2015 (may we all bleed for Huitzil), I have updated this piece of educational content to reflect the insights gained since I created the original demo in 2012. Unfortunately, webplayer content is pretty busted on all browsers but Firefox, and it won't work there for long. In lieu of sweet webplayer content, I've got these download links for PC, Mac, and Linux.
For those of you unfamiliar with this piece of content, it is an interactive demo I built to showcase the proper elements of a successful looking/sounding/feeling attack. I so frequently reference these elements when speaking to other developers or providing feedback to clients, so I use this to better communicates the important ideas. The key concept is that an attack's feel derives completely from:
- The character animations.
- The visual effects.
- The sound effects.
All of these elements are just children of those 3 things. From a development point of view, I highly advise advancing these items together to perceive the improvement of the attack in a motivating way.
Once downloaded and running, push Z to see the attack, and push 1 through 9 to fire individual effects. Following is a production break down of those individual effects. The bold/underlined items are absolutely necessary in all cases.
- Attack Animation: A good attack animation has some anticipation for build up and some follow through for weight. Make the character load up their weapon and then swing it hard. In most of the attacks I've ever animated, the actual swing/thrust of the weapon lasts no more than 6 frames.
- Struck Animation: A good struck animation should be fast and over the top to really sell the pain at screen distance. It always helps to flash the struck character a distinctive color. Don't worry about curves here; it's okay for this animation to be jagged and nasty.
- Weapon Swing Effect: The weapon swing should be big and flashy, fire fast, and follow a smooth line. You're using this to sell the motion of the weapon, but you also don't want to obscure the action. So always play with this until you've found the middle ground.
- Hit Effect: Most of this is obvious, but make sure a hit effect is big, flashy, and fires very quickly. Think of them as explosions. You want to capture that energy and funnel it into this effect.
- Weapon Impact Effect: This effect has traditionally been limited to fighting games and beat 'em ups, but it helps ALL hit effects unless you have an absurd weapon which doesn't need one. They just help sell the pain and make the entire effect more interesting.
- Blood: Blood is often times the last thing a player sees in a successful impact! I like to make it as beautiful as possible so the player is left with a sweet taste in their mouth when the attack is over. Obviously this isn't always appropriate, but when it is it should be utilized.
- Attacker Ground Dust: Helps to sell the weight the attacker threw into the attack. If you try this and it looks/feels weird it's because the attack animation is too lightweight!
- Screen Shake: Self-explanatory. Easy easy easy way to sell the impact. When it's not overdone it should look and feel awesome.
- Animation Freeze: This is a classic trick that is so subtle most people don't know about it; when a hit connects, the characters animations on both the attacking and defending character freeze for a few frames. Again, it's subtle, but it's been happening since Street Fighter 2 (maybe earlier) and we don't even notice until it's not there.
Notes On The Audio
It's really important that audio effects in these instances be clean (recorded/produced well) and bassy. Without that bass element it sounds either airy or tinny, depending on the speakers, and this hurts the feel real bad. I actually make all of our sound effects, but not from scratch; I smash together different existing effects into new and usable sounds. I pull from explosions and gun shots and heavy thumps to get the low end for our sounds. Hopefully you've got a sound person that already knows this and can do what I can't!