The FX Artist's Guide to Area of Effect (AoE)

unity unreal engine vfx May 23, 2023
The FX Artist's Guide to Area of Effect (AoE) - Featured

Let’s talk about one of the single most important elements of creating FX for video games - the Area of Effect, or AOE!

Here at VFX Apprentice we appreciate every little detail that goes into FX work, especially when it comes to video games. These types of effects are just as important as character design and should be approached with just as much detail and purpose. So, before we dive into what makes an effective AOE, let’s talk about what it is exactly.

What is an Area of Effect?

 

Fire Explosion Case Study from VFX Apprentice All Access 3D VFX Level 2. 

 

In video games, the Area of Effect (AOE) refers to an ability or spell that can affect multiple targets within a specific designated area. Essentially it's an effect that works in a specified range. The shape and size of the area can vary, and may be a circle, a cone, a line, or really whatever shape you want it to be (if you’re designing the effect). The whole point of an AOE’s abilities is that it damages multiple enemies at once, or to apply some other effect, like healing or some form of crowd control.

Some AOE abilities may have a limited range, while others may have a global effect that covers the entire game map. AOE abilities can be useful in a variety of situations, such as taking out groups of enemies or supporting your friends in team-based games like League of Legends.

 

Fire Explosion Case Study from VFX Apprentice All Access 3D VFX Level 2. 

 

When was the first AOE effect used?

 

Well, most likely AoE first appeared in early role-playing games where players controlled a party of characters and were able to target several enemies at once with spells or certain attacks. For instance, one of the earliest examples of an AOE ability in a video game might have been the "Flame Strike" spell in the 1975’s Dungeons & Dragons, which allowed players to deal fire damage to all enemies within a certain radius.

AOE abilities have become such a mainstay in role-playing games since then, but aren’t limited to RPG’s. You can find them in other genres such as strategy games and first-person shooters!  If you think back on some of the best moments you’ve had when playing team-based games, chances are those moments have come from you or your teammates getting out of a hairy situation thanks to an impactful, perfectly timed AOE attack. 

 

What to Consider When Designing the AOE

 AoE concept work from Kristy Doan / VFX Apprentice All Access

 

There are a few important aspects to consider when designing and creating a compelling AOE effect for a video game. 

Purpose: You need to determine the AOE’s purpose and how it will be used in the game. Will it be a damaging effect used to take out groups of enemies, or a supportive effect used to heal or buff allies? Understanding what the effect will be used for will help guide you on your designing journey.

Size and Shape: The shape and size of the AOE will depend on the purpose of the effect and the gameplay context in which it will be used. A circular AOE might be appropriate for a spell that damages multiple enemies within a certain radius, while something like a cone-shaped AOE might be better for an ability that affects a line of enemies. It's really just up to you and the game you’re designing for. 

Visual Style: The visual style (color, texture, 2D/3D, symbols) of the AOE effect should be cohesive with the overall aesthetic of the game and the abilities it is being used with. The effect should be visually distinct and easy to distinguish from other abilities, but not so over-the-top that it distracts from the gameplay. You want it to speak the same language of the game. 

Performance: This one is a little vague but you want to consider how often the AOE will be used throughout the game, particularly if it will be used frequently in the game. The effect should be optimized to ensure that it doesn't cause frame rate drops or other performance issues.

Balance: The AOE effect should be balanced with other abilities in the game, taking into account its power, range, and other factors. It's important to always put these effects next to each other and make sure there’s some sense of equality throughout the big picture. Does that make sense? It shouldn’t be too overpowered, but at the same time it should be useful and viable in a variety of situations. 

 

Different Types of AOE Effects

Sidescroller Heal AoE by Ryan Rosanky & David Shovlin / VFX Apprentice All Access

 

In a 2D game, the game world is typically represented as a flat plane, and AOE effects are typically implemented into that game in terms of 2D shapes such as circles, rectangles, or triangles. This can be relatively straightforward to implement, as the game objects are all on the same plane and can be easily checked for overlap with the AOE shape. In a 3D game, the game world is typically represented as a 3D space, and AOE effects may be implemented in terms of 3D shapes such as spheres or boxes. 

3D AOE effects can be more complex to implement, as the game objects may be at different heights or depths within the game world and may need to be checked for overlap with the AOE shape in three dimensions. Both 2D and 3D AOE can be useful in different contexts, and the choice between them will depend on the specific needs and design of your game. For example, a 2D AOE might be suitable for a sidescroller game, while a 3D AOE would be more common for a first-person game where the player is moving through a 3D environment.

 

VFX Breakdowns and Case Studies from VFX Apprentice All Access 3D VFX Level 2. 

 

So let’s briefly discuss the various types of AOE effects and abilities that are pretty common for gameplay: 

Stun Attack - An ability that stuns all enemies within a certain radius, effectively disabling them for a short time. This can be a powerful tool for disrupting enemy attacks and giving your team an opportunity to strike.

Healing - An ability that restores health to all allies within a certain radius. This can be especially useful in team-based games where coordinating healing is important.

Fireball - The fireball is a classic! This AOE ability deals damage to all enemies within a certain radius. This is often a staple ability for mages or other spellcasters.

