Ch15.ppt User Interfaces - Donald Bren School Of .

Transcription

User interface designλDesigning effective interfacesfor software systems Ian Sommerville 2000Software Engineering, 6th edition. Chapter 15Slide 1

ObjectivesλλλλλTo suggest some general design principles foruser interface designTo explain different interaction stylesTo introduce styles of information presentationTo describe the user support which should bebuilt-in to user interfacesTo introduce usability attributes and systemapproaches to system evaluation Ian Sommerville 2000Software Engineering, 6th edition. Chapter 15Slide 2

Topics coveredλλλλλUser interface design principlesUser interactionInformation presentationUser supportInterface evaluation Ian Sommerville 2000Software Engineering, 6th edition. Chapter 15Slide 3

The user interfaceλλλSystem users often judge a system by itsinterface rather than its functionalityA poorly designed interface can cause a user tomake catastrophic errorsPoor user interface design is the reason why somany software systems are never used Ian Sommerville 2000Software Engineering, 6th edition. Chapter 15Slide 4

Graphical user interfacesλMost users of business systems interact with thesesystems through graphical interfaces although, insome cases, legacy text-based interfaces are stillused Ian Sommerville 2000Software Engineering, 6th edition. Chapter 15Slide 5

GUI tingGraphics Ian Sommerville 2000DescriptionMultiple windows allow different information to bedisplayed simultaneously on the user’s screen.Icons different types of information. On some systems,icons represent files; on others, icons representprocesses.Commands are selected from a menu rather than typedin a command language.A pointing device such as a mouse is used for selectingchoices from a menu or indicating items of interest in awindow.Graphical elements can be mixed with text on the samedisplay.Software Engineering, 6th edition. Chapter 15Slide 6

GUI advantagesλThey are easy to learn and use. λThe user may switch quickly from one task toanother and can interact with several differentapplications. λUsers without experience can learn to use the systemquickly.Information remains visible in its own window whenattention is switched.Fast, full-screen interaction is possible withimmediate access to anywhere on the screen Ian Sommerville 2000Software Engineering, 6th edition. Chapter 15Slide 7

User-centred designλλλThe aim of this chapter is to sensitise softwareengineers to key issues underlying the designrather than the implementation of user interfacesUser-centred design is an approach to UI designwhere the needs of the user are paramount andwhere the user is involved in the design processUI design always involves the development ofprototype interfaces Ian Sommerville 2000Software Engineering, 6th edition. Chapter 15Slide 8

User interface design processAnalyse andunderstand useractivitiesProduce paperbased designprototypeDesignprototypeEvaluate designwith end-usersProducedynamic designprototypeExecutableprototype Ian Sommerville 2000Software Engineering, 6th edition. Chapter 15Evaluate designwith end-usersImplementfinal userinterfaceSlide 9

UI design principlesλλλUI design must take account of the needs,experience and capabilities of the system usersDesigners should be aware of people’s physicaland mental limitations (e.g. limited short-termmemory) and should recognise that people makemistakesUI design principles underlie interface designsalthough not all principles are applicable to alldesigns Ian Sommerville 2000Software Engineering, 6th edition. Chapter 15Slide 10

User interface design principlesPrincipleUser familiarityConsistencyMinimal surpriseRecoverabilityUser guidanceUser diversity Ian Sommerville 2000DescriptionThe interface should use terms and concepts which aredrawn from the experience of the people who willmake most use of the system.The interface should be consistent in that, whereverpossible, comparable operations should be activated inthe same way.Users should never be surprised by the behaviour of asystem.The interface should include mechanisms to allowusers to recover from errors.The interface should provide meaningful feedbackwhen errors occur and provide context-sensitive userhelp facilities.The interface should provide appropriate interactionfacilities for different types of system user.Software Engineering, 6th edition. Chapter 15Slide 11

