Chapter 19: Designing Look and Feel

Visual interfaces should:
Avoid visual noise and clutter:
Visual noise in interfaces is the result of superfluous visual elements that distract from those visual elements that directly communicate software function and behavior. "Perfection is attained not when there is no longer anything to add, but when there is no longer anything to take away". "Things should be as simple as possible, but no simpler."

leverage - using elements in an interface for multiple, related purposes.

User contrast, similarity, and layering to distinguish and organize elements:
A visual interface is based on visual patterns. 3D works as manipulable affordance = dimensional contrast
Dark, cool, desaturated colors recede; light, warm, saturated color advance. Large elements advance; Smaller elements recede.

The Squint Text; the mirror test (view upside down)

Provide visual structure and flow at each level of organization:
Eyes go from left to right, top to bottom.

Use cohesive, consistent, and contextually appropriate imagery
Integrate style and function comprehensively and purposefully.

Principles of Visual Information Design:
Edward Tufte - "good visual design is clear thinking made visible"
common problems - multidimensional information on 2D surface, computer monitors.

1. Enforce visual comparisons
Allow previews, for example.
2. Show causality
Provide hints of cause and effect.
3. Show multiple variables
Can manipulate variables e.g. hiding/showing layers of Photoshop
4. Integrate text, graphics, and data in one display
e.g. graphs should rely on legend.
5. Ensure the quality, relevance, and integrity of the content
All information should lead to goals.
6. Show things adjacently in space, not stacked in time
Show change adjacently in space.
7. Not de-quantify quantifiable data
graphs are good, but don't ignore the numbers as well.

Use of Text and Color in Visual Interfaces:
Navigation by visual elements is faster than navigation by textual elements.
Avoid using all caps - harder to read pattern
Visually show what; textually show which.

Color:
-draws attention
-improves navigation and scanning speed
-shows relationships
Misuse color:
-too many colors
chromostereopsis = colors on the opposite end of the spectrum "vibrate" when placed adjacently.
Red text on a blue background is extremely difficult to read.
-excessive saturation
-inadequate contrast - color differ only in hue
-inattention to color impairment
10% of male population is color-blind. Check grayscale version

Consistency and Standards:
Consistency implies a similar look, feel, and behavior across the various modules of a software product.
There are benefits and risks to following standards.
Obey standards unless there is a truly superior alternative