Helios Saga is a video game that features space combat in both a top-down and third person view as well as a leveling system that allows you to buy upgrades for your ship. In addition to the game design and project management, I designed and created the graphics for the UI.
1. Display HUD in a non-intrusive way.
2. Design customization menu that clearly displays progress towards upgrades.
3. Design upgrade graphics to reflect the nature of the upgrade.
Tools: Unity, C#, Illustrator, Photoshop, Maya.
Process: Wireframe, Prototype, User Testing.
- Show essential game information without intruding significantly on screen space.
- Include music player to promote band partnership without detracting from gameplay.
- HUD elements may be displayed over game backgrounds with drastically different color schemes, depending on camera position.
Keeping the HUD from drawing too much attention from the gameplay is always a top priority in game UI design. Our Clutter Edition also faced the challenge of needing to include the music player in order to help promote the band that did our amazing soundtrack.
We sought to keep the opacity of our primary HUD items lower while using colors with a distinct contrast to the game environment. This kept the HUD elements more subtle but gave them a clear distinction from the main action.
We also kept the music player in a corner of the screen that would almost never obstruct the view of enemy ships, based on the camera position in relation to the sun you orbited around. When you were in first person mode, it would also be non-intrusive, given the horizon line from which enemies would be approaching.
- Ensure that players are aware of what upgrades they have and what they can get.
- Ensure that players know how much progress they have made to the next upgrade.
It is important that players always have a clear visual indication of their progress towards upgrading their ship as well as how many upgrades they are allowed to get.
The original upgrade system only allowed players to upgrade three times, in order to encourage a more player-specific customization from game to game. The image above shows a player who has chosen one of their three allotted upgrades and is 3/10 of the way to a second upgrade.
In the Clutter Edition, the game was modified to allow players to get every upgrade. This shows a player who has achieved this feat.
- Ensure that players understand if they are choosing an offensive or defensive upgrade.
Players should have an indication as to the effect of their upgrades will have on their ship.
I distinguished the offensive and defensive upgrades by keeping them on two separate rows of the upgrade menu. The far left slots shows the highest selected upgrade from either the offensive or defensive track.