Design principlesλUser familiarity λConsistency λThe interface should be based on user-orientedterms and concepts rather than computer concepts. For example,an office system should use concepts such as letters, documents,folders etc. rather than directories, file identifiers, etc.The system should display an appropriate levelof consistency. Commands and menus should have the sameformat, command punctuation should be similar, etc.Minimal surprise If a command operates in a known way, the user should beable to predict the operation of comparable commands Ian Sommerville 2000Software Engineering, 6th edition. Chapter 15Slide 12

Design principlesλRecoverability λUser guidance λThe system should provide some resilience touser errors and allow the user to recover from errors. This mightinclude an undo facility, confirmation of destructive actions,'soft' deletes, etc.Some user guidance such as help systems, on-line manuals, etc.should be suppliedUser diversity Interaction facilities for different types of user should besupported. For example, some users have seeing difficulties andso larger text should be available Ian Sommerville 2000Software Engineering, 6th edition. Chapter 15Slide 13

User-system interactionλTwo problems must be addressed in interactivesystems design λHow should information from the user be provided to thecomputer system?How should information from the computer system be presentedto the user?User interaction and information presentationmay be integrated through a coherent frameworksuch as a user interface metaphor Ian Sommerville 2000Software Engineering, 6th edition. Chapter 15Slide 14

Interaction stylesλλλλλDirect manipulationMenu selectionForm fill-inCommand languageNatural language Ian Sommerville 2000Software Engineering, 6th edition. Chapter 15Slide 15

st and intuitiveinteractionEasy to learnMenuselectionAvoids usererrorLittle typingrequiredForm fill-inSimple dataentryEasy to learnPowerful e tocasual usersEasily extendedMaindisadvantagesMay be hard toimplementOnly suitable wherethere is a visualmetaphor for tasksand objectsSlow forexperienced usersCan becomecomplex if manymenu optionsTakes up a lot ofscreen spaceHard to learnPoor errormanagementRequires moretypingNatural languageunderstandingsystems areunreliableApplicationexamplesVideo gamesCAD systemsMost generalpurpose systemsStock control,Personal loanprocessingOperating systems,Libraryinformationretrieval systemsTimetable systemsWWWinformationretrieval systemsAdvantages anddisadvantages

Direct manipulation advantagesλλλUsers feel in control of the computer and are lesslikely to be intimidated by itUser learning time is relatively shortUsers get immediate feedback on their actionsso mistakes can be quickly detected andcorrected Ian Sommerville 2000Software Engineering, 6th edition. Chapter 15Slide 17

Direct manipulation problemsλλλThe derivation of an appropriate informationspace model can be very difficultGiven that users have a large informationspace, what facilities for navigating around thatspace should be provided?Direct manipulation interfaces can be complex toprogram and make heavy demands on thecomputer system Ian Sommerville 2000Software Engineering, 6th edition. Chapter 15Slide 18

Control panel interfaceBusyGridTitleJSD. ReduceFullOUITPRINTNODELINKS Ian Sommerville 2000FONTLABELEDITSoftware Engineering, 6th edition. Chapter 15Slide 19

Menu systemsλλλUsers make a selection from a list ofpossibilities presented to them by the systemThe selection may be made by pointing andclicking with a mouse, using cursor keys or bytyping the name of the selectionMay make use of simple-to-use terminals such astouchscreens Ian Sommerville 2000Software Engineering, 6th edition. Chapter 15Slide 20

Advantages of menu systemsλλλλUsers need not remember command names asthey are always presented with a list of validcommandsTyping effort is minimalUser errors are trapped by the interfaceContext-dependent help can be provided. Theuser’s context is indicated by the current menuselection Ian Sommerville 2000Software Engineering, 6th edition. Chapter 15Slide 21

Problems with menu systemsλλλActions which involve logical conjunction (and)or disjunction (or) are awkward to representMenu systems are best suited to presenting asmall number of choices. If there are manychoices, some menu structuring facility must beusedExperienced users find menus slower thancommand language Ian Sommerville 2000Software Engineering, 6th edition. Chapter 15Slide 22

