WIMP: Windows, Icons, Menus (or mice), Pointers (or pull-down menus) Kathy Lynch and Julie Fisher Topic Overview. Suggested Readings.

Transcription

1 IMS3470 Human-computer interaction WIMP: Windows, Icons, Menus (or mice), Pointers (or pull-down menus) Kathy Lynch and Julie Fisher 2004 Topic Overview WIMP or is it GUI? (interface model using direct manipulation techniques) Windows Icons dealt with in another lecture Menus Pointers Gizmos Windows pollution GUI flow Note: Slides NOT in the lecture handout are signified by a IMS3470 [Lynch & Fisher] 2 Suggested Readings Merholz, P (2000) Interface models (of the future?) Mussio, P., Cugini, U and Bordegoni, M (2001) Post-WIMP interactive systems. HCI International. /uc-hci.pdf IMS3470 [Lynch & Fisher] 3 Windows method for mapping the local world of one's personal computer [ Areas on the screen that behave as if they were independent Usually contains graphics or text Can be moved or resized Distinguishing title bar, and may have special boxes in the corners Vertical and horizontal scroll bars may be present IMS3470 [Lynch & Fisher] 4 Icons Menus (see topic on icons and metaphors) A small picture to represent an object Can be realistic representations of the object that it stands for, or they can be highly stylised, or can be arbitrary symbols Full mode Playlist Graphic equilizer IMS3470 [Lynch & Fisher] 5 Research indicates that error rates can be cut and user s think time reduced where a meaningful organisation of menus is used. Key to menu structure design is to consider task related objects and actions. Categories should be comprehensible and distinctive so users are confident in making selections. Even with short response times frequent menu users can become annoyed if required to make several menu selections to complete simple tasks. IMS3470 [Lynch & Fisher] 6

2 Menu types Single menu: two or more items, maybe permanently available or pop up Binary menus: yes no, true false e.g. printer icon Multiple menu items Pull down and pop-up menus (and the new flyout menu ) (for detail, see another lecture Interaction styles and direct manipulation) Menus with Type-ahead This allows user to not have to wait to see menus before choosing items. User can type a string of letters or numbers when presented with a menu. Many applications allow for this. E.g. Alt O, P brings up paragraph formatting in MS Word. Advantaged users can move from novice menu users to knowledgeable command users easily, as there are no new commands to learn. IMS3470 [Lynch & Fisher] 7 IMS3470 [Lynch & Fisher] 8 Menu names or bookmarks Fly-out menus [1] Numbered menu items assigned, menu names to each menu frame. Users can follow menus or if no name of function can type it in and go there directly. Saves users having to work through several levels of menus. Strategy useful if there is only a small number of destinations each user needs to remember. (eg shortcuts on mobile phones) IMS3470 [Lynch & Fisher] 9 Fly-out menus come in three main shapes: Pop-up menus fly out from under your cursor wherever it is, often when you click your right mouse button. Problem: Using with a Web browser where there is already set the pop-up menu to useful tasks like letting you open a link in a new window, save a file, print a page. Drop-down menus display one option, while typically a small arrow to the right of the box invites you to click and bring more options into view. Problem: If you own one of those wonderful mouses with a scrolling wheel, a twist of the wheel will change your menu choice - often without your knowledge. IMS3470 [Lynch & Fisher] 10 Fly-out menus [2] Fly-out menus [2] Cascading menus - also called hierarchical menus - show you a new second or even third menu when you click on the first menu item. The best-known cascading menu lives underneath the Windows Start button. Problem: Web-based are unpredictable. Some fly out as soon as the mouse passes over them; others appear only when you click. Some stay put when your mouse moves off them; others disappear. a small target - miss and you go somewhere else ( Cascading menus IMS3470 [Lynch & Fisher] 11 IMS3470 [Lynch & Fisher] 12

3 Problems with Fly-out menus Menu macros, custom toolbars & stylesheets hiding The cursor pop-up (in Windows, the menu called by the right mouse-button) But using a Web browser has already sets that pop-up menu to useful tasks like letting you open a link in a new window, save a file, print a page. The drop-down menu suffers from a usability glitch of its own. If you own one of those wonderful mouses with a scrolling wheel, a twist of the wheel will change your menu choice - often without your knowledge. IMS3470 [Lynch & Fisher] 13 Macros allow users to record regularly used paths, then place them on toolbars (as text or icon) Mechanism allows tailoring of system and can provide simplified access mechanisms for users with special needs. IMS3470 [Lynch & Fisher] 14 Menu titles Title can make a big difference in responses. Need to be carefully chosen, particularly descriptive or memorable. For single menus simple descriptive title that identifies situation is all that is necessary. With linear sequence of menus title should accurately represent stages in sequence. Consistent placement of titles, other features and menu screens is important; inconsistent placement increases users time to select items. IMS3470 [Lynch & Fisher] 15 Menus and navigation Useful to organise commands in a hierarchical way. Designers must display menus so that they are natural to use. Empirical evidence suggests 4 alternatives: Alphabetical Categorical selection of suitable categories can be difficult Conventional neither categorical nor alphabetical Frequency based on use (Preece ) IMS3470 [Lynch & Fisher] 16 Phrasing of menu items Guidelines: Use familiar and consistent terminology must be familiar to user community Ensure individual items are distinct from one another Use consistent and concise phrasing Bring keyword to the left - first word user likely to recognise should be on the left. (Shneiderman, 359) Menus: Graphic layout and design Consistent formats help users to locate necessary information, focus users attention on relevant material, and reduce users anxiety by offering predictability. (Shneiderman 260) Guidelines: Titles centred or left justified? Item placement typically left justified with item number or letter proceeding item description. Instructions should be identical in each menu Error messages should be consistent IMS3470 [Lynch & Fisher] 17 IMS3470 [Lynch & Fisher] 18

4 Pointers Pointing and selection Requires an input device Uses a cursor that is controlled by the input device The cursor s look can be customised Creeping featurism Or windows pollution Common problem is to provide excessive number of objects / actions which can overwhelm users. Excessive objects / actions take more code to maintain, cause more bugs, slowdown execution times, require more help screens, error messages etc. For users excess functionality slows learning. IMS3470 [Lynch & Fisher] 19 IMS3470 [Lynch & Fisher] 20 WIMP/GUI s flow Flow is a condition of deep, nearly meditative involvement (Cooper 1995 p128), Flow can make the user unaware of the passage of time, Flow can make a user extremely productive Flow makes user interaction with the software transparent Designing and maintaining flow Follow mental models Direct, don t discuss (don t use dialogue, don t scold or embarrass) Keep tools close at hand, plentiful and easy to see, and easy to use. Use palates or tool bars, display their status (on/off) Give modeless feedback, feedback doesn't stop the normal flow of the application. Limit modal feedback Dialog boxes use the same style (Cooper, 1995 p128) IMS3470 [Lynch & Fisher] 21 IMS3470 [Lynch & Fisher] 22 Functionality and usability Keeping the user informed Cumulative percentage of usage Number of codes Reduces errors and frustration Quantitative information Textual, graphical, statistical Reflects the status of the program Reports to user useful information, user can change appearance to suit IMS3470 [Lynch & Fisher] 23 IMS3470 [Lynch & Fisher] 24

5 Further reading Cooper, A (1995) About face Preece et al (1994) chapter 14 (Designing windowing systems), chapter 13 (menus) A flying window attack can wound your navigation 1.html IMS3470 [Lynch & Fisher] 25