1. 13-1 © Prentice Hall, 2004 Chapter 13: Designing the Human Interface Object-Oriented Systems Analysis and Design Joey F. George, Dinesh Batra, Joseph S. Valacich, Jeffrey A. Hoffer

2. Chapter 13 13-2 © Prentice Hall, 2004 Chapter Objectives Af ter studying this chapter you should be able to: – Explain form and report design. – Apply general guidelines for formatting forms and reports. – Explain effective text, table, and list formatting.

3. Chapter 13 13-3 © Prentice Hall, 2004 Chapter Objectives (Continued) Af ter studying this chapter you should be able to: – Explain interface and dialogue design. – Apply general guidelines for designing interfaces and dialogues. – Explain common errors in developing Web interfaces. – Design human-computer dialogues, including the use of dialogue diagrams.

4. Chapter 13 13-4 © Prentice Hall, 2004

5. Chapter 13 13-5 © Prentice Hall, 2004 What Is a Form? A business document that contains some predefined data and may include some areas where additional data are to be filled in Typically based on a database record or query

6. Chapter 13 13-6 © Prentice Hall, 2004 What Is a Report? A business document that contains only predefined data A passive document meant only for reading or viewing, not data input Typically contains data from many unrelated transactions or records

7. Chapter 13 13-7 © Prentice Hall, 2004 A coding sheet is an “old” tool for designing forms and reports, usually associated with text-based forms and reports for mainframe applications.

8. Chapter 13 13-8 © Prentice Hall, 2004 Visual Basic and other development tools provide computer-aided GUI form and report generation.

9. Chapter 13 13-9 © Prentice Hall, 2004 A typical form design specification: Based on a use case connection Involves three parts: 1)Narrative overview 2)Sample design 3)Assessment

10. Chapter 13 13-10 © Prentice Hall, 2004

11. Chapter 13 13-11 © Prentice Hall, 2004

12. Chapter 13 13-12 © Prentice Hall, 2004

13. Chapter 13 13-13 © Prentice Hall, 2004 Grouping, organization, layout, and highlighting are important considerations in form design

14. Chapter 13 13-14 © Prentice Hall, 2004 Highlighting can include use of upper case, font size differences, bold, italics, underline, boxing, and other approaches.

15. Chapter 13 13-15 © Prentice Hall, 2004

16. Chapter 13 13-16 © Prentice Hall, 2004 Business reports are static, no user interaction. Therefore, business reports are often printed in hardcopy form.

17. Chapter 13 13-17 © Prentice Hall, 2004

18. Chapter 13 13-18 © Prentice Hall, 2004 Bar and line graphs give pictorial summary information that can enhance reports and graphs.

19. Chapter 13 13-19 © Prentice Hall, 2004 Interface/Dialogue Design – Layout (of widgets, text, and table data) – Structuring data entry (tab order) – Controlling data input (validation and format controls) – Feedback (prompting, status, warning, and error messages) – Dialogue sequencing

20. Chapter 13 13-20 © Prentice Hall, 2004 A typical interface/dialogue design specification: Similar to form design, but includes multiple forms and dialogue sequence specifications

21. Chapter 13 13-21 © Prentice Hall, 2004 Data entry structure is concerned with navigation flow.

22. Chapter 13 13-22 © Prentice Hall, 2004 Navigation flow should be natural and intuitive to the user, not disjointed and confusing.

23. Chapter 13 13-23 © Prentice Hall, 2004

24. Chapter 13 13-24 © Prentice Hall, 2004 Feedback Messages Status information – keep user informed of what’s going on, helpful when user has to wait for response Prompting cues – tell user when input is needed, and how to provide the input Warning or Error – informs user that something is wrong, either with data entry or system operation

25. Chapter 13 13-25 © Prentice Hall, 2004 What Is a Dialogue? A sequence of interactions between the system and a user Dialogue design involves: – Designing a dialogue sequence – Building a prototype – Assessing usability

26. Chapter 13 13-26 © Prentice Hall, 2004 Guidelines for Dialogue Design – Consistency – Allow sequence, shortcuts, and reversals in navigation – Frequent feedback – Logical grouping and sequencing of diagrams, with beginning, middle, and end – Comprehensive error handling – Maximize ease and control of use

27. Chapter 13 13-27 © Prentice Hall, 2004

28. Chapter 13 13-28 © Prentice Hall, 2004 Dialogue diagrams depict the sequence, conditional branching, and repetition of dialogues.

29. Chapter 13 13-29 © Prentice Hall, 2004 Recap After studying this chapter we learned to: – Design forms, reports, interfaces, and dialogues. – List and apply accepted guidelines during interface design. – Properly format text, tables, and lists. – Design dialogues using dialogue diagrams.