1. Choose the Proper Screen-Based Controls

2. Operable Controls Buttons
Is developed within the physical constraints imposed by the hardware on which
it is displayed.
Effectively utilizes the capabilities of its controlling software.
Achieves the business objectives of the system for which it is designed.

3. Text Entry/Read-Only Controls
Text Boxes

4. Selection Controls Radio Buttons 426 Check Boxes 435 Palettes 445
List Boxes 450
List View Controls 459
Drop-down/Pop-up List Boxes

5. Combination Entry/Selection Controls
Spin Boxes 465
Combo Boxes 468
Drop-down/Pop-up Combo Boxes 470

6. Presentation Controls
Static Text Fields 487
Group Boxes 488
Column Headings 489
ToolTips 490
Balloon Tips 492
Progress Indicators 494
Sample Box 495
Scrolling Tickers 496

7. Selecting the Proper Controls
Entry versus Selection—A Comparison 496
Comparison of GUI Controls 499
Control Selection Criteria 502
Choosing a Control Form 502
Examples 506

8. Organizing Screen Elements Clearly and Meaningfully
The display elements Must be organized and presented in meaningful and understandable ways.
Consistency:
Provide real-world consistency. Reflect a person’s experiences, expectations, work conventions, and cultural conventions.
Provide internal consistency. (navigational procedures, Visual identity, Component).
Follow the same conventions and rules across all related interfaces.
Deviate only when there is a clear benefit for the user.

9. Ordering of Screen Data and Content
Divide information into units that are logical, meaningful, and sensible.
Organize by the degree interrelationship between data or information.
Provide an ordering of screen units of information and elements that is prioritized according to the user’s expectations and needs.
Possible ordering schemes include:
— Conventional.
— Sequence of use.
— Frequency of use.
— Function.
— Importance.
— General to specific.
Form groups that cover all possibilities.
Ensure that comparable information is visible at the same time.
Ensure that only information relative to the users tasks is presented on the screen.

10. Common information ordering schemes
Conventional.
Sequence of use.
Frequency of use.
Function or category.
Importance.
General to specific.
Arranged should be design based on the language:
Upper-Left Starting Point

11. Visually Pleasing Composition
Provide visually pleasing composition with the following qualities:
— Balance.
— Symmetry.
— Regularity.
— Predictability.
— Sequentiality.
— Economy.
— Unity.
— Proportion.
— Simplicity.
— Groupings.

12. Balance
Create screen balance by providing an equal weight of screen elements, left and right, top and bottom.

13. Symmetry
Create symmetry by replicating elements left and right of the screen centerline.

14. Regularity
Create regularity by establishing standard and consistently spaced horizontal and vertical alignment points. Also, use similar element sizes, shapes, colors, and spacing.

15. Predictability
Create predictability by being consistent and following conventional orders or arrangements.

16. Sequentially
Provide sequentially by arranging elements to guide the eye through the screen in an obvious, logical, rhythmic, and efficient manner.
The eye tends to be attracted to:
— A brighter element before one less bright.
— Isolated elements before elements in a group.
— Graphics before text.
— Color before black and white.
— Highly saturated colors before those less saturated.
— Dark areas before light areas.
— A big element before a small one.
— An unusual shape before a usual one.
— Big objects before little objects.

17. Example

18. Economy
Provide economy by using as few styles, display techniques, and colors as possible.

19. Unity
Create unity by:
— Using similar sizes, shapes, or colors for related information.
— Leaving less space between elements of a screen than the space left at the margins.

20. Proportion
Create windows and groupings of data or text with aesthetically pleasing proportions.

21. Simplicity (Complexity)
Optimize the number of elements on a screen, within limits of clarity.
Minimize the alignment points, especially horizontal or columnar.
— Provide standard grids of horizontal and vertical lines to position elements.