INTRODUCTION TO SYSTEMS ANALYSIS AND DESIGN AN AGILE

INTRODUCTION TO SYSTEMS ANALYSIS AND DESIGN: AN AGILE, ITERATIVE APPROACH SATZINGER | JACKSON | BURD CHAPTER 7 Chapter 7 Systems Analysis and Design in a Changing World, 6 th Edition 1

Designing the User and System Interfaces Chapter 7 Introduction to Systems Analysis and Design: An Agile, Iteractive Approach 6 th Ed Satzinger, Jackson & Burd

Chapter 7 Outline l l l l User and System Interfaces Understanding the User Interface User-Interface Design Concepts The Transition from Analysis to User. Interface Design User-Interface Design Identifying System Interfaces Designing System Inputs Designing System Outputs Introduction to Systems Analysis and Design, 6 th Edition © 2012 Cengage Learning. All Rights Reserved. This edition is intended for use outside of the U. S. only, with content that may be different from the U. S. Edition. May not be scanned, copied, duplicated, or posted to a publicly accessible website, in whole or in part. 3

Learning Objectives l l Describe the difference between user interfaces and system interfaces Describe the historical development of the field of human-computer interaction (HCI) Discuss how visibility and affordance affect usability Describe user-interface guidelines that apply to all types of user-interface types and additional guidelines specific to Web pages and mobile applications Introduction to Systems Analysis and Design, 6 th Edition © 2012 Cengage Learning. All Rights Reserved. This edition is intended for use outside of the U. S. only, with content that may be different from the U. S. Edition. May not be scanned, copied, duplicated, or posted to a publicly accessible website, in whole or in part. 4

Learning Objectives (continued) l l Create storyboards to show the sequence of forms used in a dialog Discuss examples of system interfaces found in information systems Define system inputs and outputs based on the requirements of the application program Design printed and on-screen reports appropriate for recipients Introduction to Systems Analysis and Design, 6 th Edition © 2012 Cengage Learning. All Rights Reserved. This edition is intended for use outside of the U. S. only, with content that may be different from the U. S. Edition. May not be scanned, copied, duplicated, or posted to a publicly accessible website, in whole or in part. 5

Overview l l l Information systems interact with people and other systems Poorly designed user interface can make the information system unusable Poorly designed system interfaces are a source of errors and inefficiency User and system interfaces involve both inputs and outputs and involve a large number of stakeholders Inputs and outputs of the system are an early concern of any system development project 6

User Interfaces and System Interfaces l l l User Interface – inputs and outputs that directly involve a human user/actor l A dialog goes on between actor and system System Interface – the inputs and outputs that require minimal human intervention l Inputs captured automatically l Outputs direct to other systems l Printed and distributed to external actors (statements, reports) In most development projects , analysts separate the design of user interfaces from the design of system interfaces 7

User Centered Design l l Design techniques that embody the view that the user interface is the system to the user Principles of User Centered Design: Focus early on users and their work 1. l l User-oriented analysis and design tasks are performed as early as possible and are often given higher priority than other tasks User interfaces are designed in early iterations Evaluate designs to ensure usability 2. l l Usability refers to the degree to which a system is easy to learn and use Ensuring usability is not easy: there are many different 8 types of users with different preferences and skills

User Centered Design l l Ease of learning and ease of use are often in conflict Developers employ many techniques to evaluate interface design to ensure usability like formal surveys , focus group meeting, and informal observation Use iterative development 3. l l Doing some analysis , then some design , then some implementation, and then repeating the process Iterative development keeps the focus on the user by continually returning to the user requirements during each iteration and by evaluating the system after each iteration Systems Analysis and Design in a Changing World, 6 th Edition 9

Three Components of the User Interface Introduction to Systems Analysis and Design, 6 th Edition © 2012 Cengage Learning. All Rights Reserved. This edition is intended for use outside of the U. S. only, with content that may be different from the U. S. Edition. May not be scanned, copied, duplicated, or posted to a publicly accessible website, in whole or in part. 10

