1. System Design Designing the Human Interface Designing Databases
Input processes
Navigation mechanisms
Output screens and reports
Designing Databases
Data
System interfaces
System architecture

2. Classic Design Mistakes
Reducing design time
Feature creep
Switching tools in mid-project

3. Design Considerations
User
Novices – ease of learning
Experts – ease of use
Understand the underlying business function
The DFD will provide a checklist of user tasks to include in the interface design
Processing
Use a modular design

4. External Design Factors
User related
Task related
System related
Environment related

5. Designing Interfaces and Dialogues
Ergonomics
Provide features that promote efficiency
Aesthetics
Build an interface that is easy to use
Technology

6. Designing Layouts
Standard formats similar to paper-based forms and reports should be used
Screen navigation on data entry screens should be left-to-right, top-to-bottom as on paper forms
Menus should be broad and shallow with menu items grouped by interface objects rather than actions

7. Types of Menus Menu bar Tool bar Drop down menu Pop up menu Tab menu
Always on screen
Tool bar
Remains on screen until closed
Drop down menu
Disappears after one use
Pop up menu
Tab menu

8. User Interface Controls
Dialog or text box
Appears when user clicks on a command button
Toggle button
Used to represent on or off status
Check box
If several items can be selected from a list
Radio buttons
If only one item can be selected from a set of mutually exclusive items
Drop down list
A one-line box that opens to reveal a list
Combo
Permits users to type as well as scroll the list

9. Designing Human-Computer Dialogues
Consistency
Shortcuts
Sequence
Feedback
Closure
Error handling
Reversal
Control
Ease

10. Designing Forms and Reports
System inputs and outputs are produced at the end of the analysis phase
Precise appearance was not defined during this phase
Forms and reports are integrally related to DFD and E-R diagrams

11. Forms and Reports Form Report
A business document that contains some predefined data and may include some areas where additional data are to be filled in
An instance of a form is typically based on one database record
Report
A business document that contains only predefined data
A passive document for reading or viewing data
Typically contains data from many database records or transactions

12. Principles of input design
Use on-line and batch processing appropriately
Capture data at the source
Source data automation
Minimize keystrokes
Use default values and lists

13. Types of Input Devices Keyboard and Mouse Telephone and voice Scanner
Touch screen
Video input
Digital camera
Electronic whiteboard
Handheld computer pen
MICR

14. Designing Data Entry Screens
Never require data that are already online or that can be computed
Defaults
Always provide default values when appropriate
Units
Make clear the type of data units requested for entry
Replacement
Use character replacement when appropriate
Captioning
Always place a caption adjacent to fields
Format
Provide formatting examples
Justify
Automatically justify data entries
Help
Provide context-sensitive help when appropriate

15. Functional capabilities
Cursor control capabilities
Editing capabilities
Exit capabilities
Help capabilities

16. Types of Data Errors Appending Truncating Transcripting Transposing
Adding characters
Truncating
Deleting characters
Transcripting
Entering invalid data
Transposing
Reversing the sequence of characters

17. Validation Tests Composition Combination Expected values Missing data
Templates
Range
Reasonableness
Check digit

18. Batch Controls Audit Trail
A record of the sequence of data entries and the date of those entries

19. Providing Feedback Error and Warning Messages Confirmation message
Explain the reason and suggest corrective action
Confirmation message
If the user selects a potentially dangerous choice
Acknowledgement Messages
Provide information to reassure the user that action has taken place
Delay message
If an activity takes more than 5 seconds
Help message

20. Help Guidelines Simplicity Organization Show
Help messages should be short and to the point
Organization
Information in help messages should be easily absorbed by users
Show
It is useful to explicitly show users how to perform an operation

21. Providing Help Context-Sensitive Help
Enables user to get field-specific help
Users should always be returned to where they were when requesting help

22. Types of Help On Help On Concepts On Procedures On Messages On Menus
On Function keys
On Commands
On Words

