Presentation is loading. Please wait.

Presentation is loading. Please wait.

1 Copyright © 2004 Ian Sommerville. NU-specific content © 2004 M. E. Kabay. All rights reserved. User-Interface Design IS301 – Software Engineering Lecture.

Similar presentations


Presentation on theme: "1 Copyright © 2004 Ian Sommerville. NU-specific content © 2004 M. E. Kabay. All rights reserved. User-Interface Design IS301 – Software Engineering Lecture."— Presentation transcript:

1 1 Copyright © 2004 Ian Sommerville. NU-specific content © 2004 M. E. Kabay. All rights reserved. User-Interface Design IS301 – Software Engineering Lecture #20 – M. E. Kabay, PhD, CISSP Dept of Computer Information Systems Norwich University

2 2 Copyright © 2004 Ian Sommerville. NU-specific content © 2004 M. E. Kabay. All rights reserved. Topics Introduction User-Interface Design Principles User Interaction Information Presentation User Support

3 3 Copyright © 2004 Ian Sommerville. NU-specific content © 2004 M. E. Kabay. All rights reserved. User Interface (UI) UI critically important aspect of software engineering System users often judge system by interface rather than its functionality Why? Poorly-designed interface can cause users to make catastrophic errors How? Poor UI design discourages use of software

4 4 Copyright © 2004 Ian Sommerville. NU-specific content © 2004 M. E. Kabay. All rights reserved. Graphical UIs (GUIs) Some old systems still use command-line or text-based UIs Most systems today use GUIs Windows: simultaneous views Icons: data, functions Menus: choice of options, memory aids Pointing: trackball, touchpad, mouse, eye Graphics: charts, tables, diagrams Static or dynamic

5 5 Copyright © 2004 Ian Sommerville. NU-specific content © 2004 M. E. Kabay. All rights reserved. Examples of GUIs (1) The First Commercial GUI: Xeroxs Star workstation was the first commercial implementation of the graphical user interface. The Star was introduced in 1981 and was the inspiration for the Mac and all the other GUIs that followed. This and following screen shots are from the Computer Desktop Encyclopedia. Used with permission.

6 6 Copyright © 2004 Ian Sommerville. NU-specific content © 2004 M. E. Kabay. All rights reserved. Examples of GUIs (2) Macintosh GUI

7 7 Copyright © 2004 Ian Sommerville. NU-specific content © 2004 M. E. Kabay. All rights reserved. Examples of GUIs (3)

8 8 Copyright © 2004 Ian Sommerville. NU-specific content © 2004 M. E. Kabay. All rights reserved. GUI Advantages Easy to learn and use Save time in training Apply skills to new programs Fast task-switching Use different applications concurrently Information can remain visible in its own window Fast, full-screen interaction possible Immediate access to anywhere on screen Make full use of available real-estate Supports multi-screen capabilities

9 9 Copyright © 2004 Ian Sommerville. NU-specific content © 2004 M. E. Kabay. All rights reserved. Topics Introduction User-Interface Design Principles User Interaction Information Presentation User Support

10 10 Copyright © 2004 Ian Sommerville. NU-specific content © 2004 M. E. Kabay. All rights reserved. User-Centered Design This chapter / lecture focus: Design philosophy and issues Not on implementation of UIs User-centered design Needs of user are paramount Users involved in design process Design UI through prototypes

11 11 Copyright © 2004 Ian Sommerville. NU-specific content © 2004 M. E. Kabay. All rights reserved. UI Design Process

12 12 Copyright © 2004 Ian Sommerville. NU-specific content © 2004 M. E. Kabay. All rights reserved. UI Design Principles Determinants: learn about system users Needs Experience Capabilities Constraints: physical and mental limitations Limited short-term memory 7±2 concepts in mind at one time Mistakes are normal and expected People fall into habits

13 13 Copyright © 2004 Ian Sommerville. NU-specific content © 2004 M. E. Kabay. All rights reserved. Design Principles: Overview User familiarity Consistency Minimal surprise Recoverability User guidance User diversity

