Sunday, December 1, 2013

Much Button

     I'm a bit of a night owl, and spent a couple hours in this night worrying about buttons. I made a photo dump a while ago which featured our beautifully ugly buttons and the main button artist is hard at sleep, so in my brilliance I decided to make placeholders (which are sadly worse than what we began with).

     The first photo shows a room selected before I began making any changes. 
     You can see how much space the buttons do not use. The deselect button is hardly legible, and some of those play testers didn't notice them immediately. This was the problem I set out to solve. It is one of the many things on my plate and kind of more of a personal tackle.

Original Button Layout

     I made some placeholders and gave them an outline. I didn't take a picture pre-outline, but I noticed that you could hover over the blank space and still select the button. This was important to keep the legibility of the buttons up. We wouldn't want players to click on what they think is nothing and actually press a button! Already, the buttons stand out (and for the record, I activated all of the buttons just for the proof of concepts.), the large button is the deselect button, in a common "back" location and slightly bigger than the rest. The picture below shows how the button changes when you hover over it, my mouse wasn't captured in the screenshot unfortunately.

New Hotness layout!

Top Left: Button highlights!

     I added some background boxes to the buttons. This helps them pop out a bit more and would obviously be noticeable now, but I feel like we could drive the point a bit further. Fun fact: when changing the buttons on the fly the room deselects for some reason. Hopefully players don't have to worry about this as they shouldn't have access to the code during game play!

Background added.

     I hovered over the deselect button again, but the main point is I added a placeholder background image. It's just a black box which made for an interesting... clash. Another change is I zoomed the room in a bit more. This should help with a problem that may or may not be discussed later on. More importantly, the buttons are basically on a panel now, which makes them stand out tremendously and draws the player's eye. Currently it is a bit clashing as the black is very bold against the rest of the game.

Major clash, but background darkened.

     These images are placeholder, once again. It is pretty late so I didn't give it my all for them and the person in charge of the buttons currently is working hard on his sleep. We will revisit the button topic if it becomes relevant, or when we get much closer to the final  layout and configuration. Until next time!