1. Chapter 11 Designing Forms and Reports

2. Objectives: • Explain the process of form and report design. • Apply general guidelines for formatting forms and reports. • Use color and know when color improves the usability of information. • Format text, tables, and lists effectively. • Explain how to assess usability and describe factors affecting usability.

4. Forms vs. Reports • Form • 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.

5. Forms vs. Reports • System inputs and outputs were identified during Requirements Structuring • Every input form will be associated with a data flow entering a process on a DFD • Every output form or report will be a data flow produced by a process on a DFD • Data on forms and reports must consist of data elements in data stores and on the E-R data model or must be calculated from these • Will uncover flaws in DFDs and E-R diagrams

6. Common Types of Reports • Scheduled: produced at predefined time intervals for routine information needs • Key-indicator: provide summary of critical information on regular basis • Exception: highlights data outside of normal operating ranges • Drill-down: provide details behind summary of key-indicator or exception reports • Ad-hoc: respond to unplanned requests for non-routine information needs

7. The Process of Designing Forms and Reports • User-focused activity • 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? • Where does the form or report need to be delivered and used? • How many people need to use or view the form or report?

8. The Process of Designing Forms and Reports • Prototyping • Initial prototype is designed from requirements • If possible, use standard development tools used with your company • Mock screens – word processor, etc. can be used • Users review prototype design and either accept the design or request changes • If changes are requested, the construction-evaluation-refinement cycle is repeated until the design is accepted

9. Visual Basic and other development tools provide computer aided GUI form and report generation.

10. Form/Report Design Specification • The major deliverable of interface design • Involves three parts (reference figure 11-4): • Narrative overview: characterizes users, tasks, system, and environmental factors • Used primarily to highlight some exception that must be considered during implementation • Sample design: image of the form (from coding sheet or form building development tool) • Assessment: measuring test/usability results (consistency, sufficiency, accuracy, etc.) • If required

11. Guidelines for Form and Report Design • Meaningful titles: clear, specific, version information, current date • Meaningful information: include only necessary information, with no need to modify • Balanced layout: adequate spacing, margins, and clear labels • Easy navigation system: show how to move forward and backward, and where you are currently

12. A poor form design

13. A better form design

14. Uses of Highlighting in Forms and Reports • Use sparingly! • Notify users of errors in data entry or processing. • Provide warnings regarding possible problems – unavailable device. • Draw attention to keywords, commands, high-priority messages, data values that have changed or are outside normal operating range. • Boxes clarify different categories of data, capital letters and different fonts distinguish labels from actual data

15. Methods for Highlighting • Reverse video • Boxing • Underlining • All capital letters • Offset positions of nonstandard information • Use consistently! • Think of output device • Blinking • Audible tones • Intensity differences • Size differences • Font differences • Blinking, audible-critical, turn off as soon as correction made

16. Highlighting can include use of upper case, font size differences, bold, italics, underline, boxing, and other approaches.

17. Color vs. No Color • Benefits from Using Color • Soothes or strikes the eye • Accents an uninteresting display • Facilitates subtle discriminations in complex displays • Emphasizes the logical organization of information • Draws attention to warnings • Evokes more emotional reactions

18. Color vs. No Color • Problems from Using Color • Color pairings may wash out or cause problems for some users • Resolution may degrade with different displays • Color fidelity may degrade on different displays • Printing or conversion to other media may not easily translate • Color has little effect if presentation format is inappropriate

19. Guidelines for Displaying Text • Case: mixed upper and lower case, use conventional punctuation • Spacing: double spacing if possible, otherwise blank lines between paragraphs • Justification: left justify text, ragged right margins • Hyphenation: no hyphenated words between lines • Abbreviations: only when widely understood and significantly shorter than full text

20. A poor help screen design

21. A better help screen design

22. Guidelines for Tables and Lists • Labels • All columns and rows should have meaningful labels. • Labels should be separated from other information by using highlighting. • Redisplay labels when the data extend beyond a single screen or page.

23. Guidelines for Tables and Lists • Formatting columns, rows and text: • Sort in a meaningful order. • Place a blank line between every five 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.

24. Guidelines for Tables and Lists • Formatting numeric, textual and alphanumeric 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.

25. A poor table design

26. A better table design: row and column spacing, soritng

27. Tables vs. Graphs • Use tables for reading individual data values • Use graphs for: • Providing quick summary • Displaying trends over time • Comparing points and patterns of variables • Forecasting activity • Simple reporting of vast quantities of information

29. Bar and line graphs give pictorial summary information that can enhance reports and forms.

30. Assessing Usability • Overall evaluation of how a system performs in supporting a particular user for a particular task • There are three characteristics • Speed • Accuracy • Satisfaction

31. Guidelines for Maximizing Usability • Consistency: of terminology, formatting, titles, navigation, response time • Efficiency: minimize required user actions; align for efficient navigation and entry; avoid data entry where possible • Ease: self-explanatory outputs and labels • Format: appropriate display of data and symbols • Flexibility: maximize user options for data input according to preference

32. Characteristics for Consideration When Designing Forms/Reports • User: experience, skills, motivation, education, personality • Task: account for time pressure, cost of errors, work durations (fatigue) that the task demands from the user • System: platform will influence interaction style and devices • Environment: social (user’s role) and physical issues (may need to change physical work space)

33. Methods for Assessing Usability • Time to learn – placement of most commonly used functions • Speed of performance • Rate of errors • Retention over time • Subjective satisfaction • Collect by observation, interviews, keystroke capturing, etc.

34. Errors in Web Page Layout Design • Non-standard widgets – radio buttons example (selection, not selection and action!) • Appearance of advertising and legitimate information • Bleeding edge technology – make sure users don’t need the latest browsers or plug-ins to use your site • Scrolling text and looping animations – hard to read and like advertising • Outdated information – you’ll lose credibility • Slow download times • Fixed formatted text – avoid horizontal scrolling • Long pages

35. Good Web Design Practices • Lightweight Graphics: small images to quick image download • Forms and Data Integrity: • Forms should be clearly labeled • Enough room for input • Example of input format • Fields: designate optional, required, range of values

36. Good Web Design Practices • Template-based HTML • Templates to display and process common attributes of higher-level, more abstract items • Have a few templates that can be used to display the entire product line • “display all finishes” can be built using a template and then applied to all furniture requiring a finish • Creates an interface that is very easy to maintain