08InteractionTechnique--menus

下载 0

知秋一叶

发布于

1729

人观看

#信息技术

The course is mainly about menus.Generally covered Taxonomy of MenuDesign Choices, Menus date back to the beginning of computers, Screen Menus, Xerox PARC Research Systems, Smalltalk, Soft keys and so on.

展开查看详情

2 .What is a “Menu”? Wikipedia : “a menu is a list of options or commands presented to an operator by a computer or communications system.” Also including “buttons”, “radio buttons”, “check boxes”, “palettes”, and other interaction techniques for choice But not selecting objects in graphics editors, files in a Finder, or selecting cells in spreadsheets, etc. Also not text entry Choosing one or more of a set is one of the fundamental interaction operations: Foley & Wallace, 1974 – “A button is for selecting a system defined object such as an action to be performed…” Hundreds of variations Why menus? Takes advantage of “recognition rather than recall” – important guideline from HCI (Nielsen) © 2014 - Brad Myers 2

3 .Taxonomy of Menu Design Choices Copied from homework 2’s list Not necessarily complete or comprehensive, or in a reasonable order It would be great for you to identify more as part of your homework, etc. The KIND or TYPE of menu Linear (regular) menus, either horizontal or vertical Linear menus with scrolling – then how does it scroll? Hierarchical menus Adaptive expanding size menus, like the Mac Dock or Fisheye menus: http://dl.acm.org/citation.cfm?doid=354401.354782 Adaptive menus like the Office XP "personalized menus", that try to adapt to what you want and put that at the top Pie menus (of various sizes) http://dl.acm.org/citation.cfm?doid=57167.57182 (required reading) also as used in the Sims and other games "Marking menus" (similar to pie menus) http://dl.acm.org/citation.cfm?doid=169059.169426 andhttp://dl.acm.org/citation.cfm?doid=191666.191759 Spin menus like on the iPhone for choosing dates, etc. Menus like on Android Menus in a Game Console that you navigate using the direction keys on the game controller Menus on a Wii that you navigate by pointing to them with the controller. © 2014 - Brad Myers 3

4 .Taxonomy, cont. Contents of Menus: How many items are there in the menu? How are the items (content) in the menu arranged? Issues of different lengths of menus, and how this type of menus deals with this size (is the number of items: 2, 10, 50, 100, 1000, etc.) Inactive items – removed or grayed? How are the items arranged in the menu? Arranged alphabetically (apple, bread, crackers, ...) Arranged in groups by topic (apple, pear, |, crackers, cheese ...). Another example is the typical Edit menu: Undo, Redo | Cut, Copy, Paste | ... Arranged hierarchically by topic (fruit>, snacks>, ...) Arranged (apparently) randomly © 2014 - Brad Myers 4

5 .Taxonomy, cont. Interactions with the Menu: How does the user interact with the menu: Which specific mouse buttons or keyboard keys? How is the menu initially invoked? Fixed menu, always on the screen. At the top edge of the screen, like on Macintosh, versus somewhere else, like on Windows. Also includes palettes, toolbars of icons, etc. Popup menu with a particular mouse button over any relevant object. For example, the right-mouse context menu. Popup menu from a specific icon or widget. E.g., an "option button" like for fonts How does the user interact with the items in the menu? Press and hold, move to item, release on item Press and release ("click") to start, click again to stop What is the feedback to the user for: Hovering the mouse over an item without clicking Pressing down over an item Releasing over an item How does the user get to sub-menus, if any? Slide out of an item to get its submenu. Click on an item to get its submenu. If there are multiple ways of using the same menus, then what are the alternatives. For example, are there keyboard accelerators? Do the menus work with the keyboard arrow keys? © 2014 - Brad Myers 5

7 .Various Menus from the 1960s Including a Popup Pie Menu! NE Wiseman, HU Lemke, JO Hiles , “PIXIE: A new approach to graphical man-machine communication”, Proc. 1969 CAD Conf. , IEE Conf. Pub 51, 1969, p. 463 Mentioned in: William M. Newman and Robert F. Sproull (Eds.). 1979. Principles of Interactive Computer Graphics (2nd Ed.). McGraw-Hill, Inc., New York, NY. © 2014 - Brad Myers 7

8 .On Screen Menus Foley & Wallace, 1974 : “Menus can be used in two ways. Fig. 4 shows one which has temporarily replaced whatever had been displayed, while Fig. 5 shows one displayed with other material.” Designed to be selected with a light pen Also discusses only showing the relevant items © 2014 - Brad Myers 8

12 .Star & Viewpoint © 2014 - Brad Myers 12 1981 Command buttons Menu buttons Didn’t need many commands since universal commands, and most were on the keyboard Top row could change functions Fewer capabilities Removes unavailable items Tried to get rid of even these menus Also in prop. Sheets (1985)

13 .Star Property Sheets David Smith invented Property Sheets / Dialog Boxes for Star Choose one of a set (“choice parameters”), many of a set (“state parameters”): Whether rectangles touch (one) or not (many) © 2014 - Brad Myers 13

15 .Lisa & Macintosh 1983-4 Menu bar Infinite Y-size ( Fitts ), easier to hit Grayed out items Items checked in menus “…” if dialogs Accelerators listed in menu Flashing so can see what selected Submenus – only 1 level © 2014 - Brad Myers 15

18 .Andrew Toolkit popup menus 1985 Stack of menus Instead of pull-out hierarchy Some design issues: Press and release does nothing “Mouse hole” to get back to where were Vs. Smalltalk – just click to repeat © 2014 - Brad Myers 18

19 .Andrew Toolkit popup menus 1985 Stack of menus Instead of pull-out hierarchy Some design issues: Press and release does nothing “Mouse hole” to get back to where were Vs. Smalltalk – just click to repeat © 2014 - Brad Myers 18

20 .Andrew Toolkit popup menus 1985 Stack of menus Instead of pull-out hierarchy Some design issues: Press and release does nothing “Mouse hole” to get back to where were Vs. Smalltalk – just click to repeat © 2014 - Brad Myers 18

21 .Original Microsoft 1988 3 different keyboard mechanisms Control- xxx or function keys ALT then letter ( moded ) = “mnemonics” Arrow keys then <Enter> 2 different mouse: Press-and-hold Click-click © 2014 - Brad Myers 21

23 .OpenLook & Motif 1988 & 1989 OpenLook : Look-and-feel for Unix from Sun in collaboration with Xerox Used some of Star look-and-feel Unusual pull-down menus with defaults In competition with “Motif” which ended up winning From HP & DEC, etc. Better use of color, more 3D look Diamond vs. square © 2014 - Brad Myers 23

28 .© 2014 - Brad Myers Standard Web page menus Fixed menus of links Shneiderman counts all hyperlinks as “menus” Pull out menus Pull down menus Accordion Menus – open and close Example http://www.maison martinmargiela.com/ What else? 28

29 .© 2014 - Brad Myers Standard Web page menus Fixed menus of links Shneiderman counts all hyperlinks as “menus” Pull out menus Pull down menus Accordion Menus – open and close Example http://www.maison martinmargiela.com/ What else? 28

0点赞

0收藏

0下载