23. Principles of output design
Understand report usage
Real time versus batch reports
Manage information load
Provide the information needed, not the information available
Minimize bias
Presentation of information should mach the way that information is used

24. Designing Forms and Reports
Follows a prototyping approach
Requirements determination
Who will use the form or report?
What is the purpose of the form or report?
When is the report needed or used? How often must it be updated?
Where does the form or report need to be delivered and used?
How many people need to use or view the form or report?

25. Printed Output
Detail reports
Exception reports
Summary reports

26. Deliverables and Outcome
Design specifications for forms/reports
Narrative
Screen Design
Testing and usability assessment

27. Design Guidelines Use meaningful titles Include meaningful information
Describe content and use
Date to identify the current version
Date to know when the data was valid
Include meaningful information
the needed information
the right amount of detail
Balance the layout
Adequate spacing and margins
Label all data and entry fields
Design an easy navigation system
Display page numbers

30. Highlighting
Use sparingly to draw user to or away from certain information
Blinking and audible tones should only be used to highlight critical information requiring user’s immediate attention
Methods should be consistently selected and used based upon level of importance of emphasized information

31. Displaying Text
Display text in mixed upper and lower case and use conventional punctuation
Use double spacing if space permits. If not, place a blank line between paragraphs
Left-justify text and leave a ragged right margin
Do not hyphenate words between lines
Use abbreviations and acronyms only when they are widely understood by users and are significantly shorter than the full text

32. Formatting columns, rows & text
Sort in a meaningful order
Place a blank line between every 5 rows in long columns
Similar information displayed in multiple columns should be sorted vertically
Columns should have at least two spaces between them
Allow white space on printed reports for user to write notes
Use a single typeface, except for emphasis
Use same family of typefaces within and across displays and reports
Avoid overly fancy fonts

33. Formatting Data
Right-justify numeric data and align columns by decimal points or other delimiter
Left-justify textual data. Use short line length, usually 30 to 40 characters per line
Break long sequences of alphanumeric data into small groups of three to four characters each

34. Designing Dialogues Dialogue Minimize user effort
Sequence in which information is displayed to and obtained from a user
Minimize user effort
Consistency in sequence of actions, keystrokes, and terminology
Three step process
1. Design dialogue sequence
2. Build a prototype
3. Assess usability

35. Interface Structure Diagram
Dialogue Diagram
A formal method for designing and representing human-computer dialogues using box and line diagrams
Consists of a box with three sections
Top: Unique display reference number used by other displays for referencing dialogue
Middle: Contains the name or description of the display
Bottom: Contains display reference numbers that can be accessed from the current display

37. Prototyping Initial prototype is designed from requirements
Users review prototype design and either accept the design or request changes
If changes are requested, the construction-evaluation-request cycle is repeated until the design is accepted

38. Assessing Usability Heuristic evaluation Walkthrough evaluation
Uses a checklist of design principles
Walkthrough evaluation
Demonstrates prototype to users
Interactive evaluation
User navigates through the prototype
Formal usability testing
User works directly with the software alone in a special lab

39. Internet Development: Design Guidelines
Navigation via cookie crumbs
A technique that uses a series of tabs on a Web page to show users where they are and where they have been in the site
Tabs are hyperlinks to allow users to move backward easily within the site
Two important purposes
Allows users to navigate to a point previously visited
Shows users where they have been and how far they have gone from point of entry into site

40. Internet Development: Design Guidelines
Lightweight Graphics
The use of small images to allow a Web page to be displayed more quickly
Forms and Data Integrity
All forms that record information should be clearly labeled and provide room for input
Clear examples of input should be provided to reduce data errors
Site must clearly designate which fields are required, which are optional and which have a range of values

41. Internet Development: Design Guidelines
Template-based HTML
Templates to display and process common attributes of higher-level, more abstract items
Creates an interface that is very easy to maintain