14 14 Copyright © 2004 Ian Sommerville. NU-specific content © 2004 M. E. Kabay. All rights reserved. User Familiarity Interface should be based on user-oriented terms and concepts Avoid using computer concepts E.g., office system: Use letters, documents, folders etc. Dont use directories, file identifiers etc.

15 15 Copyright © 2004 Ian Sommerville. NU-specific content © 2004 M. E. Kabay. All rights reserved. Consistency Display appropriate level of consistency Commands and menus should have same Format / appearance Command punctuation Layout Abbreviations / keyboard shortcuts Error-messages Same styles / formats from place to place Same location on screen when they appear

16 16 Copyright © 2004 Ian Sommerville. NU-specific content © 2004 M. E. Kabay. All rights reserved. Minimal Surprise Extend consistency to commands or actions If one command operates in known way, User should be able to predict operation of comparable commands Put the default choice in the same place or sequence on the screen E.g., Make either YES or NO the default for all commands If keeping a previous file version is default, then dont make one command delete previous version by default

17 17 Copyright © 2004 Ian Sommerville. NU-specific content © 2004 M. E. Kabay. All rights reserved. Recoverability Resilience to user errors Allow user to recover from errors Confirmation of destructive actions Soft' deletes.... Undo / redo facility

18 18 Copyright © 2004 Ian Sommerville. NU-specific content © 2004 M. E. Kabay. All rights reserved. User Guidance (1) Help in same place(s) on all screens Context-sensitive Index Topical Smart questions On-line manuals Tutorials....

19 19 Copyright © 2004 Ian Sommerville. NU-specific content © 2004 M. E. Kabay. All rights reserved. User Guidance (2)

20 20 Copyright © 2004 Ian Sommerville. NU-specific content © 2004 M. E. Kabay. All rights reserved. User Diversity Plan for different types of user Experience Casual/novice vs experienced Ease-of-use vs efficiency & speed Physical disabilities Poor eyesight Configurable font sizes Blindness Automated reading programs US: Americans with Disabilities Act

21 21 Copyright © 2004 Ian Sommerville. NU-specific content © 2004 M. E. Kabay. All rights reserved. US ADA & GUI Design Americans with Disabilities Act of 1992 Widespread implications for employment, architectural design and services Applies to private employers with >15 employees, state and local governments, employment agencies & labor unions Web designers have been grappling with requirements Resources sources.html

22 22 Copyright © 2004 Ian Sommerville. NU-specific content © 2004 M. E. Kabay. All rights reserved. Topics Introduction User-Interface Design Principles User Interaction Information Presentation User Support

23 23 Copyright © 2004 Ian Sommerville. NU-specific content © 2004 M. E. Kabay. All rights reserved. User-System Interaction Key issues Info from user to computer system? Info from computer system to user? UI metaphor helps to make sense of functions Desktop for operating system Space invaders game for typing tutor 3D universe for dataspace (e.g., TRON, Matrix, other sci-fi movies)

24 24 Copyright © 2004 Ian Sommerville. NU-specific content © 2004 M. E. Kabay. All rights reserved. Interaction Styles Direct manipulation Menu selection Form fill-in Command language Natural language

25 Advantages & Disadvantages

26 26 Copyright © 2004 Ian Sommerville. NU-specific content © 2004 M. E. Kabay. All rights reserved. Direct Manipulation: Example – PowerPoint Open PowerPoint and study how objects can be Grown Shrunk Flipped Rotated Copied Colored.... Through direct manipulation using tools

27 27 Copyright © 2004 Ian Sommerville. NU-specific content © 2004 M. E. Kabay. All rights reserved. Menu Systems Select from lists of possibilities Point and click with mouse Use cursor keys Type name of selection Touchscreens Usually integrate automated help facilities Help cursor Pop-ups ? Pop-up text

28 28 Copyright © 2004 Ian Sommerville. NU-specific content © 2004 M. E. Kabay. All rights reserved. Control Panel Interface

