Screen Design Principles

1
Screen Design Principles

• By John Sullivan

2
Layout

• Multimedia screens consist of several design
  elements
• text, graphics, icons, triggers, and buttons
• The relationship among these is called layout
• Think of dividing the screen into regions
• You must think about how the user will interact
  with your screens, and include appropriate
  navigation buttons and hypertext links.

3
Font selection

• Microsofts Windows True Type font technology
  enables you to place any font on the screen in
  any size and color you want.
• WYSIWYG
• Very Important the users machine must have the
  font you want to use.
• Otherwise you have to turn them all into graphics
• Kerning or Proportional spacing
• Text size depends on users distance from screen
  or whether it is for individual or group use.

4
Foreground Versus Background Color

• When placing text on busy photographic
  backgrounds use a drop shadow
• Do not over use drop shadow
• Better to position text above or below a picture,
  or to flow text around a picture, rather than
  overlay text on top of image.

5
Buttons

• Navigational icons normally work best when they
  appear lined up in the same region of the screen,
  instead of being scattered around the screen.
• Try to position in logical order
• Remember ease of use

6
Hypertext

• can be self-documenting
• Examples Return to the Menu, Next Page,
  Previous Page, Stop, Print, Quit.
• Iconic navigation is usually more effective,
  takes up less space, and works better with
  international audiences.

7
Metaphors

• is a way of thinking about new media in terms of
  something the user already knows.

8
Adopting a Common Look and Feel

• KISS - Keep it simple stupid
• Do not make every screen look and work a
  different way.
• Adopt a common look and feel
• Do not mix metaphors and change icons meanings.
• Be consistent
• Use golden rule of interface design.

9
The End

• John Sullivan