Designing Forms, Reports, and Screens

CMIS570Week 11

Introduction

Human factors in designing HCI General design guidelines Users’ bias Design specifications

SDLCProject Identification

& Selection

Project Initiation& Planning

Analysis

Logical Design***

Physical Design

Implementation

Maintenance

We Are Designing for Humans

Faulty nature of human knowledge and memory, so… 1. 2. 3.

General Guidelines Categories

Layout Text Color Highlighting Navigation

Layout Guidelines 1. Create a unique site identity and strive for consistency

Fonts What is background, foreground Graphics size, color, shape

2. 3. 4. 5. 6.

1 2

34

Text Guidelines Avoid large blocks of text; reading is

25% less efficient online Limit lines of text to 60 characters Left justify text to improve readability Avoid words in all upper case letters Clear and specific titles describing

content and use No hyphens, abbreviations, or

acronyms Revision date or date when data was

generated

Color Guidelines

Only useful when information is most effectively displayed (cannot improve on garbage)

Limit browser-safe colors to 3 or 4 complimentary colors

Simplify background Can be soothing, provide interest, emphasize

logical organization, and draw attention to warnings

Can degrade resolution and fidelity with different display units and can be a problem for color blindness

Includes blinking, audible tones, color differences, intensity differences, size differences, font differences, boxing, underlining, ALL CAPITAL LETTERS, offsetting positions, and

Use sparingly to draw user to or away from certain information (errors, warnings, keywords, high priority messages, changed data, data outside normal ranges

Use consistently

Highlighting Guidelines

reverse video

Navigation Guidelines 1. Use consistent means of

navigation with visual cues. 2. 3. 4.

What Is Wrong With This?

USE MIXED UPPER & LOWER CASE AND --(CONVENTIONAL

PUNCTUATION) USE DOUBLE SPACING IF SPACE

PERMITS LEFT-JUSTIFY TEXT AND LEAVE A

RAGGED RIGHT MARGIN DO NOT HY-

PHENATE WORDS BE-TWEEN LINES

UAAACOWU NO GRAPHIC EXPLANATION

Information Bias How you format

information influences how it is perceived by the user

Bias includes providing 1. 2. 3. 4.

Design Specifications for Forms, Reports, & Screens

Narrative Overview Who will use it? What & when is the task performed?

Sample Design Testing and usability assessment

Can you complete the task efficiently? (time to learn, speed of performance, rate of errors, rate of retention)

Is the form/report accurate? (expectations, confidence)

Do you like using the form/report? (satisfaction)

Guidelines to Design Maintain consistency and standards Allow shortcuts and accelerator keys Provide feedback to user actions Provide logical sequencing & closure Report all errors & suggest solutions Allow for reversals of actions Make the user feel in control Provide simplicity and ease of use

Related Web Sites

www.websitesthatsuck.com www.webreview.com www.useit.com www.killersites.com www.lynda.com