GUI Side Bar | masquerade

GUI Side Bars Iterations

1/5

Stage 1

Stage 5

Stage 1

1/5

Final Iteration

I had changed the fonts of Stage 1 4 and 5 to white mainly due to the fact that it would be easier to see since stage 1 and 5 have a very heavy background and stage 4 has a very dark background. The Side bar remains similar in terms of design.

Original GUI Side Bar

I had decided to use the 5th wireframe. This is mainly due to the fact that this is the one that could help me to stick to the schedule mainly due to the fact that the rest requires me to add new features such as the first wireframe which requires me to draw different moods of the main character, the 6th wireframe which requires me to draw concept art of how the stomach would look like. I had then decided that the GUI side bars should follow the same style as the starting pop ups as they already fit the theme of the different levels. I also made sure they had all the information needed such as the stage number, lives and their required amount of food to take in.

Wireframe

Heart Iterations

Final Iteration

I had made it looked more like pixel art by editing the outer layer block by block.

1st Iteration

I had then decided that the lives should be represented by a heart. This is mainly due to the fact that it is much more obvious than the previous symbol and that it is also rather easy to draw as well.

Original

At the beginning I thought that we were supposed to have a HP bar whereby whenever the player hits a junk food, their lives would decrease. Thus I created this icon so that it could actually represent health.

Inspiration

I had then decided to look for pixelated hearts as i thought that it would be the easiest way to represent the number of lives that the player has left. The reason why it is pixelated is due to the fact that they are the art style i am trying to aim for, for the game and it would be the most basic way to showcase the lives until i could think of something else.

Requirement bar Iterations

To play, press and hold the enter key. To stop, release the enter key.

To play, press and hold the enter key. To stop, release the enter key.

Final Iteration

Added partitions and shows the player how much more they need to collect. I had also made the bar increase from darker shades to pure colour to show progression in the level

Original

It was a bar that i had tried to show increase from an empty bar to a fully filled one. The colours i chose were blue,green ,orangy yellow and red reason being i was going for a rectangle colour scheme.