Evolution of User Interfaces, Part II. INTERACTION STYLE COMPARISON (see Shneiderman, pg 70, Table 2.1) Menu selection Advantages: shortens training, reduces keystrokes, structures decision making, permits use of dialog management tools, easy to support error handling. Disadvantages: danger of many menus, may slow frequent users, requires screen space, requires rapid display rate. Form fill-in Advantages: simplifies data entry, requires modest training, assistance is convenient, shows context for activity, permits use of form management tools Disadvantages: consumes screen space Command language Advantages: flexibility supports user initiative, appeals to "power" users, potentially rapid for complex tasks, support macro capability Disadvantages: requires substantial training and memorization, difficult to retain, poor error handling Natural language Advantages: relieves burden of learning syntax Disadvantages: requires clarification dialog, may require more keystrokes, may not show context, unpredictable Direct manipulation Advantages: visually presents task, easy to learn, easy to retain, errors can be avoided, encourages exploration, high subjective satisfaction Disadvantages: may require graphics display/pointing devices/ more programming effort, may be hard to record history or write ================================= The Supporting Actors: Dialogue Boxes Definition (Preece, 1994): on-screen controls that the system displays to provide contextual information -- make a related set of choices -- type in some information -- choose from a set of options that may change depending on context -- acknowledge a piece of information before proceeding ========================= MODAL VS MODELESS: Modal dialogue boxes: force the user to respond to some question before any other action can be taken, because all other controls are frozen. "An error has occurred in your program. To keep working anyway, click Ignore and save your work in a new file. To quit this program, click Close. You will lose information you entered since your last save." Modeless dialogue boxes: offer information and request some action, but do not restrict the actions of the user. ======================================= TYPES (Cooper, 1995): Property dialogue boxes: reflects all of the characteristics of the current selection and enables the user to make changes to these characteristics. Function dialogue boxes: mostly modal as they typically control a single function like printing, opening a file, etc. Process dialogue boxes: alerts the user to some internal function problem. -- make clear to the user that a time-consuming process is happening -- make clear to the user that things are completely normal -- make clear to the user how much more time the process will take -- provide a way for the user to cancel the operation ON GENERAL MENU SELECTION: Shneiderman: 1. Menu selection is attractive -- it eliminates training and memorization of complex command sequences. 2. It reduces keying errors and structures the task to guide the user. 3. Menus display choices/commands must be memorized. 4. Menus should fit logically into categories and be meaningful. ====================== MENU STRUCTURE Single Menu Structure: may have 1 or 2 items, one or more screens, may allow for multiple selections. o binary menus Yes or No choices o mnemonic letter: Be careful B Black and White film type C Color Film Tpe Type the letter of your choice: SINGLE MENUS IN GUIs: o radio buttons o check boxes o pull-down & pop-up menus pull-down: selections available along a top menu bar pop-up: displayed in response to a click of a mouse (pie menus) ========================== TREE STRUCTURES (Shneiderman) When multiple items become difficult to maintain. Can be confusing/complex. Depth vs breadth issue: depth: number of levels breadth: number of items per level Studies show breadth is preferred over depth. Users prefer broad shallow trees to narrow/deep trees. ======================= Breadth vs Depth (Galitz, 1994): The advantages of a menu system with greater breadth and less depth are: Fewer steps and shorter time to reach one's objective Fewer opportunities to wander down wrong paths Easier learning by allowing the user to see relationships of menu items A broad menu's disadvantages are: A more crowded menu that may reduce the clarity of the choice wording Increased likelihood of confusing similiar choices because they are seen together The advantages of greater depth are: Less crowding on the menu Fewer choices to be scanned Easier hiding of inappropriate choices Less likelihood of confusing similiar choices since it is less likely that they will be seen together Greater depth disadvantages are: More steps and longer time to reach one's objective More difficulties in learning since relationships between elements cannot always be seen. More difficulties in predicting what lies ahead/below Higher error rates ============================ MENU ITEM PRESENTATION Sequencing items: Time: chronological ordering Numeric ordering: ascending or desending Physical properties: increasing or decreasing length, area, volume, temperature, etc. For non-natural ordering use: Alphabetic sequence of items Grouping of related items Most frequently used items first Most important items first Shneiderman and Mitchell (1989) Found that subjects were able to memorize the relative position of menu items even on menus with 15 items. There was some disorientation and strong negative affect when menu ordering changed. ======================= DYNAMIC VERSUS STATIC MENUS Adaptive System: a system with a user interface which can adjust to meet a user's needs. Dynamic adaptive user interfaces automatically change in response to the user's behavior. Dynamic modification can be automatic and continuous, or periodic, and at the user's discretion. --------------- Take an order --------------- Erase an item --------------- Help --------------- Get next --------------- In the dynamic mode, the menu items are continously reordered so that the most frequently selected item is always the first item on the menu. ================================== ARGUMENTS FOR STATIC MENUS/INTERFACES 1. The user will become familiar with a fixed interaction style. 2. A static interface makes user's skills portable across systems, assuming that the user has mastered the fixed interaction style. 3. A standardized static user interface for an architecture can reduce learning time if new applications adhere to the conventions of the existing interface. 4. Implementing a static user interface is less costly than a dynamic user interface. 5. Users do not want to take the time to configure their own interface. 6. Multiple products sharing a single user interface will have the same "look and feel." 7. "The user may not be able to develop a coherent model of the system if the system changes frequently." (Norcio and Stanley, 1988) 8. The user may experience a "loss of control or the feeling of loss of control" when using a dynamic adaptive user interface. ==================================== ARGUMENTS FOR ADAPTIVE (DYNAMIC) USER INTERFACES 1. The user is probably an expert in the task domain and may know more about what the interface should look like than the system designer. 2. The user probably knows best how he or she wants to use the application and does not want to use an arbitrary set of commands. 3. One interface cannot possibly meet every user's needs. 4. Users frustrated by a user interface which does not meet their requirements will abandon the application in favor of another which has a user interface which more closely meets their needs. 5. A reduction in learning time will result if a user interface can be configured to work like an interface the user has already mastered. 6. Users will be more satisfied using a system which they can interact with in their own style. 7. An adaptive interface can increase performance by reducing a user's mental and physical workload. =============================== OVERALL FINDINGS OF SHNEIDERMAN AND MITCHELL (1989) o Dynamic menus can slow down first time users, at least until they become accustomed to this interaction style. o Even after a small amount of practice there are no performance differences between dynamic and static menus. o Most of the subjects did not like dynamic menus and the affective component was strongly felt. ============================== MENU PROPER USAGE SUMMARY (Galitz, 1994) MENU BAR To identify and provide access to: -- common and frequently used application actions -- actions that take place in a wide variety of different windows PULL-DOWN MENU For frequently used application actions that take place in a wide variety of different windows: -- a small number of items (5-10) -- items rarely changing in content CASCADING MENU To simplify a higher level menu To provide easier browsing of a higher level menu Restrict to 1-2 cascades POP-UP MENU For: -- frequent users -- a small number of items (5-10) -- items rarely changing in content -- items that require a small amount of space ICONIC MENU To designate applications available To designate special functions within an application =============================== SOME MENU DESIGN GUIDELINES (Galitz, 1994) Provide a general or main menu Display: -- all relevant alternatives -- only relevant alternatives -- delete or gray-out inactive choices Match menus according to how people structure their tasks Minimize number of levels within limits of clarity -- without logical grouping of elements, limit choices to 4-8. -- with logical groupings, 9 or more choices may be displayed Create hierarchical groupings of items that are logical, distinctive, meaningful and mutually exclusive -- provide immediate access to critical or frequently chosen items. Order list of choices by their natural order or: -- use small number of options (seven or less) -- alphabetic order -- consistency between menus Control: -- one selection per menu -- simple key actions -- provide multiple pathways -- provide "look-aheads" -- provide menu maps Menu titles: -- short, simple, clear, distinctive -- locate it at the top of the listing of choices -- spell out fully using an upper-case font. Menu item descriptions: -- familiar, full descriptions -- first letter of each item description should be capitalized -- identical items on different menus should be named identifically Menu item arrangment: -- align alternatives or choices into columns when possible -- orient for top to bottom reading -- left-justify descriptions -- if horizontal orientation of descriptions must be maintained: -- organize for left-to-right reading Assign keyboard equivalents and accelerators ============================ FORM FILL-IN DESIGN GUIDELINES o Meaningful title o Comprehensible instructions o Logical grouping and sequencing of fields o Visually appealing layout of the form o Familiar field labels o Consistent terminology and abbreviations o Visible space and boundaries for data entry fields o Convenient cursor movement o Error correction for individual characters and entire fields o Error messages for unacceptable values o Optional fields should be marked o Explanatory messages for fields =================