Extended Damage - An ability that deals damage to all enemies within a certain radius over a period of time. So the damage it causes lasts for a few seconds rather than just an immediate blow. This can be especially effective in longer fights where the damage adds up.

Shield - An ability that creates a shield around the user, protecting them and any allies within a certain radius from incoming damage. Visually speaking sometimes this looks like a dome or orb that forms around the user. This can be a powerful tool for players surviving team fights and staying in the game longer.

Knockback - An ability that knocks all enemies within a certain radius away from the user. Its essentially a force push. This can be useful for creating space and separating enemies from each other.

Slowing Opponent - An ability that slows most enemies within a certain radius, reducing their movement speed. This can make it easier for your team to catch up to enemies and engage them in combat. Or this can allow players to get away faster if they are low on health. 

 

 

What Makes an AOE Visually Appealing? What Will Stand Out?

 

Fire Explosion Case Study from VFX Apprentice All Access 3D VFX Level 2. 

There are several different reasons one AOE could stand out from the rest. You want the player to have that brief moment of being wow-ed without pulling them out of the gaming experience. It’s a fine line between designing something neutral and designing something loud and vibrant. Some design details to consider when creating a visually appealing AOE (regardless of the program you’re using) might include:

Color: AOE effects can be more eye-catching if they use bright, vibrant colors that contrast with the surrounding environment. These colors should have a uniform look to them that fits within the game’s style guidelines. Check out our 10 Design Tips from the League of Legends VFX Style Guide for more examples of this in action. 

Shape: Having a clear, well-defined shape can be more visually striking than those that are diffused or blurry. These distinctive features create an instantly recognizable effect that allows the player to immediately recognize it while playing. This is extra important for AOE effects since the shape has to be clearly readable.

The line between a hit and a miss is very thin. This could make the difference between a whole team taking damage or no one being affected. The importance of a clearly defined outline is getting multiplied by the amount of possible targets.

Fun fact: Some games actually create two versions of AOE, especially single player, one for the player and one for the enemies. The player indicator is slightly smaller than the actual hitbox since it always feels great when you catch enemies on the edge of your spell. Enemy attacks often have an indicator with a slightly larger effect than the hitbox since it feels like they narrowly avoided taking damage. 

 

 

Movement: AOE effects that move or animate in some way can be more interesting to look at than static effects. Half of the purpose of AOE’s lies in their being a central focal point (your character) that then casts or performs some type of actions that projects outward. 

Movement, or timing, is not just about aesthetics. It's important for a player to tell when an effect will go off, no matter if that is a healing, damaging, or shielding instance. For example Leona's Ultimate (League of Legends) stuns everyone in a certain radius. It can be a MASSIVE game changer to know when and where the effect will go off can be game deciding.

Transparency: Using transparency or alpha blending can help AOE effects blend in more seamlessly with the environment, making them more aesthetically pleasing, but that's not there true intended purpose. You want your effect to be connected to the world, but AOE indicators are often times purposefully different from the environment to make them easily readable

Particles: Adding particle effects such as sparks, smoke, or fire can add visual interest to an AOE. Nothing surprising here, just remember that there needs to be a purpose for adding these particle effects. Above all else, they must serve the story. 

Sound: Adding sound effects to an AOE can enhance its impact and make it more immersive.

So now that we know what they are, the different types you can use, and the different ways to make them interesting, let’s look at what these effects actually look like during actual gameplay. 

 

What Does AOE Actually Look Like in Gameplay?

In case you’d like some examples for what these look like or if you may have seen them before, consider these: 

World of Warcraft

Mages can use the "Blizzard" spell to deal damage to all enemies within a certain radius, while paladins can use the "Avenging Wrath" ability to increase their damage output and heal all allies within a certain radius. 

 

 

League of Legends

Amumu has multiple AOE ability's with the strongest one being an AOE Stun called "Curse of the sad Mummy"

 

 

Overwatch

The character Zarya has her ultime called "Graviton Surge", while the character D.Va can use her "Self-Destruct" ability to deal AOE damage and knock enemies away. Check it out.

 

 

Diablo III

AOE abilities can be used to clear out large groups of enemies, for example, the wizard class has the "Hydra" ability, which summons a hydra to attack all enemies within a certain radius, while the demon hunter class has the "Fan of Knives" ability, which deals AOE damage to all enemies in front of the player.

 

 

Final Fantasy XIV

The bard class has an AOE damage ability called "Storm's Eye," while the summoner class has an AOE damage-over-time ability called "Tri-Disaster.”

 

 

Elden Ring

A very recent example of AOE being used beautifully comes from Elden Ring. There are plenty of different spells and attacks that are worth noting, however our personal favorite happens to be the Meteorite spell.

 

 

Pretty cool, right? We hope you learned a little bit about one of the most important aspects of game FX design and good luck on your own quest designing the next great AOE for your game! 

 


 

Learn how to make stylized real-time FX for games.

Start Your VFX Apprenticeship

Begin your journey towards mastering FX for games and animation. Join VFX-A All Access and discover cutting-edge 2D, 3D, and real-time FX training. 

Browse FX Courses

Learn from Professional VFX Artists

Our instructors have left their mark on AAA titles, indie games, animated films, television series, mobile games, and experiential events. They are here to help you make your own mark.

View All Instructors