Screen Design
Multimedia developers need to be able to understand how to:
- Arrange text in the proper size, color, and font on a multimedia screen
- Choose an appropriate background color and understand how foreground text colors interact with background screen colors
- Arrange pictures on the screen either as background images or design elements for text to flow around
- Make text stand out against a background photo
- Adopt a common look and feel for the screens in your application
Layout
Multimedia screens consist of several design elements, including text, pictures, icons, triggers, and buttons. The relationships among these elements on the screen are called layout. When you create a multimedia screen, you should plan its layout so your content gets presented with good balance. Think of dividing the screen into regions, of which some will be pictorial, with others consisting of blocks of text. You must also think about how the user will interact with your screen, and include the appropriate navigational buttons and hypertext links.
Font Selection
TrueType font technology enables you to place any font on the screen in any size and color you want. There are hundreds of different fonts available from vendors such as Adobe and Corel. But be careful when you choose a font for a multimedia application you intend to publish. If the font you choose is not installed on the user’s machine, your screen will not appear as intended.
You can rely on all Windows and Macintosh users having the standard fonts listed below. If your application uses a font your users don’t have, you must publish that font along with your application. Most fonts are licensed and protected by copyright; make sure you have permission for any fonts you distribute.
Times New Roman: ABCDEFGabcdefg123456789
Courier New: ABCDEFGabcdefg123456789
Arial: ABCDEFGabcdefg123456789
Georgia: ABCDEFGabcdefg123456789
Verdana: ABCDEFGabcdefg123456789
Of the fonts illustrated above, all are proportionally spaced except for Courier New. Proportional spacing means that wide letters like m and w take up more space than thin letters like l and i. Normally, you will want to use a proportional font, because proportional fonts are easier to read than monospaced fonts. However, if you want to make columns of text line up precisely on the screen, such as in a spreadsheet, you will need to use the nonproportional Courier font. The following example illustrates the difference between proportional and nonproportional spacing.
Times New Roman (proportional spacing)
Sales: $100,000 $85,000 $43,614
Taxes: 54,521 3,425 6,921
Fees: 231,947 41 324Total: $386,468 $88,466 $50,859
Courier New (nonproportional spacing)
Sales: $100,000 $85,000 $43,614
Taxes: 54,521 3,425 6,921
Fees: 231,947 41 324Total: $386,468 $88,466 $50,859
An important difference between the Times New Roman and Arial fonts is that Times New Roman has serifs, whereas Arial does not. A serif is a line stemming at an angle from the ends of the strokes of a letter. Typefaces without serifs are called sans serif fonts. The following illustration compares a few characters from the Times New Roman and Arial fonts, pointing out the serifs in Times New Roman:
