| Java >
Guidelines Home Page > Java Look and Feel Design Guidelines >
Part II: Fundamental Java Application Design >
4: Visual Design
Visual design and aesthetics affect user confidence in and comfort with your application. A polished and professional look without excess or oversimplification is not easy to attain. This chapter discusses these high-level, visual aspects of Java look and feel applications:
As a software developer, you can use the theme mechanism to control many of the fundamental attributes of the Java look and feel design, including colors and fonts. For instance, you might want to change the colors and fonts in your application to match your corporate identity. The theme mechanism enables you to specify alternative colors and fonts across an entire Java look and feel application.
For more information on using themes, see the description of the
If you want to change the color theme of your application, be sure that your interface elements remain visually coherent. The Java look and feel uses a simple color model so that it can run on a variety of platforms and on devices capable of displaying various depths of color. Eight colors are defined for the interface:
Within the primary and secondary color groups in the default theme, there is a gradation from dark (primary 1 and secondary 1) to lighter (primary 2 and secondary 2) to lightest (primary 3 and secondary 3).
The following table summarizes the eight colors defined in the default Java look and feel theme. It provides swatches and numerical parameters representing each color in the default theme. It also gives details about the roles each color plays in basic drawing, three-dimensional effects, and text.
|Name||Basic Drawing||3D Effects||Text|
|Active internal window borders||Shadows of activated items||System text (for example, labels)|
|Highlighting to indicate activation (for example, of menu titles and menu items); indication of keyboard focus||Shadows (color)|
|Large colored areas (for example, the active title bar)||Text selection|
|Dark border for flush 3D style|
|Inactive internal window borders; dimmed button borders||Shadows; highlighting of toolbar buttons upon mouse button down||Dimmed text (for example, inactive menu items or labels)|
|Canvas color (that is, normal background color); inactive title bar||Background for noneditable text fields|
|User text and control text (including items such as menu titles)|
|Highlights||Background for user text entry area|
Unless you are defining a reverse-video theme, maintain a dark-to-light gradation like the one in the default theme so that interface objects are properly rendered. To reproduce three-dimensional effects correctly, make the secondary 1 color darker than secondary 2, which should be darker than secondary 3 (the background color).
Ensure that primary 1 (used for labels) has enough contrast with the background color (secondary 3) to make text labels easily readable.
The simplest modification you can make to the color theme is to redefine the primary colors. For instance, you can substitute greens for the purple-blues used in the default theme, as shown in the following figure.Figure 24 Green Color Theme
You can use the same value for more than one of the eight colors--for instance, a high-contrast theme might use only black, white, and grays. The following figure shows a theme that uses the same grays for primary 2 and secondary 2. White functions as primary 3 and secondary 3 as well as in its normal role.Figure 25 High-Contrast Color Theme
As part of the theme mechanism and parallel to the color model, the Java look and feel provides a default font style model for a consistent look. You can use themes to redefine font typefaces, sizes, and styles in your application. The default Java look and feel theme defines four font categories, called "type styles": the control font, the system font, the user font, and the small font. The actual fonts used vary across platforms.
|Type Style||Default Theme||Use|
|Control||12-point bold||Buttons, checkboxes, menu titles, labels, and window titles|
|Small||10-point plain||Keyboard shortcuts in menus and tool tips|
|System||12-point plain||Tree components and tool tips|
|User||12-point plain||Text fields and tables|
To ensure consistency, ease of use, and visual appeal, use the supplied default fonts unless there is compelling reason for an application-wide change (such as higher readability). Use the theme mechanism if you do make modifications.
Do not write font sizes or styles directly into your application source code (a programming practice that is also called "hardcoding"). Store font sizes and styles in resource bundles.
Use layout managers to ensure that the layout of your application can handle different font sizes.
Ensure that the font settings you choose are legible and can be rendered well on your target systems.
In the Java look and feel, six methods are used to return references to the four type styles. The
getWindowTitleFont methods return the control font;
getSystemTextFont returns the system font;
getUserTextFont returns the user font; and
getSubTextFont returns the small font.
All fonts in the Java look and feel are defined in the default Java look and feel theme as Dialog, which maps to a platform-specific font.
|Java Look and Feel Design Guidelines, second edition.
Copyright 2001. Sun Microsystems, Inc. All Rights Reserved.