Castle Game Pre-Battle Screen UI/UX Design
In this game, the player will encounter a boss and three monsters fighting alongside him after choosing the heroes to fight with.
Role
Tools
UI/UX Design
Procreate, Photoshop, Illustrator, Figma
About The Game
In this game, the player will encounter a boss and three monsters fighting alongside him after choosing the heroes to fight with.
The designed screen is the pre-battle screen. On this screen, the player; You can select, change, edit team members, learn about your enemy, compare yourself, choose to pass the battle automatically AUTO BATTLE, you can start the battle by pressing the BATTLE button.
First of all, roughly sketch the UX flow (in wireframe)
I work and see what will happen to me during the whole process. Thus, I can determine the colors, icons and general concept that I will use.
Sketch
Vector Illustration
Light and Shadow Detail
After completing the general concept, colors and UX flow, I move on to the sketching phase of the icons. At this stage, I usually sketch first and then color and, if necessary, vectorize. Finally, I elaborate by adding light and shadows.
Aaand Other UI Assets