Metaphors of Human Computer Interaction l l l To make computers easier to use and learn, designers adopted metaphors which are analogies between features of the user interface and aspects of physical reality that users are familiar with Direct manipulation metaphor l metaphor in which objects on a display are manipulated to look like physical objects (pictures) or graphic symbols that represent them (icons) Desktop metaphor l metaphor in which the visual display is organized into distinct regions, with a large empty workspace in the middle and a collection of tool icons around the perimeter Document metaphor l metaphor in which data is visually represented as paper pages or forms Dialog metaphor l metaphor in which user and computer accomplish a task by engaging in a conversation or dialog via text, voice, or tools such as labeled buttons Introduction to Systems Analysis and Design, 6 th Edition © 2012 Cengage Learning. All Rights Reserved. This edition is intended for use outside of the U. S. only, with content that may be different from the U. S. Edition. May not be scanned, copied, duplicated, or posted to a publicly accessible website, in whole or in part. 11

Metaphor Details Introduction to Systems Analysis and Design, 6 th Edition © 2012 Cengage Learning. All Rights Reserved. This edition is intended for use outside of the U. S. only, with content that may be different from the U. S. Edition. May not be scanned, copied, duplicated, or posted to a publicly accessible website, in whole or in part. 12

Direct Manipulation, Desktop, and Document Metaphors On One Screen Introduction to Systems Analysis and Design, 6 th Edition © 2012 Cengage Learning. All Rights Reserved. This edition is intended for use outside of the U. S. only, with content that may be different from the U. S. Edition. May not be scanned, copied, duplicated, or posted to a publicly accessible website, in whole or in part. 13

Dialog Metaphor Introduction to Systems Analysis and Design, 6 th Edition © 2012 Cengage Learning. All Rights Reserved. This edition is intended for use outside of the U. S. only, with content that may be different from the U. S. Edition. May not be scanned, copied, duplicated, or posted to a publicly accessible website, in whole or in part. 14

User Interface Design Concepts l l Human-Computer Interaction (HCI) l A field of study concerned with the efficiency and effectiveness of user interaction with computer systems, human-oriented input and output technology, and psychological aspects of user interfaces l There are two key principles to ensure good interaction between a person and a machine: Visibility and Affordance l Affordance means that the appearance of a specific control suggests its function l Visibility means that a control is visible so users know it is available, it also means that the control provides immediate feedback to indicate that it is responding 15

• Visibility and affordance are relatively easy to achieve for common platform design such as i. Pad or windows and harder in web interface design Systems Analysis and Design in a Changing World, 6 th Edition 16

User Interface Design Concepts Consistency l User interfaces should be designed for consistency in function and appearance l Ex: applications that run under windows Shortcuts l Users who work with an application repeatedly or for long time periods want shortcuts for frequently used functions l Application designers should use standard shortcuts when available or build their own Feedback l Every action a user takes should result in some type of feedback from the computer so the user knows the action was recognized l Feedback can take many forms like audible feedback(clicking sounds) and visible feedback (the icon changes) 17 © 2012 Cengage Learning. All Rights Reserved. This edition is intended for use outside of the U. S. only, with content that may be different from the U. S. Edition. May not be scanned, copied, duplicated, or posted to a publicly accessible website, in whole or in part.

User Interface Design Concepts Dialogs that yield Closure l Any well-defined task has beginning , middle, and end, so user’s tasks on the computer should also feel this way l Users often focus intently on tasks, so when it is confirmed that a task is complete , the users can get ready to focus on the next task Error Handling l A good user-interface design anticipates common errors and helps user to avoid them l By limit available options, and adequate feedback l When errors do occur: the user interface need mechanisms to detect them(validation techniques), and help the user to correct them (clear error message) 18