29 29 Copyright © 2004 Ian Sommerville. NU-specific content © 2004 M. E. Kabay. All rights reserved. Menu Systems: Benefits Easy to learn – no memorization Reduced typing – faster data entry User errors trapped by interface Context-dependent help

30 30 Copyright © 2004 Ian Sommerville. NU-specific content © 2004 M. E. Kabay. All rights reserved. Menu Systems: Problems Best for small # of choices May have to provide sub-menus for complex situations AND and OR relations hard to represent Slower than command language or keyboard shortcuts So provide those as options

31 31 Copyright © 2004 Ian Sommerville. NU-specific content © 2004 M. E. Kabay. All rights reserved. Form-Based Interface

32 32 Copyright © 2004 Ian Sommerville. NU-specific content © 2004 M. E. Kabay. All rights reserved. Command Interfaces User types commands to give instructions to system e.g. UNIX May be implemented using cheap terminals. Easy to process using compiler techniques Commands of arbitrary complexity can be created by command combination Concise interfaces requiring minimal typing can be created

33 33 Copyright © 2004 Ian Sommerville. NU-specific content © 2004 M. E. Kabay. All rights reserved. Command Interfaces: Problems Users have to learn and remember command language. Unsuitable for occasional/casual users Need to be able to type Users make errors in commands Need good error detection and recovery

34 34 Copyright © 2004 Ian Sommerville. NU-specific content © 2004 M. E. Kabay. All rights reserved. Natural Language Interfaces User types command in natural language. Vocabulary usually limited Confined to specific application domains; e.g., Timetable enquiries Medical systems Experienced users: too much typing See ASK JEEVES

35 35 Copyright © 2004 Ian Sommerville. NU-specific content © 2004 M. E. Kabay. All rights reserved. Ask Jeeves

36 36 Copyright © 2004 Ian Sommerville. NU-specific content © 2004 M. E. Kabay. All rights reserved. Multiple UIs

37 37 Copyright © 2004 Ian Sommerville. NU-specific content © 2004 M. E. Kabay. All rights reserved. Topics Introduction User-Interface Design Principles User Interaction Information Presentation User Support

38 38 Copyright © 2004 Ian Sommerville. NU-specific content © 2004 M. E. Kabay. All rights reserved. Information Presentation {numeric, textual} X {static, dynamic} Information may be

39 39 Copyright © 2004 Ian Sommerville. NU-specific content © 2004 M. E. Kabay. All rights reserved. Information Display Factors Questions to consider in designing interface Is user interested in precise information or data relationships? How quickly do information values change? Must change be indicated immediately? Must user take some action in response to change? Is there a direct manipulation interface? Is information textual or numeric? Are relative values important?

40 40 Copyright © 2004 Ian Sommerville. NU-specific content © 2004 M. E. Kabay. All rights reserved. Data Visualization Concerned with techniques for displaying large amounts of information Visualization can reveal relationships between entities and trends in data Examples of data visualization applications: Weather information collected from number of sources State of telephone network as linked set of nodes Chemical plant visualized by showing pressures and temperatures in linked set of tanks and pipes Model of molecule displayed in 3 dimensions Web pages displayed as hyperbolic tree

41 41 Copyright © 2004 Ian Sommerville. NU-specific content © 2004 M. E. Kabay. All rights reserved. Color Displays Color adds extra dimension to interface and can help user understand complex information structures Can be used to highlight exceptional events Common mistakes in use of color in interface design include: Use of color to communicate non-obvious specific meaning E.g., red may mean hot to a chemist but forbidden to a driver Over-use of color in display – confusing

42 42 Copyright © 2004 Ian Sommerville. NU-specific content © 2004 M. E. Kabay. All rights reserved. Guidelines for Effective Use of Color in Displays Don't use too many colors (max 4-5 in window) Dont use colors as simply as decoration Change of color must imply change of state Use color coding to support tasks Allow users to control color coding Design for monochrome then add color Use color coding consistently Avoid color pairings which clash Use color change to show status change Be aware that color displays usually lower resolution Dont make large areas of screen BLINK Can cause seizures