Form-based interfaceNEW itionNumber ofcopiesClassificationLoanstatusDate ofpurchaseOrderstatus Ian Sommerville 2000Software Engineering, 6th edition. Chapter 15Slide 23

Command interfacesλλλλλUser types commands to give instructions to thesystem e.g. UNIXMay be implemented using cheap terminals.Easy to process using compiler techniquesCommands of arbitrary complexity can becreated by command combinationConcise interfaces requiring minimal typing canbe created Ian Sommerville 2000Software Engineering, 6th edition. Chapter 15Slide 24

Problems with command interfacesλλλUsers have to learn and remember a commandlanguage. Command interfaces are thereforeunsuitable for occasional usersUsers make errors in command. An errordetection and recovery system is requiredSystem interaction is through a keyboard sotyping ability is required Ian Sommerville 2000Software Engineering, 6th edition. Chapter 15Slide 25

Command languagesλλλOften preferred by experienced users becausethey allow for faster interaction with the systemNot suitable for casual or inexperienced usersMay be provided as an alternative to menucommands (keyboard shortcuts). In some cases, acommand language interface and a menu-basedinterface are supported at the same time Ian Sommerville 2000Software Engineering, 6th edition. Chapter 15Slide 26

Natural language interfacesλλThe user types a command in a natural language.Generally, the vocabulary is limited and thesesystems are confined to specific applicationdomains (e.g. timetable enquiries)NL processing technology is now good enough tomake these interfaces effective for casual usersbut experienced users find that they require toomuch typing Ian Sommerville 2000Software Engineering, 6th edition. Chapter 15Slide 27

Multiple user interfacesGraphical mandlanguageinterpreterOperating system Ian Sommerville 2000Software Engineering, 6th edition. Chapter 15Slide 28

Information presentationλλλInformation presentation is concerned withpresenting system information to system usersThe information may be presented directly (e.g.text in a word processor) or may be transformedin some way for presentation (e.g. in somegraphical form)The Model-View-Controller approach is a way ofsupporting multiple presentations of data Ian Sommerville 2000Software Engineering, 6th edition. Chapter 15Slide 29

Information presentationInformation tobe displayedPresentationsoftwareDisplay Ian Sommerville 2000Software Engineering, 6th edition. Chapter 15Slide 30

Model-view-controllerView stateview modificationmessagesUser inputsController methodsView methodsModel queriesand updatesController stateModel editsModel stateModel methods Ian Sommerville 2000Software Engineering, 6th edition. Chapter 15Slide 31

Information presentationλStatic information λInitialised at the beginning of a session. It does not changeduring the sessionMay be either numeric or textualDynamic information Changes during a session and the changes must becommunicated to the system userMay be either numeric or textual Ian Sommerville 2000Software Engineering, 6th edition. Chapter 15Slide 32

Information display factorsλλλλλIs the user interested in precise information ordata relationships?How quickly do information values change?Must the change be indicated immediately?Must the user take some action in response toa change?Is there a direct manipulation interface?Is the information textual or numeric? Arerelative values important? Ian Sommerville 2000Software Engineering, 6th edition. Chapter 15Slide 33

Alternative information 89May1273June2835MayJune40003000200010000 Ian Sommerville 2000AprilSoftware Engineering, 6th edition. Chapter 15Slide 34

Analogue vs. digital presentationλDigital presentation λCompact - takes up little screen spacePrecise values can be communicatedAnalogue presentation Easier to get an 'at a glance' impression of a valuePossible to show relative valuesEasier to see exceptional data values Ian Sommerville 2000Software Engineering, 6th edition. Chapter 15Slide 35

Dynamic information display140220103Dial with needle Ian Sommerville 2000Pie chartThermometerSoftware Engineering, 6th edition. Chapter 15Horizontal barSlide 36

Displaying relative valuesPressure0100 Ian Sommerville 2000200Temperature300400025Software Engineering, 6th edition. Chapter 155075100Slide 37

Textual highlighting!The filename you have chosen has beenused. Please choose another nameCh. 16 User interface designOK Ian Sommerville 2000CancelSoftware Engineering, 6th edition. Chapter 15Slide 38

