Lecture 8

Interface design: The process of defining how the system will interact with external entities.
User Interface Mechanisms (fundamental parts)
• Navigation: the way in which the user gives instructions to the system (EX: buttons, menus).
• Input: the way in which the system takes information (EX: forms for adding new customers).
• Output: the way in which the system provides information to the user (EX: reports, web pages).

Principles of user interface design

• Layout: The interface should be a series of areas on the screen that are used consistently for different purposes, EX: a top area
for commands and navigation.
• Content awareness: Users should always be aware of where they are in the system and what information is being displayed.
EX: create account process: user should know the step that he is performing now.
• Aesthetics Interfaces: should be functional and inviting to users through careful use of white space, colors, and fonts.
• User experience: Although ease of use and ease of learning often lead to similar design decisions, there is sometimes a trade-
off between these two. Novice users of software prefer ease of learning, whereas frequent users will prefer ease of use.
• Consistency: It enables users to predict what will happen before they perform a function. It is one of the most important
elements in ease of learning and use.
• Minimize user effort: The interface should be simple to use.
➢ System inputs and outputs are produced at the end of the analysis phase.

Form: A business document that contains some predefined data and areas where additional data are to be filled in. EX:
employment applications.

Report: A business document that contains only predefined data. Typically contains data from many unrelated records or
transactions. EX: weekly sales summaries by salesperson. It can be printed on paper or computers.

Designing Forms and Reports

• Requirements determination:
▪ Who will use the form or report?
▪ What is the purpose of the form or report?
▪ When and where is the report needed or used?
• 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.

Guidelines for Forms and Reports

• Highlighting: Used sparingly to draw user to or away from certain information. Methods should be selected based upon the
level of importance of information. Methods of Highlighting: Color difference, Size difference, Underlining, intensity differences.
• Use meaningful titles:
▪ Clear titles describing content and use of form or report.
▪ Revision date to distinguish a form or report from past versions.
▪ Current date that identifies when the form or report was generated.
▪ Valid date that identifies on what date the data in the form or report were accurate.
• Include meaningful information:
▪ Only needed information displayed.
▪ Information provided in a usable manner without modification.
• Balance the layout:
▪ Information balanced on the screen or page.
▪ Suitable spacing and margins used.
▪ All data and entry fields are labeled.
• Design an easy navigation system:
▪ Clearly show how to move forward and backward.
▪ Clearly show where you are (EX: page 1 of 3).

Guidelines for Displaying Text

• Case: use upper- and lowercase letters and use punctuation.
• Spacing: Use double spacing if space permits. If not, place a blank line between paragraphs.
• Justification: Left-justify text and leave a right margin
• Hyphenation: Do not hyphenate words between lines.
• Abbreviations: Use abbreviations only when they are widely understood by users and are shorter than the full text.

Guidelines for Displaying Tables and Lists

• Use meaningful labels.
▪ All columns and rows should have meaningful labels.
▪ Labels should be separated from other information by using highlighting.
• Format columns, rows, and text
▪ Sort in a meaningful order.
▪ Place a blank line between every five rows in long columns.
▪ Columns should have at least two spaces between them.
▪ Avoid overly fancy fonts.
• Format numeric, textual, and alphanumeric data
▪ Right-justify numeric data and align columns by decimal points.
▪ 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.

Designing of Interfaces Layouts

• 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.
• Flexibility and consistency are primary design goals:
▪ Users should be able to move freely between fields.
▪ Data should not be permanently saved until the user explicitly requests this.
▪ Each key and command should be assigned to one function.

Checklist for Validating the Usability of User Interface

• Cursor-Control Capabilities
• Editing Capabilities
• Exit Capabilities
• Help Capabilities

Guidelines for Structuring Data-Entry Fields

• Entry: never require data that are already online
• Defaults: always provide default values
• Units: make clear the type of data units requested
• Replacement: use character replacement
• Captioning: always place captions adjacent to fields
• Format: provide formatting examples
• Justify: automatically justify data entry
• Help: provide help

Controlling Data Input

• One objective of interface design is to reduce data entry errors.
• The role of systems analyst is to expect user errors and design features into the system’s interface to avoid data entry mistakes.

Types of Data Errors

• Appending: adding additional characters to a field.
• Truncating: losing characters from a field.
• Transcripting: entering invalid data to a field.
• Transposing: reversing the sequence for one or more characters.

Techniques Used by Systems Designers to Detect Data Errors (Validation tests)

• Class or composition: to ensure data are of proper type.
• Combinations: to see if the combinations of two or more data fields are appropriate.
• Expected values: to see whether data is what is expected.
• Missing data: test for existence of data items in all fields.
• Pictures/templates: to ensure data conforms to a standard format.
• Range: ensure data are within a proper range of values.
• Reasonableness: ensure data are reasonable for the situation.
• Size: test for too many or too few characters.
• Values: test to make sure values come from a set of standard values.

System feedback can consist of three types:

• Status information
▪ Keeps users informed of what is going on in the system.
▪ Displaying status information is especially important if the operation takes longer than a second.
• Prompting cues
▪ display prompting cues (EX: Enter the customer account number.
▪ Keep it as specific as possible.
• Error and warning messages
▪ Messages should be specific and free of error codes and jargon.
▪ Users should be guided toward a result rather than scolded.
▪ Be consistent in format and placement of messages.

Providing Help
• Simplicity
▪ Use short, simple wording, common spelling.
▪ Give users only what they need to know, with the ability to find additional information.
• Organization
▪ Use lists to break information into manageable pieces.
▪ Information in help messages should be easily absorbed by users.
• Demonstrate
▪ It is useful to explicitly show users how to perform an operation.
▪ Provide examples of proper use and the outcomes of such use.

Context-Sensitive Help: Enables user to get field-specific help.