43 43 Copyright © 2004 Ian Sommerville. NU-specific content © 2004 M. E. Kabay. All rights reserved. Topics Introduction User-Interface Design Principles User Interaction Information Presentation User Support

44 44 Copyright © 2004 Ian Sommerville. NU-specific content © 2004 M. E. Kabay. All rights reserved. User Support User guidance includes On-line help Error messages Manuals Tutorials Integrate help with interface: context- sensitive Integrate help and error messages Easy to get explanation, tips, suggestions Advanced help keeps user profile

45 45 Copyright © 2004 Ian Sommerville. NU-specific content © 2004 M. E. Kabay. All rights reserved. Help and Message System

46 46 Copyright © 2004 Ian Sommerville. NU-specific content © 2004 M. E. Kabay. All rights reserved. Error Messages Bad error messages can lead users to reject entire system Consider background and experience of users in designing messages Messages should be Polite Concise Consistent Constructive Avoid classic errors Never be rude Dont try to be funny Dont condescend to your users

47 47 Copyright © 2004 Ian Sommerville. NU-specific content © 2004 M. E. Kabay. All rights reserved. Design Factors in Message Wording Context-sensitive Experience – offer verbose / terse modes Skill level – offer beginners / expert modes Style – positive, active (never rude, not funny) Culture – apply localization to avoid offending people in different cultures

48 48 Copyright © 2004 Ian Sommerville. NU-specific content © 2004 M. E. Kabay. All rights reserved. System and User-Oriented Error Messages System-oriented message Useful for technical staff Detail internal states of system Good for diagnostics and repair Usually complete gibberish for users User-oriented message Useful for user to fix a problem Reassuring Give instructions on whom to contact if appropriate

49 49 Copyright © 2004 Ian Sommerville. NU-specific content © 2004 M. E. Kabay. All rights reserved. A Friendly, Helpful Message System Encourages more positive attitude towards the operating system, the computer and operations: ENTER USER PASSWORD: vs Please enter user password: UNKNOWN SYNTAX vs Pardon? CAN'T INITIATE NEW SESSIONS NOW vs System Alpha not yet available--try again later

50 50 Copyright © 2004 Ian Sommerville. NU-specific content © 2004 M. E. Kabay. All rights reserved. A Friendly, Helpful Message System (cont'd) If possible, show what can be done to fix problem Explain WHO can do WHAT to help user in trouble Include telephone numbers OUT OF DISC SPACE (FSERR 46). vs OUT OF DISC SPACE (FSERR 46). Check :FREE for free space Verify :BUILD or :FILE commands for typing error; use 32 extents if possible; check device class; call (514) X.216 for help

51 51 Copyright © 2004 Ian Sommerville. NU-specific content © 2004 M. E. Kabay. All rights reserved. Gives operators critical information fast Especially important when user gets system information DCU LOGGING IN PROGRESS (THIS IS NORMAL) MAKE LDEV 3 ONLINE RIGHT NOW: PRESS UNLOAD/LOAD STREAMS FACILITY NOT ENABLED Call operations for :STREAMS 10 A Friendly, Helpful Message System (cont'd)

52 52 Copyright © 2004 Ian Sommerville. NU-specific content © 2004 M. E. Kabay. All rights reserved. Help System Design Help? means Help, I want information Help! means HELP. I'm in trouble Both of these requirements have to be taken into account in help system design Different facilities in help system may be required

53 53 Copyright © 2004 Ian Sommerville. NU-specific content © 2004 M. E. Kabay. All rights reserved. HOMEWORK REQUIRED: By Friday 22 Oct 2004 For 24 points, 16.3, 16.6, 16.7, OPTIONAL: By Monday 1 Nov 2004 For up to 10 extra points, answer any or all of the following questions:

54 54 Copyright © 2004 Ian Sommerville. NU-specific content © 2004 M. E. Kabay. All rights reserved. DISCUSSION


Download ppt "1 Copyright © 2004 Ian Sommerville. NU-specific content © 2004 M. E. Kabay. All rights reserved. User-Interface Design IS301 – Software Engineering Lecture."

Similar presentations


Ads by Google