Data visualisationλλλConcerned with techniques for displaying largeamounts of informationVisualisation can reveal relationships betweenentities and trends in the dataPossible data visualisations are: Weather information collected from a number of sourcesThe state of a telephone network as a linked set of nodesChemical plant visualised by showing pressures andtemperatures in a linked set of tanks and pipesA model of a molecule displayed in 3 dimensionsWeb pages displayed as a hyperbolic tree Ian Sommerville 2000Software Engineering, 6th edition. Chapter 15Slide 39

Colour displaysλλλColour adds an extra dimension to an interfaceand can help the user understand complexinformation structuresCan be used to highlight exceptional eventsCommon mistakes in the use of colour ininterface design include: The use of colour to communicate meaningOver-use of colour in the display Ian Sommerville 2000Software Engineering, 6th edition. Chapter 15Slide 40

Colour use guidelinesλλλλλλλλDon't use too many coloursUse colour coding to support use tasksAllow users to control colour codingDesign for monochrome then add colourUse colour coding consistentlyAvoid colour pairings which clashUse colour change to show status changeBe aware that colour displays are usually lowerresolution Ian Sommerville 2000Software Engineering, 6th edition. Chapter 15Slide 41

User supportλλλUser guidance covers all system facilities tosupport users including on-line help, errormessages, manuals etc.The user guidance system should be integratedwith the user interface to help users when theyneed information about the system or when theymake some kind of errorThe help and message system should, if possible,be integrated Ian Sommerville 2000Software Engineering, 6th edition. Chapter 15Slide 42

Help and message systemApplicationHelpinterfaceError messagesystemMessagepresentationsystemHelpframes Ian Sommerville 2000Error messagetextsSoftware Engineering, 6th edition. Chapter 15Slide 43

Error messagesλλλError message design is critically important.Poor error messages can mean that a userrejects rather than accepts a systemMessages should be polite, concise, consistentand constructiveThe background and experience of usersshould be the determining factor in messagedesign Ian Sommerville 2000Software Engineering, 6th edition. Chapter 15Slide 44

Design factors in message wordingContextExperienceSkill levelStyleCulture Ian Sommerville 2000The user guidance system should be aware of what the user isdoing and should adjust the output message to the currentcontext.As users become familiar with a system they become irritatedby long, ‘meaningful’ messages. However, beginners find itdifficult to understand short terse statements of the problem.The user guidance system should provide both types of messageand allow the user to control message conciseness.Messages should be tailored to the user’s skills as well as theirexperience. Messages for the different classes of user may beexpressed in different ways depending on the terminology whichis familiar to the reader.Messages should be positive rather than negative. They shoulduse the active rather than the passive mode of address. Theyshould never be insulting or try to be funny.Wherever possible, the designer of messages should be familiarwith the culture of the country where the system is sold. Thereare distinct cultural differences between Europe, Asia andAmerica. A suitable message for one culture might beunacceptable in another.Software Engineering, 6th edition. Chapter 15Slide 45

Nurse input of a patient’s namePlease type the patient name in the box then click on OKBates, J.OK Ian Sommerville 2000CancelSoftware Engineering, 6th edition. Chapter 15Slide 46

System and user-oriented error messagesSystem-oriented error messageError #27?Invalid patient id enteredOKUser-oriented error messagePatient J. Bates is not registeredClick on Patients for a list of registered patientsClick on Retry to re-input a patient nameClick on Help for more informationCancelPatients Ian Sommerville 2000HelpSoftware Engineering, 6th edition. Chapter 15RetryCancelSlide 47

Help system designλλλλHelp? means ‘help I want information”Help! means “HELP. I'm in trouble”Both of these requirements have to be takeninto account in help system designDifferent facilities in the help system may berequired Ian Sommerville 2000Software Engineering, 6th edition. Chapter 15Slide 48

