Game Development Reference
In-Depth Information
al feedback Remember that the disabled buttons can have the auditory feed-
back: some sounds that demonstrate that the button is inactive can be used.
•
Pressed
: This state makes any button alive, because it demonstrates that
the button is answering the user's action. Its graphical representation differs
from the normal state, so the user can easily see a visual feedback.
The recipe for a good button is simple: It is a rectangular flat plate covered with some
appealing texture and some minor ornamentation, for example, frames, shadows,
pins, and so on. While planning the graphic look, try to not overwhelm it with details.
Although the device screen is flat and smooth, people hesitate to push virtual but-
tons with unpleasant surfaces, for example, there is a delay before a button on which
nails or splinters are drawn is tapped. A flat design of controls introduced in iOS 7
lets you spend less time decorating buttons, they can have very simple graphical
appearances, for example, flat rectangles with some solid paint or delicate gradient
fills.
Nevertheless, it is important to remember that a minimalistic design works well only
if the edges of artwork are sharp and accurate; if the image is blurred because it
was scaled by the application, the magic disappears. If you are not sure whether the
game is capable to display controls in an actual scale (1:1) to an image source, it is
better to use more decorative design approaches such as elements with shadows,
textures, and so on, because they can keep a pretty satisfactory look when being
scaled. This is why classic iOS had so many photorealistic UI elements with natural
textures, gloss effects, and so on. Such elements look very good on non-retina dis-
plays with low resolutions.
The user perceives the functionality of any button (and UI elements in the gross)
via its feedback, visual and auditory. Being successfully pressed and having started
the corresponding action, the button displays its functionality by changing its look
(the pressed state becomes active) and raising an alarm with a short sound effect.
The pressed state should have obvious differences with the other states of the but-
ton. Usually, the designer mimics the behavior of buttons from the real world, so the
virtual buttons are pushed down a little bit, they become smaller, and move down
a few pixels. It is good practice to change their color or brightness. The more ex-
pressive the artistic way of displaying the pushing procedure, the more functional
the buttons seem to the user. Note that an efficient button is wider than the user's
