UI Work

Hello all,  the post below is from the development post I did for Space Budgie.  If you want to go to the original post, go Here, plus,  there are plenty of other development posts there, go take a look.


Hello everyone, it is I, Mus. I wish you all a very belated Happy New Year and that you all have stuck to those New Year’s resolution commitments…..I haven’t, well maybe.  The team took the time off for the Christmas break, a much needed and deserved break.  I am happy to say we all have returned to work…. I know, I made sure, I done a head count….. I think we are all here.

Now that’s out the way and let’s get right to business of work. Over the last couple of months my work has been split between Concept artwork, UI iterations, Level Editor UI, creating New and iterating icons and the ingame Pause Menu.


I just stuck the images to show I am working hard, see.

Moving along,  I am going to stick with the Pause Menu for this  blog post. I’m going to try and make this exciting, so here we go…… I think I am going to fail with the exciting bit.  One of the last parts of the game that needed an overhaul and it was a long time coming was for the Pause Menu, it is one of the last remnants left in the current build of Glitchspace and I think you can still see it in the Legacy version.  I’ve added a couple of screenshots to remind me.


Looking back on it, I am not a fan of the original version as there were a few problems:  the text was centralised and it looked like the pause menu was in a bad mood and shouted at the player, besides the look of it did not match the rest the game’s visual style and the font was all  upper case and. But in defence, it was done quickly and the team kept meaning to get back to it and eventually we did.

For the new version I had the idea for the Pause Menu look on my mind for a while.  The Menu itself was an extension of the Front End menu and Ingame Null Canvas, it made it easier to quickly create a few mocks ups and there were a couple of mocks up I liked, a semi transparent white version and semi transparent darker version. My preference was the darker version as the white version caused eye fatigue and eye strain…. Something I did not like to experience.



With a moderate success for the Pause Menu,  I created a Pause Menu diagram, just to help place and  to keep track of where everything  was in the menu and more importantly  to keep myself sane.  I know,  it does not look exciting.


After that, I blocked and created the rest of the Pause menu pages, to see how they would look


One problem I was concerned about was the contrast, because as the game environments varied from dark purple to light blue I  had to double check if it the menu worked, I took three screenshots from the game, then Pause Menu design was overlaid on the three backgrounds.

Like so:

Light Background


Medium Background


Dark Background


And I was relieved and happy to say that it worked, phew. ….. It may not be exciting. However, these are important things to be checked and rechecked,  if need rechecked again.

The next step with the Pause Menu was to optimise and reduce the file assets sizes, this is good practice and because the programmer asked me to do it and I could not refuse.  The icons were created and checked in illustrator, then used  its 9 Slice Scaling options to check if they was no distortions to them, once that was done,  we used Unity’s 9 Slice Scaling option on the sprites and they still worked with no distortion or issues to the sprite.

The image below has the example of the original square sprite using the 9 slice scaling and scaled to the rectangle with no issues, easy…… But don’t tell anyone about this, somehow I forgot about this, don’t tell the rest of the team, I am trying to be a consummate professional here and I pretended to know that…. shhhhhh



The current state of the Pause Menu is that it has been implemented and it is working,  it will to need to be fine tuned, elements  fixed, font sizes and layouts sorted and corrected with additional testing and further iterations to spot anything overlooked and missed, which usually we find something we missed.



I am happy with how the Pause Menu looks and it has come a long nicely. So for now, I bid you all adieu for now, I bow out here to get back to work and get more stuff done. If it is needed to make my next post exciting,  I shall do it with a motorbike stunts of some sorts.  Keep an eye out for the new Pause Menu on one of the upcoming updates and my post ends here…….. for now.




Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )


Connecting to %s