User Interface Design Concepts Easy Reversal of Actions l Users need to feel that they can explore options and take actions that can be cancelled or reversed without difficulty l By experimenting users learn about the system and also it a way to prevent error l Designers should be sure to include cancel buttons on all dialog boxes , allow user to go back a step at any time and confirm delete action Reduce Short Term Memory Load l People have short-term memory so designers should avoid requiring the user to remember anything from one form to another or from on dialog box to another 19

The transition from analysis to user interface design l l The foundation for user-interface design is laid when use case are identified and documented during analysis Use cases that require direct user interaction are the starting point for a dialog Interactive use cases may require the user to input choices and data into the system or may generate outputs in response to a user request During design , dialogs for interactive use cases are further refined by developing menus, forms, and other user-interface elements 20 © 2012 Cengage Learning. All Rights Reserved. This edition is intended for use outside of the U. S. only, with content that may be different from the U. S. Edition. May not be scanned, copied, duplicated, or posted to a publicly accessible website, in whole or in part.

Use Cases and the Menu Hierarchy l l l Menus are a way of grouping related use cases or dialogs within a user interface Menus are needed to present the user with number of choices per screen , and to group related functions together so user can easily locate them Menus usually contain 5 to 10 choices in order to avoid overloading the user Systems Analysis and Design in a Changing World, 6 th Edition 21

Two Different Menu Styles Introduction to Systems Analysis and Design, 6 th Edition © 2012 Cengage Learning. All Rights Reserved. This edition is intended for use outside of the U. S. only, with content that may be different from the U. S. Edition. May not be scanned, copied, duplicated, or posted to a publicly accessible website, in whole or in part. 22

Some RMO Use Cases Grouped by Actor and Subsystem Introduction to Systems Analysis and Design, 6 th Edition © 2012 Cengage Learning. All Rights Reserved. This edition is intended for use outside of the U. S. only, with content that may be different from the U. S. Edition. May not be scanned, copied, duplicated, or posted to a publicly accessible website, in whole or in part. 23

RMO Use Cases Grouped into First Cut Menu Hierarchy Notice that you should group all related use cases for each user in one menu 24

Dialog Design and storyboards l l After identifying all required dialogs, the designers must document the dialogs: 1. List the key steps followed for the dialog with a written description of what the users and computer do at each step(activity diagram format, use case description format, or free form) 2. Writ out how the user and system might interact if they were two people engaged in conversation(use storyboarding technique) Storyboarding : showing the sequence of sketches of the display screen during dialog. l The sketches don’t have to be very detailed l Implemented by using a visual programming tool or graphics package l The screen formats are primitive l Review the storyboard with users and designers 25

From Dialog to Storyboard (part 1) Use case Check out shopping cart Introduction to Systems Analysis and Design, 6 th Edition © 2012 Cengage Learning. All Rights Reserved. This edition is intended for use outside of the U. S. only, with content that may be different from the U. S. Edition. May not be scanned, copied, duplicated, or posted to a publicly accessible website, in whole or in part. 26

From Dialog to Storyboard (part 1) Introduction to Systems Analysis and Design, 6 th Edition © 2012 Cengage Learning. All Rights Reserved. This edition is intended for use outside of the U. S. only, with content that may be different from the U. S. Edition. May not be scanned, copied, duplicated, or posted to a publicly accessible website, in whole or in part. 27

From Dialog to Storyboard (part 2) Introduction to Systems Analysis and Design, 6 th Edition © 2012 Cengage Learning. All Rights Reserved. This edition is intended for use outside of the U. S. only, with content that may be different from the U. S. Edition. May not be scanned, copied, duplicated, or posted to a publicly accessible website, in whole or in part. 28

From Dialog to Storyboard (part 2) Introduction to Systems Analysis and Design, 6 th Edition © 2012 Cengage Learning. All Rights Reserved. This edition is intended for use outside of the U. S. only, with content that may be different from the U. S. Edition. May not be scanned, copied, duplicated, or posted to a publicly accessible website, in whole or in part. 29