Help informationλλλλShould not simply be an on-line manualScreens or windows don't map well onto paperpages.The dynamic characteristics of the display canimprove information presentation.People are not so good at reading screen asthey are text. Ian Sommerville 2000Software Engineering, 6th edition. Chapter 15Slide 49

Help system useλλλMultiple entry points should be provided so thatthe user can get into the help system fromdifferent places.Some indication of where the user is positionedin the help system is valuable.Facilities should be provided to allow the userto navigate and traverse the help system. Ian Sommerville 2000Software Engineering, 6th edition. Chapter 15Slide 50

Entry points to a help systemTop-levelentryEntry fromapplicationEntry from errormessage systemHelp frame network Ian Sommerville 2000Software Engineering, 6th edition. Chapter 15Slide 51

Help system windowsHelp frame mapMail redirectionMail may be redirected to anothernetwork user by pressing theredirect button in the controlpanel. The system asks for thename of the user or users towhom the mail has been sentYou are heremorenexttopicsHelp history1.2.3.4.MailSend mailRead mailRedirection Ian Sommerville 2000Software Engineering, 6th edition. Chapter 15Slide 52

User documentationλλλAs well as on-line information, paperdocumentation should be supplied with a systemDocumentation should be designed for a range ofusers from inexperienced to experiencedAs well as manuals, other easy-to-usedocumentation such as a quick reference cardmay be provided Ian Sommerville 2000Software Engineering, 6th edition. Chapter 15Slide 53

User document ator’sguideHow to installthe systemGettingstartedFacilitydescriptionOperation andmaintenanceFunctionaldescriptionDescription ofservices Ian Sommerville 2000Software Engineering, 6th edition. Chapter 15Slide 54

Document typesλFunctional description λIntroductory manual λDescribes all system facilities in detailSystem installation manual λPresents an informal introduction to the systemSystem reference manual λBrief description of what the system can doDescribes how to install the systemSystem administrator’s manual Describes how to manage the system when it is in use Ian Sommerville 2000Software Engineering, 6th edition. Chapter 15Slide 55

User interface evaluationλλλSome evaluation of a user interface designshould be carried out to assess its suitabilityFull scale evaluation is very expensive andimpractical for most systemsIdeally, an interface should be evaluated against ausability specification. However, it is rare forsuch specifications to be produced Ian Sommerville 2000Software Engineering, 6th edition. Chapter 15Slide 56

Usability attributesAttributeLearnabilitySpeed of operationRobustnessRecoverabilityAdaptability Ian Sommerville 2000DescriptionHow long does it take a new user tobecome productive with the system?How well does the system response matchthe user’s work practice?How tolerant is the system of user error?How good is the system at recovering fromuser errors?How closely is the system tied to a singlemodel of work?Software Engineering, 6th edition. Chapter 15Slide 57

Simple evaluation techniquesλλλλQuestionnaires for user feedbackVideo recording of system use and subsequenttape evaluation.Instrumentation of code to collect informationabout facility use and user errors.The provision of a grip button for on-line userfeedback. Ian Sommerville 2000Software Engineering, 6th edition. Chapter 15Slide 58

Key pointsλλλλInterface design should be user-centred. Aninterface should be logical and consistent andhelp users recover from errorsInteraction styles include direct manipulation,menu systems form fill-in, command languagesand natural languageGraphical displays should be used to presenttrends and approximate values. Digital displayswhen precision is requiredColour should be used sparingly and consistently Ian Sommerville 2000Software Engineering, 6th edition. Chapter 15Slide 59

Key pointsλλλλSystems should provide on-line help. This shouldinclude “help, I’m in trouble” and “help, I wantinformation”Error messages should be positive rather thannegative.A range of different types of user documentsshould be providedIdeally, a user interface should be evaluatedagainst a usability specification Ian Sommerville 2000Software Engineering, 6th edition. Chapter 15Slide 60

user errors and allow the user to recover from errors. This might include an undo facility, confirmation of destructive actions, 'soft' deletes, etc. λ User guidance Some user guidance such as help systems, on-line manuals, etc. should be supplied λ User diversity Interaction facilities for diff