1

Information Systems Analysis

and Design

Lecture 8:
Designing databases, forms, reports, interfaces,
dialogues

Information Systems Department

Learning Objectives
2

 Explain the role of designing databases in the analysis and

design of an information system.
 Transform an entity-relationship (E-R) diagram into an
equivalent set of well-structured (normalized) relations.
 Explain the process of designing forms and reports.
 Apply the general guidelines for formatting forms and reports.
 Use color and know when color improves the usability of
information.
Learning Objectives
3

 Explain how to assess usability and describe how variations in

users, tasks, technology, and environmental characteristics
influence the usability of forms and reports.
 Explain the process of designing interfaces and dialogues and the
deliverables for their creation.
 Contrast and apply several methods for interacting with a system.
 Design human-computer dialogues and understand how dialogue
diagramming can be used to design dialogues.
 Design graphical user interfaces.
Introduction
4

FIGURE 9-1
Systems development
life cycle with design
phase highlighted
Database Design
5

 File and database design occurs in two steps.

1. Develop a logical database model, which describes data using
notation that corresponds to a data organization used by a database
management system.
 Relational database model
2. Prescribe the technical specifications for computer files and
databases in which to store the data.
 Physical database design provides specifications
 Logical and physical database design in parallel with other
system design steps
6
6

FIGURE 9-2
Relationship between data modeling and the systems development life cycle
3/28/21 Information Systems Department
The Process of Database Design
7

 Four key steps in logical database modeling and

design:
1. Develop a logical data model for each known user interface (form
and report) for the application using normalization principles.
2. Combine normalized data requirements from all user interfaces into
one consolidated logical database model (view integration).
3. Translate the conceptual E-R data model for the application into
normalized data requirements.
4. Compare the consolidated logical database design with the translated
E-R model and produce one final logical database model for the
application.
Physical Database Design
8

 Key physical database design decisions include:

 Choosing a storage format (data type) for each attribute from
the logical database model.
 Grouping attributes from the logical database model into
physical records.
 Arranging related records in secondary memory (hard disks
and magnetic tapes) so that records can be stored, retrieved
and updated rapidly (File organization).
 Selecting media and structures for storing data to make
access more efficient.
Deliverables and Outcomes
9

 Logical database design

 Must account for every data element on a system input
or output- form or report – and E-R diagram
 Normalized relations are the primary deliverable.
 Physical database design
 Converts relations into database tables.
 Programmers and database analysts code the definitions of the
database.
 Written in Structured Query Language (SQL).
Relational Database Model
10

Relational Database: data represented as a set of related

tables (or relations).

Relation: a named, two-dimensional table of data. Each

relation consists of a set of named columns and an
arbitrary number of unnamed rows.

Well-Structured Relation: a relation that contains a

minimum amount of redundancy and allows users to
insert, modify, and delete the rows without errors or
inconsistencies
Well-Structured Relation
11

No redundancy, and data pertains to a single entity, an employee

Designing Forms and Reports
12

FIGURE 10-1
Systems development life
cycle with logical design
phase highlighted
Designing Forms and Reports
13
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
Common Types of Reports
14

o Scheduled: produced at predefined time intervals for routine

information needs
o Key-indicator: provide summary of critical information on
regular basis
o Exception: highlights data outside of normal operating ranges
o Drill-down: provide details behind summary of key-indicator
or exception reports
o Ad-hoc: respond to unplanned requests for non-routine
information needs
The Process of Designing Forms and
15
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?
The Process of Designing Forms and
16
Reports (cont.)
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-
refinement cycle is repeated until the design is
accepted
The Process of Designing Forms and
17
Reports (cont.)
 A coding sheet is an “old” tool for designing forms and
reports, usually associated with text-based forms and
reports for mainframe applications. (Figure 10-2)

 Visual Basic and other development tools provide

computer aided GUI form and report generation (Figure
10-3B)
The Process of Designing Forms and
Reports (Cont.)

FIGURE 10-2
The layout of a data input form
using a coding sheet
The Process of Designing Forms and Reports
(Cont.)

FIGURE 10-3B
A data input screen designed in
Microsoft’s Visual Basic .NET
(Source: Microsoft Corporation.)

Figure 10-3A
A data input screen designed as a
wireframe
Deliverables and Outcomes
20

 The major deliverable of form and report design is

the design specification.
 Involves three parts:
 Narrative overview: characterizes users, tasks, system,
and environmental factors
 Sample design: image of the form (from coding sheet or
from building development tool)
 Assessment: measuring test/usability results (consistency,
sufficiency, accuracy, etc.)
General Guidelines for Form and Report Design
21

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
Design an Easy navigation system: show how to
move forward and backward, and where you are
currently
Formatting Forms and Reports
(Cont.)

