Presentation on theme: "Chapter 12 Designing Interfaces and Dialogues"— Presentation transcript:
1Chapter 12 Designing Interfaces and Dialogues Modern Systems Analysis and Design Fourth Edition Jeffrey A. Hoffer Joey F. George Joseph S. ValacichChapter 12Designing Interfaces and Dialogues
2Learning ObjectivesExplain the process of interface and dialogue design.Contrast and apply methods for interacting with a system.List and describe various input devices and factors affecting their usability.Describe guidelines for designing interface layout, data entry field structure, feedback, and system help.Design graphical user interfaces.
4Interface/Dialogue Design Layout (of text, and table data)Structuring data entryControlling data input (validation and format controls)Feedback (prompting, status, warning, and error messages)Dialogue sequencing
5Deliverables and Outcomes A typical interface/dialogue design specification:Similar to form design, but includes multiple forms and dialogue sequence specifications
6Characteristics for Consideration User: experience, skills, motivation, education, personalityTasks: differ in amount of information that must be obtained or providedTask demands: time pressure, cost of errors, work durations (fatigue)System: the platform on which the system is constructed will influence interaction styles and devices.Environment:social issues: user’s role and statusphysical issues: lighting, sound, task interruptions, temperature, humidity
7Interface MethodsInterface: the method by which a user interacts with the information systemCommon interaction methodsCommand lineMenuFormObject-basedNatural language
8Command Line Interaction Users enter explicit statements into a system to invoke operationsExample from MS DOS:COPY C:PAPER.DOC A:PAPER.DOCThis copies a file from the C: drive to the A: driveIncludes keyboard shortcuts and function keys
9Interface MethodsInterface: the method by which a user interacts with the information systemCommon interaction methodsCommand lineMenuFormObject-basedNatural language
10Menu InteractionA list of system options is provided and specific command is invoked by user selection of a menu optionTwo common menu types:Pop-up: menu placed near current cursor positionDrop-down: access point to menu placed at top line of display, menu drops down when access point clicked
14Guidelines for Menu Design Wording: meaningful titles, clear command verbs, mixed upper/lower caseOrganization: consistent organizing principleLength: all choices fit within screen lengthSelection: consistent, clear and easy selection methodsHighlighting: only for selected options or unavailable options (gray text)
17Visual editing tools help designers construct menus.
18Interface MethodsInterface: the method by which a user interacts with the information systemCommon interaction methodsCommand lineMenuFormObject-basedNatural language
19Form InteractionAllows users to fill in the blanks when working with a systemMeasures of an effective design:Self-explanatory title and field headingsFields organized into logical groupingsDistinctive boundariesDefault valuesDisplays appropriate field lengthsMinimizes the need to scroll windows
21Interface MethodsInterface: the method by which a user interacts with the information systemCommon interaction methodsCommand lineMenuFormObject-basedNatural language
22Object InteractionSymbols are used to represent commands or functions.Icons:Graphic symbols that look like the processing option they are meant to representUse little screen spaceCan be easily understood by users
24Interface MethodsInterface: the method by which a user interacts with the information systemCommon interaction methodsCommand lineMenuFormObject-basedNatural language
25Natural Language Interaction Inputs to and outputs from system are in a conventional speaking language like EnglishBased on research in artificial intelligenceCurrent implementations are tedious and difficult to work with, not as feasible as other interaction methods
26Hardware Options for System Interaction KeyboardMouseJoystickTrackballTouch ScreenLight PenGraphics TabletVoice
27Usability Problems with Hardware Devices Visual Blocking (device blocks display when using)touch screen, light penUser Fatigue (potential for fatigue over long use)Movement Scaling (device movement translates to equivalent screen movement)keyboard, mouse, joystick, trackball, graphics tablet, voiceDurability (need for maintenance)trackball, touch screenAdequate Feedback (device provides adequate feedback)keyboard, mouse, joystick, trackball, graphics tablet, voiceSpeed (cursor movement)keyboardPointing Accuracy (ability to precisely direct cursorjoystick, touch screen, light pen, voice
29Designing InterfacesUse standard formats similar to paper-based forms and reportsLeft-to-right, top-to-bottom navigationFlexibility and consistency:Free movement between fieldsNo permanent data storage until the user requestsEach key and command assigned to one function
30Structuring Data Entry Never require data that are already online or that can be computedDefaultsAlways provide default values when appropriateUnitsMake clear the type of data units requested for entryReplacementUse character replacement when appropriate(by looking up a value in a table, or automatic filling the rest of a word)CaptioningAlways place a caption adjacent to fieldsFormatProvide formatting examples (like $ or decimal point)JustifyAutomatically justify data entriesHelpProvide context-sensitive help when appropriate
32Controlling Data Input Objective: reduce data entry errorsCommon sources data entry errors in a field:Appending: adding additional charactersTruncating: losing charactersTranscripting: entering invalid dataTransposing: reversing sequence of characters
33Types of Validation Tests Class or CompositionType checkCombinationsCheck if reasonable,E.g.: quantity of sold + type of product?Expected ValuesE.g. Match with existing customerMissing DataE.g. All fields of a recordPictures/TemplatesStandard format, E.g.hyphens …
34Range Reasonableness Self-checking Digits Size Values For situation 9 digit IDValuesCome from set of standards: Two-letter state code
35Feedback MessagesStatus information: keep user informed of what’s going on, helpful when user has to wait for responsePrompting cues: tell user when input is needed, and how to provide the inputWarning or Error: inform user that something is wrong, either with data entry or system operation
36Providing Help Place yourself in user’s place when designing help Guidelines:SimplicityHelp messages should be short and to the pointOrganizeInformation in help messages should be easily absorbed by usersShowIt is useful to explicitly show users how to perform an operation
37What is a Dialogue?A sequence of interactions between the system and a userDialogue design involves:Designing a dialogue sequenceBuilding a prototypeAssessing usability
38Guidelines for Dialogue Design ConsistencyShortcuts and SequenceFeedbackClosure (clear start, and end)Error HandlingReversalControlEase
39Dialogue DiagrammingA formal method for designing and representing human-computer dialogues using box and line diagrams
40Dialogue diagrams depict the sequence, conditional branching, and repetition of dialogues.
41Designing Interfaces and Dialogues in Graphical Environments 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.
43GUI Window Properties That Can Be Turned On or Off Modality: require user to finish action before proceedingResizable: allow user to change size of windowMovable: allow user to reposition windowMaximize: allow user to make window take entire screenMinimize: allow user to completely hide windowSystem menu: allow window to have access to system level functions
44GUI Dialogue Design Issues Goal is to establish the sequence of displays that users will encounter when working with system.Ability of some GUI environments to jump from application to application or screen to screen makes sequencing a challenge.One approach is to make users always resolve requests for information before proceeding.Dialogue diagramming helps analysts better manage the complexity of designing graphical interfaces.
45Summary In this chapter you learned how to: Explain the process of interface and dialogue design.Contrast and apply methods for interacting with a system.List and describe various input devices and factors affecting their usability.Describe guidelines for designing interface layout, data entry field structure, feedback, and system help.Design graphical user interfaces.