AGENT ABILITY ICONS

As a visual designer, I worked with the character team to design icons for each agent’s abilities. This involved working with the game designer to understand their intentions with the ability as well as working off concepts from the concept artists. Throughout the process I would make changes based on feedback from the character team, UI team, UX designers, and game designers.

When designing ability icons, here are some things I had to keep in mind.

  • Is it differentiated enough from other icons?

  • Does the set of icons look cohesive?

  • Do the icons match the style of the other VALORANT ability icons?

  • Does the icon read well at small scale?

  • Does it properly represent the ability?

  • Does it need to communicate the functionality/output of the ability?

GEKKO

IN GAME

DEADLOCK

ISO

ABILITY ACTION ICONS

CHALLENGE

When agents equip an ability in VALORANT, an icon is displayed to indicate what will happen upon a click or key press. Since there were a limited number of ability action icons, this meant that some icons did not properly communicate the behavior of the abilities to which they were assigned.

SOLUTION

I did a deep dive into every type of equippable ability in the game including cast paradigms, reactivations, cancels etc. Ability behaviors that were similar or that followed the same rules went together in their respective “buckets.” I then created an icon for each of these to appropriately indicate the action.

 
 
Next

ENVIRONMENT GRAPHICS