FIGURE 10-5
Contrasting customer
information forms
(Pine Valley Furniture)
(Source: Microsoft
Corporation.)

(a) Poorly designed form

Formatting Forms and Reports
(Cont.)

FIGURE 10-5 (continued)

(b) Improved design for form

Uses of Highlighting in Forms and Reports
24

Notify users of errors in data entry or processing.

Provide warnings regarding possible problems.
Draw attention to keywords, commands, high-
priority messages, unusual data values.
Methods for Highlighting
25

• Blinking • Reverse video

• Audible tones • Boxing
• Intensity differences • Underlining
• Size differences
• Font differences • All capital letters
• Offset positions
of nonstandard
information
Highlighting Information (Cont.)

FIGURE 10-6
Customer account
status display using
various highlighting
techniques
(Pine Valley Furniture)

(Source: Microsoft
Corporation.)
Color vs. No Color
27

 Problems from Using Color

 Benefits from Using Color – Color pairings may wash
o Soothes or strikes the eye
out or cause problems for
o Accents an uninteresting
some users
display – Resolution may degrade
o Facilitates subtle
discriminations in complex with different displays
displays – Color fidelity may
o Emphasizes the logical degrade on different
organization of information displays
o Draws attention to warnings – Printing or conversion to
o Evokes more emotional other media may not
reactions easily translate
Guidelines for Displaying Text
28

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
Displaying Text (Cont.)

FIGURE 10-7
Contrasting the display of
textual help information
(Source: Microsoft
Corporation.)

(a) Poorly designed help

screen with many
violations of the general
guidelines for displaying
text
Displaying Text (Cont.)

FIGURE 10-7 (continued)

(b) An improved design for

a help screen
Guidelines for Displaying Tables and Lists
31

Use Meaningful 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.
Guidelines for Displaying Tables and Lists (cont.)
32

 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.
Guidelines for Displaying Tables and Lists (cont.)
33

 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-40
characters per line
 Break long sequences of alphanumeric data into small groups of
three to four characters each
Designing Tables and Lists (Cont.)

FIGURE 10-8
Contrasting the display of tables
and lists (Pine Valley Furniture)
(Source: Microsoft Corporation.)

(a) Poorly designed form

Designing Tables and Lists (Cont.)

FIGURE 10-8 (continued)

(b) Improved design for form

Assessing Usability
36

 Overall evaluation of how a system performs in

supporting a particular user for a particular task
 There are three characteristics
1. Speed. Can you complete a task efficiently?
2. Accuracy. Does the output provide what you expect?
3. Satisfaction. Do you like using the output?
General Design Guidelines for Usability of Forms
and Reports
37

Consistency: of terminology, formatting, titles,

navigation, response time
Efficiency: minimize required user actions
Ease: self-explanatory outputs and labels
Format: appropriate display of data and symbols
Flexibility: maximize user options for data input
according to preference
Characteristics for Consideration When
Designing Forms and Reports
38

User: experience, skills, motivation, education,

personality
Task: time pressure, cost of errors, work durations
(influence usability)
System: platform (influence interaction styles and
devices)
Environment: social (statues and roles) and physical
issues (lighting, sound, work facilities)
Measures of Usability
39

Time to learn
Speed of performance
Rate of errors
Retention over time
Subjective satisfaction
Designing Interfaces and
40
Dialogues

FIGURE 11-1
Systems development life cycle (SDLC)
Deliverables and Outcomes
41

 Creation of a design specification

 A typical interface/dialogue design specification is
similar to form design, but includes multiple forms
and dialogue sequence specifications.
Deliverables and Outcomes (Cont.)
42

 The specification includes:

 Narrative overview
 Sample design
 Testing and usability assessment
 Dialogue sequence
 Dialogue sequence is the ways a user can move
from one display to another.
Figure 11-2
Specification outline for the
design of interfaces and
dialogues
Interaction Methods and Devices
44

 Interface: a method by which users interact with

an information system
 All human-computer interfaces must:
 have an interaction style, and
 use some hardware device(s) for supporting this
interaction.
Methods of Interacting
45

 Command line
 Includes keyboard shortcuts and function keys
 Menu
 Form
 Object-based
 Natural language
Command Language Interaction
46

 Command language interaction: a human-computer

interaction method whereby users enter explicit statements
into a system to invoke operations
 Example from MS DOS:
 Example from Linux command prompt:
$ cp file.doc newfile.doc
 Makes a copy of file.doc and names it newfile.doc

 The dollar sign is the command prompt from Linux, not part

