Simple Effects that Make Game Visuals Feel More Impactful

2016-01-08 18:50:55 by Tyler
Updated

Last week I made my first post about Going From Amateur Hobbyist to Developing Games for a Living. This week I write about some techniques I like to use that make games feel better, visually. I've stolen all of these effects from other games and I encourage you to use them too.

Here is a little clip of special effects that I use in my games:

2595437_145229705491_giphy.gif

Notice how motion lines, impact holds, screenshake, and particles make everything feel exciting to look at. For a little extra work, these effects create a huge impact in making the game feel more appealing to look at. 

Below is a breakdown of the tricks that I employ in my games that add visual impact to gameplay.


1. Motion Lines


These effects emphasize speed and power. I totally ripped them off from the Japanese. Notice the same motion lines around the edges that appear when the character inflicts a heavy hit.

2595437_145229705341_giphy.gif

Anime and games like Smash Bros employee these techniques a lot. As you can see in my first gif, I like to have them appear a frame before impact holds to really emphasize hits. Use these whenever something you want to highlight happens in game.


2. Impact Holds


This is something you see a lot in anime when the artist wants to imply heavy impact between two forces. Right before a powerful spell happens, I will employ holds like these.

2595437_145229705222_giphy.gif

Notice how right before the one robot crosses weapons with the other, a brief impact flash occurs for a frame.

2595437_145229293072_ScreenShot2016-01-08at1.20.13PM.png

A lot of games today have “holds” where the game pauses the action for a split second to imply a powerful impact. Smash Bros tends to pause hits on characters to emphasize that an attack's recipient was hit hard. I find anime-esque impacts like these take the appeal of holds one step further.


3. Screenshake


This examples’s pretty obvious and is used everywhere in animation. Still, it’s worth emphasizing how effective it is.

The moving of the screen makes your characters actions feel like they have more weight. When a character fires his gun or something heavy hits in game, use a screenshake.


4. Particles


Particles are very simple but create a lot of extra visual interest for very minimal effort. I use a lot of particles. Some are hand animated, some are handled via programming. 

                2595437_145229705241_giphy.gif

In this example: whenever the Priestess heals, white particles fly from her staff. Also, purple particles appear over her target. The Marksman also drops a shell casing everytime he shoots. Those are added via programming.

Not all particles need to be animated with code. When characters are hit, I have little hand-animated impact particles appear too.

You can add these in all sorts of places. When characters run, make dust kick up. When a character in a shooter misses its target and hits a wall, have smoke come out of the bullethole.


5. Lingering effects


Effects that persist on screen for a while remind players they’ve caused serious carnage. By keeping effects around for a while, you create a scene telling the player they’ve left their own mark in the world.

2595437_145229705183_giphy.gif

When an explosion happens, visual indicators like smoke, scorch marks and embers emphasize this. The smoke fades out slowly and fire persists long after the explosion has faded away.

Having corpses and bloodstains of slain enemies stay on the screen for awhile is another way to add lingering visuals.


6. Persistent Motion


This one is not so much an effect but I decided it's worth including anyway.

Always keep your characters moving, even when idle. A lot of beginners have their characters completely hold still when inactive. This is a mistake; immersion feels broken and characters seem lifeless when motion stops. 

                  2595437_145229705161_V9mp6OuHTumUfZ1yCSGf_Heroes_Idle.gif

I have my characters always bounce around regardless of action. My idle poses are very simplistic, but they work.

You see this in almost all fighting games. In these games, whenever a character isn't being controlled, the character still breathes and moves around.


Hopefully these techniques help you out. 

I'll be adding more development posts in the future. They will discuss in greater detail some of the design decisions I make. I'll be making a new post every friday.

You can follow our blog on twitter if you want to see even more of our development.


Comments

You must be logged in to comment on this post.


ArcadeHeroArcadeHero

2016-01-08 18:58:08

Nice post Tyler!
Very useful techniques c:

Tyler responds:

Hopefully they help.

PS. I really like your art


MrChambersMrChambers

2016-01-08 19:16:06

This is some good advise! and your game is looking awesome!


XsplosiveXsplosive

2016-01-08 19:47:37

Super interesting stuff


HendertakerHendertaker

2016-01-08 19:59:18

Very helpful and well constructed guide. Thanks for sharing your knowledge.


14hourlunchbreak14hourlunchbreak

2016-01-08 20:15:19

Persistent motion is such useful tip that took me so long to figure out. Whether it's animation, games, or real life, no scene is totally motionless. The smallest character or background animation can have a huge effect.


coruptedGamescoruptedGames

2016-01-08 20:32:39

This is so good! Really looking forward to seeing the game out!! :D

Question: How the heck do you fit all your effects into a sprite sheet :o

Tyler responds:

Thanks man, me too.

I have no clue when it comes to technical stuff haha. Ask @jwolfgames


TheEnkianTheEnkian

2016-01-09 09:00:06

Very good advice, I follow a lot of these to try and make my game art and animation stand out a bit more, but it can be a bit trickier as I do mostly pixel art. I might experiment with impact holds, that one hadn't occurred to me. Could be an interesting challenge or make for an interesting feature if the player is fighting somebody one on one and they both strike at the same time. Perhaps a tougher boss has something like this? Maybe even using your sword to swat away a bomb launched at you with a high speed return?


ArcadeHeroArcadeHero

2016-01-09 13:09:35

Thanks man!
It means a lot for me cuz I really big fan of you :P
Can't wait for a new posts.


BoMToonsBoMToons

2016-01-09 14:45:15

Love the tips and the examples! I learned some stuff! One thing that goes along with the persistent motion in making things more lifelike, is blinking. It can go a long way to making characters more engaging and lifelike.

Keep the helpful posts coming!

Tyler responds:

Ooh yeah! Good call. I should have mentioned that too in my idle section.

We actually have blinking, but it just was excluded from the build I made these GIFs from haha.


digsBotdigsBot

2016-01-09 21:43:44

Really like how you're posting these man! I've been using these techniques like this for animating and other future stuff. It's crazy how the small details leave a big impact.

Tyler responds:

Truth!


JWolfGamesJWolfGames

2016-01-14 17:57:05

I read "have smoke come out of the bullethole." as "have smoke come out of the butthole."

Tyler responds:

Yeah man, I proof-read about 20 times and I felt the same way each time. I thought it was just me going batshit crazy reading it so much. I feel relieved now, tbh.