BattlePlan!
Date
Dec, 2023
Tools
Figma
Platforms
PC
Company
PixelVault
BattlePlan!
Date
Dec, 2023
Tools
Figma
Platforms
PC
Company
PixelVault
BattlePlan!
Date
Dec, 2023
Tools
Figma
Platforms
PC
Company
PixelVault
BattlePlan!
Date
Dec, 2023
Tools
Figma
Platforms
PC
Company
PixelVault
BattlePlan!
Date
Dec, 2023
Tools
Figma
Platforms
PC
Company
PixelVault
Final UI Mockup
About the Game
BattlePlan uses a tournament system to pit players against each other in a challenging environment in this super-hero strategic auto-battler WEB3 game.
I worked on several tasks to improve usability within player onboarding, as well as pre- and post-battle flows, enhancing the experience while respecting the game’s established art direction.
Company: PixelVault
UI/UX Director: Damian Volantino
Sr. UI/UX Designer: Náthaly Moyano
About the Game
BattlePlan uses a tournament system to pit players against each other in a challenging environment in this super-hero strategic auto-battler WEB3 game.
I worked on several tasks to improve usability within player onboarding, as well as pre- and post-battle flows, enhancing the experience while respecting the game’s established art direction.
Company: PixelVault
UI/UX Director: Damian Volantino
Sr. UI/UX Designer: Náthaly Moyano
About the Game
BattlePlan uses a tournament system to pit players against each other in a challenging environment in this super-hero strategic auto-battler WEB3 game.
I worked on several tasks to improve usability within player onboarding, as well as pre- and post-battle flows, enhancing the experience while respecting the game’s established art direction.
Company: PixelVault
UI/UX Director: Damian Volantino
Sr. UI/UX Designer: Náthaly Moyano
About the Game
BattlePlan uses a tournament system to pit players against each other in a challenging environment in this super-hero strategic auto-battler WEB3 game.
I worked on several tasks to improve usability within player onboarding, as well as pre- and post-battle flows, enhancing the experience while respecting the game’s established art direction.
Company: PixelVault
UI/UX Director: Damian Volantino
Sr. UI/UX Designer: Náthaly Moyano
About the Game
BattlePlan uses a tournament system to pit players against each other in a challenging environment in this super-hero strategic auto-battler WEB3 game.
I worked on several tasks to improve usability within player onboarding, as well as pre- and post-battle flows, enhancing the experience while respecting the game’s established art direction.
Company: PixelVault
UI/UX Director: Damian Volantino
Sr. UI/UX Designer: Náthaly Moyano
Selecting Brawler, quick anim made in Figma.
Main Takeaways
• Since the game already had a strong player base, we balanced changes to address issues for both new and veteran players, ensuring updates remained familiar for long-time users.
• Started with several usability evaluation rounds, followed by an affinity mapping and competitor analysis to understand the game’s current flow and identify key pain points. This process led to the creation of a new information architecture and user flow.
• Crafted UI mockups and animation concepts to visualize and discuss new opportunities with the team, while also creating additional assets to expand the game’s UI Kit.
• The game’s art direction was fun and highly memorable, so we ensured the redesign preserved its core identity.
Main Takeaways
• Since the game already had a strong player base, we balanced changes to address issues for both new and veteran players, ensuring updates remained familiar for long-time users.
• Started with several usability evaluation rounds, followed by an affinity mapping and competitor analysis to understand the game’s current flow and identify key pain points. This process led to the creation of a new information architecture and user flow.
• Crafted UI mockups and animation concepts to visualize and discuss new opportunities with the team, while also creating additional assets to expand the game’s UI Kit.
• The game’s art direction was fun and highly memorable, so we ensured the redesign preserved its core identity.
Main Takeaways
• Since the game already had a strong player base, we balanced changes to address issues for both new and veteran players, ensuring updates remained familiar for long-time users.
• Started with several usability evaluation rounds, followed by an affinity mapping and competitor analysis to understand the game’s current flow and identify key pain points. This process led to the creation of a new information architecture and user flow.
• Crafted UI mockups and animation concepts to visualize and discuss new opportunities with the team, while also creating additional assets to expand the game’s UI Kit.
• The game’s art direction was fun and highly memorable, so we ensured the redesign preserved its core identity.
Main Takeaways
• Since the game already had a strong player base, we balanced changes to address issues for both new and veteran players, ensuring updates remained familiar for long-time users.
• Started with several usability evaluation rounds, followed by an affinity mapping and competitor analysis to understand the game’s current flow and identify key pain points. This process led to the creation of a new information architecture and user flow.
• Crafted UI mockups and animation concepts to visualize and discuss new opportunities with the team, while also creating additional assets to expand the game’s UI Kit.
• The game’s art direction was fun and highly memorable, so we ensured the redesign preserved its core identity.
Main Takeaways
• Since the game already had a strong player base, we balanced changes to address issues for both new and veteran players, ensuring updates remained familiar for long-time users.
• Started with several usability evaluation rounds, followed by an affinity mapping and competitor analysis to understand the game’s current flow and identify key pain points. This process led to the creation of a new information architecture and user flow.
• Crafted UI mockups and animation concepts to visualize and discuss new opportunities with the team, while also creating additional assets to expand the game’s UI Kit.
• The game’s art direction was fun and highly memorable, so we ensured the redesign preserved its core identity.
New Pre-Battle Flow
Before and After
Challenges
In the pre-battle phase, the studio received a lot of player feedback about having a hard time to choose what to pick. This decision was even more difficult for new players, since they were still getting to know the brawlers.
The old screen showed all information at once, from pick brawler to choosing all kinds of loadouts, so we focused on prioritizing the information: introduce choices step by step, highlighting the most relevant information at each stage.
Motion design also played a key role, helping draw attention to key elements and supporting player confidence in their choices.
Challenges
In the pre-battle phase, the studio received a lot of player feedback about having a hard time to choose what to pick. This decision was even more difficult for new players, since they were still getting to know the brawlers.
The old screen showed all information at once, from pick brawler to choosing all kinds of loadouts, so we focused on prioritizing the information: introduce choices step by step, highlighting the most relevant information at each stage.
Motion design also played a key role, helping draw attention to key elements and supporting player confidence in their choices.
Challenges
In the pre-battle phase, the studio received a lot of player feedback about having a hard time to choose what to pick. This decision was even more difficult for new players, since they were still getting to know the brawlers.
The old screen showed all information at once, from pick brawler to choosing all kinds of loadouts, so we focused on prioritizing the information: introduce choices step by step, highlighting the most relevant information at each stage.
Motion design also played a key role, helping draw attention to key elements and supporting player confidence in their choices.
Challenges
In the pre-battle phase, the studio received a lot of player feedback about having a hard time to choose what to pick. This decision was even more difficult for new players, since they were still getting to know the brawlers.
The old screen showed all information at once, from pick brawler to choosing all kinds of loadouts, so we focused on prioritizing the information: introduce choices step by step, highlighting the most relevant information at each stage.
Motion design also played a key role, helping draw attention to key elements and supporting player confidence in their choices.
Challenges
In the pre-battle phase, the studio received a lot of player feedback about having a hard time to choose what to pick. This decision was even more difficult for new players, since they were still getting to know the brawlers.
The old screen showed all information at once, from pick brawler to choosing all kinds of loadouts, so we focused on prioritizing the information: introduce choices step by step, highlighting the most relevant information at each stage.
Motion design also played a key role, helping draw attention to key elements and supporting player confidence in their choices.
Select Brawler - Before hovering any brawler
Select Brawler - Hovering a brawler
Select Brawler - Bonus Announcement
Select Loadout - No Loadout selected
Select Loadout - Loadout selected
Process - Pain points and proposals
Process - New information architecture and storyboard
Userflows and storyboard
UI Kit - Mix of old and new components
VIEW MORE PROJECTS