of the command itself.

Menu Interaction
47

A list of system options is provided and specific

command is invoked by user selection of a menu
option
Two common menu types:
 Pop-up: menu placed near current cursor position
 Drop-down: access point to menu placed at top line of
display, menu drops down when access point clicked
Figure 11-5
Various types of menu configurations
(Source: Based on Shneiderman et al., 2009.)
Menu Interaction (Cont.)

FIGURE 11-8
Menu building with
Microsoft Visual
Basic .NET
(Source: Microsoft
Corporation.)
Guidelines for Menu Design
50

 Wording: meaningful titles, clear command verbs,

mixed upper/lower case
 Organization: consistent organizing principle
 Length: all choices fit within screen length
 Selection: consistent, clear and easy selection
methods
 Highlighting: only for selected options or unavailable
options (gray text)
Menu Interaction
51
Menu Interaction
52
Menu Interaction (Cont.)

FIGURE 11-8
Menu building with
Microsoft Visual
Basic .NET
(Source: Microsoft
Corporation.)
Form Interaction
54

 Form interaction: a highly intuitive human-

computer interaction method whereby data fields
are formatted in a manner similar to paper-based
forms
 Allows users to fill in the blanks when working with a
system.

Chapter 11
Form Interaction (Cont.)

FIGURE 11-9
Example of form
interaction from the
Google Advanced
Search Engine
(Source: Google.)
Object-Based Interaction
56

 Object-based interaction: a human-computer

interaction method in which symbols are used to
represent commands or functions
 Icons: graphical pictures that represent specific
functions within a system
 Use little screen space and are easily understood by
users
Object-Based Interaction (Cont.)

Figure 11-10
Object-based (icon)
interface from the Option
menu in the Firefox Web
browser
(Source: Mozilla Firefox.)
Natural Language Interaction
58

 Natural language interaction: a human-

computer interaction method whereby inputs to
and outputs from a computer-based application
are in a conventional spoken language such as
English
 Based on research in artificial intelligence.
 Current implementations are tedious and difficult
to work with, not as viable as other interaction
methods.
Designing Interfaces
59

Use standard formats similar to paper-based forms

and reports
Left-to-right, top-to-bottom navigation
Flexibility and consistency:
 Free movement between fields
 No permanent data storage until the user requests
 Each key and command assigned to one function
Designing Interfaces (cont.)
60

 Designing Layout (of text, and table data)

 Structuring Data Entry

 Controlling Data Input (validation and format

controls)
 Providing Feedback (prompting, status,

warning, and error messages)

 Providing Help
What is a Dialogue?
61

A sequence of interactions between the system and

a user

Dialogue design involves:

 Designing a dialogue sequence
 Building a prototype
 Assessing usability
Guidelines for the Design of Human-
Computer Dialogue
62

 Consistency  Error Handling

 Shortcuts and  Reversal
Sequence  Control
 Feedback  Ease
 Closure (clear
start, and end)
Designing the Dialogue Sequence (Cont.)

 Three sections of the box:

 Top—contains a unique display reference number used by
other displays for referencing it
 Middle—contains the name or description of the display
 Bottom—contains display reference numbers that can be
accessed from the current display
Dialogue Diagramming
64

A formal method for designing and representing human-

computer dialogues using box and line diagrams
Designing the Dialogue Sequence (Cont.)

FIGURE 11-17
Sections of a dialogue diagramming box
Designing Interfaces and Dialogues in Graphical
Environments Rules
66

Become an expert user of the GUI environment.

 Understand how other applications have been designed.
 Understand standards.
Gain an understanding of the available resources
and how they can be used.
 Become familiar with standards for menus and forms.
Summary
67
67

 Explain the role of designing databases in the analysis

and design of an information system.
 Transform an entity-relationship (E-R) diagram into an
equivalent set of well-structured (normalized) relations.
 Explain the process of designing forms and reports.
 Apply the general guidelines for formatting forms and
reports.
 Use color and know when color improves the usability
of information.

3/28/21 Information Systems Department

Summary
68
68

 Explain how to assess usability and describe how variations

in users, tasks, technology, and environmental
characteristics influence the usability of forms and reports.
 Explain the process of designing interfaces and dialogues
and the deliverables for their creation.
 Contrast and apply several methods for interacting with a
system.
 Design human-computer dialogues and understand how
dialogue diagramming can be used to design dialogues.
 Design graphical user interfaces.

3/28/21 Information Systems Department

Reference
69
69

Modern Systems Analysis and Design, Eighth Edition, Global

Edition, Joseph S. Valacich & Joey F. George –
Chapter 9, 10, 11.