INFS 6225 Object-Oriented INFS 6225 Object-Oriented Systems Analysis & DesignSystems Analysis & Design

Chapter 10: Human Computer Chapter 10: Human Computer Interaction LayerInteraction Layer

User Interface Structure User Interface Structure DesignDesign

Plan for how a system will interact with Plan for how a system will interact with external entities (e.g., people & other external entities (e.g., people & other systems)systems)

Part of the Human-Computer Interface LayerPart of the Human-Computer Interface Layer

Three parts:Three parts:1.1. Navigation MechanismNavigation Mechanism2.2. Input MechanismInput Mechanism3.3. Output MechanismOutput Mechanism

6 Principles of User Interface 6 Principles of User Interface DesignDesign

1.1. LayoutLayout – arrangement of objects on screen – arrangement of objects on screen2.2. Content AwarenessContent Awareness – feedback to user – feedback to user3.3. AestheticsAesthetics – pleasing to eye – pleasing to eye4.4. User ExperienceUser Experience – works with expert & novice – works with expert & novice

usersusers5.5. ConsistencyConsistency – uniformity – uniformity6.6. Minimal User EffortMinimal User Effort – ease of use – ease of use

User Interface Design User Interface Design ProcessProcess

Window Navigation Diagram Window Navigation Diagram (WND)(WND)

Interface Design PrototypesInterface Design Prototypes Three Types:Three Types:

1.1. StoryboardStoryboard – hand-drawn sample screens – hand-drawn sample screens

2.2. HTMLHTML – sample screens created in HTML – sample screens created in HTML

3.3. LanguageLanguage – sample screens created using – sample screens created using the actual programming languagethe actual programming language

Interface EvaluationInterface Evaluation

HeuristicHeuristic – compare to principles/rules – compare to principles/rules

Walk-ThroughWalk-Through – demo meeting with users – demo meeting with users

InteractiveInteractive – “test drive” by users – “test drive” by users

Formal Usability TestingFormal Usability Testing – formal, in-depth session – formal, in-depth session Uses observationUses observation Large amount of data gatheredLarge amount of data gathered One to Two hour sessions with each userOne to Two hour sessions with each user Five to Ten users involvedFive to Ten users involved

UI Design ComponentsUI Design Components

Three parts:Three parts:1.1. Navigation MechanismNavigation Mechanism2.2. Input MechanismInput Mechanism3.3. Output MechanismOutput Mechanism

Good design is not noticed by usersGood design is not noticed by users Analysts should assume users have not Analysts should assume users have not

read manualread manual

Types of NavigationTypes of Navigation

Language (Command Language) – user enters Language (Command Language) – user enters special syntax to direct system (e.g., DOS SQL)special syntax to direct system (e.g., DOS SQL)

Menus – user selects from limited set of listed Menus – user selects from limited set of listed choices (most popular method)choices (most popular method)

Direct Manipulation – users work directly with Direct Manipulation – users work directly with interface objects (e.g., drag & drop)interface objects (e.g., drag & drop)

Input DesignInput Design

On-Line Processing (Transactional Processing) – each input On-Line Processing (Transactional Processing) – each input item is entered/saved to system individuallyitem is entered/saved to system individually

Batch Processing – inputs are collected over time & entered Batch Processing – inputs are collected over time & entered into system as a “batch”into system as a “batch”

Capture Data at Source – capture data at original source or Capture Data at Source – capture data at original source or as close as possible to sourceas close as possible to source

Minimize Keystrokes – keystrokes cost time & money. Minimize Keystrokes – keystrokes cost time & money. Extra keystrokes may lead to mistakes.Extra keystrokes may lead to mistakes.

Input ValidationInput Validation

Completeness Check – ensure all required data are Completeness Check – ensure all required data are enteredentered

Format Check – ensures proper format is usedFormat Check – ensures proper format is used Range Check – puts valid range limit on inputRange Check – puts valid range limit on input Check Digit – math formula used to compute digit(s)Check Digit – math formula used to compute digit(s) Consistency Check – ensure data combinations are Consistency Check – ensure data combinations are

validvalid Database Checks – data verified with previously Database Checks – data verified with previously

stored informationstored information

Output DesignOutput Design

Understand Report/Information Understand Report/Information usageusage

Manage information loadManage information load Minimize biasMinimize bias

Sort optionsSort options Scaling in graphical displaysScaling in graphical displays

Design Tips & GuidelinesDesign Tips & Guidelines

What tips/guidelines are offered What tips/guidelines are offered throughout Chapter 10?throughout Chapter 10?