During the development of our combat system, I noticed that the visual feedback for attack areas needed to be more impactful. Initially, we were using a simple red cone texture to represent the affected area — functional, but not visually impressive.

I decided to evolve the system by creating custom shaders to bring the attack areas to life, making them more dynamic and responsive.

Goal
The goal was to create a visual effect that conveyed the attack charging process:

Start softly and grow stronger over time.

Visually expand progressively.

Transition colors during the attack charge.

Apply fade out effects on the edges for a smoother integration with the environment.

First Version
The first shader we developed was for the attack cone:

The radius would grow over time as the attack charged.

It had a radial gradient filling from the center outward.

It automatically responded to the object's activation in the game (no need to instantiate a new material).

While functional, the visual still felt rigid. There was no color transition or edge fading vertically.

Improvements Implemented
We refined the shader by adding:

Color interpolation between a start color and an end color during the charge time (ColorStart → ColorEnd).

Maximum opacity control to allow for more "ethereal" or solid effects depending on the situation.

Fade out on the Y-axis borders, to soften the top and bottom edges of the cone, making it blend better with the environment.

These changes made the attacks feel much more alive, giving the impression of energy building up before release.

Expanding to Other Attack Types
With the cone shader solidified, we created a second shader for linear attacks (like arrows and straight-line spells):

The fill grows horizontally (on the X-axis).

The line advances smoothly from the origin to the maximum range.

We applied the same principles of color gradient and edge fading.

This way, we could reuse the same visual logic across different types of attacks, maintaining artistic consistency throughout the game.

Technical Notes
The shaders are fully controlled via material parameters, with no need for new material instances.

The system uses _StartTime to sync the shader animation with the moment the attack is triggered.

Color and opacity effects are parameterized for fine-tuning each skill or ability.

Results
The new attack area system brought a massive improvement in visual clarity and gameplay impact. Now players can better perceive imminent danger and react visually to enemy attacks much more instinctively.

Additionally, the shaders are lightweight, scalable, and easy to maintain.

Fixed portuguese translation, fixed problem when you get teleport or Phoenix dash and the other ability appear in the level up, increased arrow size to make it better seen