Last week I talked about the design decisions for the GUI I created for our game in development, and promised to continue from where I stopped, by talking about how I created the HUD and the stages this task went through.
Basically, the reasons why the HUD design looks as it is now (displayed in Fig1) is almost the same as some of those for the GUI so I won’t be talking in details about that as much as explaining what each element function is, and how I got to the final design.
What to include in the HUD was previously decided by the team and it consisted of displaying the player score as well as his highscore, and then after our lead programmer found a way to display an online leaderboard, we added the highest highscore among all users. Displaying scores is important for our game because getting a higscore is kind of the main goal of the game since it’s an endless game. But there is also one more element for our HUD which is the weapon list. The weapon list consists of displaying all weapons a player can equip and use. Different sprites indicate to different states of the weapon (unequipped, equipped, and in use). Weapons also represent life since the player loses a weapon when hit, and dies when loses the last weapon, so the weapon display also serves in making the player aware of how many lives he still has while playing.
The scores are written with the font created for the GUI, with a slight difference in size and with different colors to easily distinguish between them. The game’s highest score is displayed on the top in red with the corresponding username, right under it is displayed the player’s highscore in yellow and conserving the same size as the highest score, then in the bottom of the list, the player’s current score is displayed along with his username in green and with a larger font (see Fig1).
As for the weapons, they went through two designs including the final one. At first, I wanted to use the chalk brush to fill the shape of the guns and use those sprites to represent the equipped guns, then display the colored sprite of the weapon when selected. I also created a simple animation for when the weapon is lost, that you can see in Fig2. However, that design took too much attention that I had to make it more simple by fixing a position for each weapon, reducing the transparency for the weapons sprites when equipped, and making new sprites for the unequipped state where I only drew the outer line of each gun with a unique color (see Fig1).
This is probably the end of my blogs concerning my Game Development project. I’ll keep you up with my future work and achievements in a new blog series.
Mohamad Saleh Blog 
I am sorry about the animation, but it looks like I saved it to play only once, so if you missed it in Fig2, you need to reload the page to see it again.
LikeLike
Well written blog, and yes i noticed the second figure not looping its animation but i have seen it now that i refreshed the page. I think stylistically you succeeded in getting your HUD to fit in, but i would personally say that the font is a little hard to read. Other than that i think that this post is somewhat valuable, and brings up the importance of not creating distracting elements in the HUD with your example. But i still would of liked to read why certain decisions were made about these elements, as it is pretty much required for each blog. But also because that would be an interesting read, what compelled your team to include these elements for example. Other than that i think the blog is quite clear in terms of what was done and how, so no comments on that.
Good luck with the next project!
LikeLike
Hi!
I really like you blog and I also think you have very good visuals in your game. I enjoy it a lot! I am wondering about how you communicating that when you lose you weapons you lose all your life. It´s not included in the game literacy so I believe it need to be clearly communicated in the beginning of the game. What is the thought process around that?
As for the animation, I think you could increase the effect of when you die. It´s feels like one of the more imported machinic in the game. Maybe there is a feeling of un cohesiveness to the overall art style. I do feel that the visual effect you have around the player are very pretty. Because the take the most attention I put the visual effect as the reference point when I try to get a feel of the overall cohesiveness of the art.
That said, the blog is great, Your game is pretty : )
LikeLike
Thank you for reading the post. I’m happy that you like the game and especially the visuals. Regarding the weapons, there will be a better representation of life through the sprites of the guns pickup and those displayed in the HUD. As for the death animation, there is no need for one since we have a better plan for that which wasn’t a priority to implement in previous versions of the game, but if it goes well, it will be worth to wait and see it yourself when you play the finished game.
I do agree with the uncoherence in the art style, but my fellow graphic designer and I have different points of view (stylized and goofy VS realistic and serious), but at some point we manage to create a smooth combination between the two to a certain extent, and in my opinion, this is what made the visual outcome attractive and led for a successful start presenting an interesting concept as “Burn Witch, Burn”. However, I understand your point and I appreciate your advice, and I thank you again for your time writing your comment and pointing out some useful stuff.
I recently read Leon’s blog, and I can see the hard work and the level of perfection you are aiming to in your project in spite of the small size of your team, and I am really impressed by the level of entertaining quality that your game has. As, I mentioned to Leon, I really enjoyed playing “Burn Cube, Burn” and I’m looking forward to play the finished version of this clever game.
Adios.
Mohamad Saleh
LikeLiked by 1 person
Aah, I am glad you like some thoughts I had. After the presentation we gossip about the visuals in your game in a positive way. It is nice to hear the you like the gameplay 🙂
LikeLike