Menus

Menus

Definition Menus ** are on-screen lists of available functions and operations that can be performed in a variety of ways. There are many types of menus. Menus can be buttons, links, displayed on the screen the whole time, hidden, or partly hidden. A user might make selections on a menu by highlighting the menu with the mouse, clicking on the menu, or using the cursor keys and then pressing Enter.  Types of Menus  Alessi and Trollip (2001) list and describe three general types of menus used: full-screen menus, hidden menus, and frame menus. Full-screen menus **
 * 
 * 
 * Fills the entire screen with a list of user control options.
 * 



Hidden menus ** 
 * Includes pull-down menus, pop-up menus, tear-off menus, and several other types. Most common is the pull-down menu.
 * Typically located at the top of the screen.
 * [[image:hidden.JPG width="621" height="436"]]

Frame Menus**
 * Increasingly common feature of programs on the World Wide Web.
 * Split-screen method.
 * Typically, the left third (or less) of the screen is devoted to a list of menu options that are displayed all the time. The remainder of the screen (right two-thirds or more) is devoted to the content of the program.
 * Menu may include text, icons, pictures, or anything else.

Effective Design  In order for software and multimedia to be effective for learning, the general features of the programs must be designed well. Menus are an important component of a multimedia program. As already stated, there are different types of menus to choose from when designing a program. Depending on the focus and goal of the multimedia program, one type of menu might be more effective than another.  Advantages and Disadvantages of the 3 General Types of Menus  Alessi and Trollip (2001) describe the advantages and disadvantages to full-screen menus, hidden menus, and frame menus //<span style="font-family: 'Arial','sans-serif'; font-size: 10pt;"> Advantages of full-screen menus //
 * <span style="font-family: 'Arial','sans-serif'; font-size: 10pt;">Explain each choice with detailed text.
 * <span style="font-family: 'Arial','sans-serif'; font-size: 10pt;">Acts like an anchor point by providing a good place to begin a section of a program or go to the end of a section.
 * <span style="font-family: 'Arial','sans-serif'; font-size: 10pt;">Can provide progress information and achievement information.

//<span style="font-family: 'Arial','sans-serif'; font-size: 10pt;">Disadvantages of full-screen menus //
 * <span style="font-family: 'Arial','sans-serif'; font-size: 10pt;">Take up display space.
 * <span style="font-family: 'Arial','sans-serif'; font-size: 10pt;">Menu is not always readily available.

//<span style="font-family: 'Arial','sans-serif'; font-size: 10pt;">Advantages of hidden menus //
 * <span style="font-family: 'Arial','sans-serif'; font-size: 10pt;">Easy to implement.
 * <span style="font-family: 'Arial','sans-serif'; font-size: 10pt;">Many user choices are available, but only take up a small amount of screen space.
 * <span style="font-family: 'Arial','sans-serif'; font-size: 10pt;">May provide hierarchical categories that expand to sub-choices.
 * <span style="font-family: 'Arial','sans-serif'; font-size: 10pt;">Always available on the current screen a user is viewing.
 * <span style="font-family: 'Arial','sans-serif'; font-size: 10pt;">Good for global controls (those available all the time).

//<span style="font-family: 'Arial','sans-serif'; font-size: 10pt;">Disadvantages of hidden menus //
 * <span style="font-family: 'Arial','sans-serif'; font-size: 10pt;">More difficult to operate.
 * <span style="font-family: 'Arial','sans-serif'; font-size: 10pt;">Typically unattractive due to only black and white text.
 * <span style="font-family: 'Arial','sans-serif'; font-size: 10pt;">Limited to single text font which makes foreign language menus difficult.
 * <span style="font-family: 'Arial','sans-serif'; font-size: 10pt;">Consigned to top of screen.
 * <span style="font-family: 'Arial','sans-serif'; font-size: 10pt;">Learners might ignore or forget to use the menus.
 * <span style="font-family: 'Arial','sans-serif'; font-size: 10pt;">Not good for local controls (those that change from screen to screen).

//<span style="font-family: 'Arial','sans-serif'; font-size: 10pt;">Advantages of frame menus //
 * <span style="font-family: 'Arial','sans-serif'; font-size: 10pt;">Always visible and available to learners.
 * <span style="font-family: 'Arial','sans-serif'; font-size: 10pt;">Easy to use.
 * <span style="font-family: 'Arial','sans-serif'; font-size: 10pt;">Can include any of the features of a full-screen menu.

//<span style="font-family: 'Arial','sans-serif'; font-size: 10pt;">Disadvantages of frame menus //
 * <span style="font-family: 'Arial','sans-serif'; font-size: 10pt;">Reduces the amount of screen space for the main program.
 * <span style="font-family: 'Arial','sans-serif'; font-size: 10pt;">Might create a cluttered appearance.
 * <span style="font-family: 'Arial','sans-serif'; font-size: 10pt;">Prone to bugs when used on the Web.

<span style="font-family: 'Arial','sans-serif'; font-size: 12pt;">Menu Ordering <span style="font-family: 'Arial','sans-serif'; font-size: 10pt;"> When designing a menu for a multimedia program, the designer needs to decide the best and most effective way to organize and place their menu options in a logical sequence. After conducting an experiment on screen menu layouts and cognitive compatibility, researchers found that menu lists that are designed and organized by **alphabetical** and **categorical** ordering are more efficient than menu lists that are unordered (Coll, J. H., Coll, R., & Nandavar, 1993).

A designer should choose to organize their menu list **categorically** if the menu selections depend on the user’s ability to work with categories. If categories are used in the menu selections, the categorical ordering will be appropriate for the local groupings and more efficient and effective for the user (Coll et al., 1993).

A designer should choose to organize their menu list **alphabetically** if the menu selections operate independently of each other. This would work best for a menu created as a dictionary type model. Alphabetical ordering can sometimes be more efficient than categorical ordering because it produces a shorter task time (Coll et al., 1993).

Categorical and alphabetical ordering can also be used together. A menu can be organized by categories into a hidden menu or a frame menu. The categories in these menus can then have sub-choices that are organized alphabetically. <span style="font-family: 'Arial','sans-serif'; font-size: 12pt;"> Text-Based versus Picture-Based Menus <span style="font-family: 'Arial','sans-serif'; font-size: 10pt;"> Another factor to consider when designing a menu is whether to use a text-based menu or a picture or icon based menu. This factor depends on how many menu selections will be offered and characteristics of the users.

In a study on the writing processes and products of students with language related learning disabilities, students used two different types of writing programs (one using a text-based pull down menu with fewer options and the other using an icon-based many with more options). The researchers found that the students, who used the writing program with the text-based menu with fewer options, were able to spend more time typing and wrote longer stories than the students who used the icon-based menu with more options (Bahr, Nelson, Van Meter, & Yanna, 1996). The students from the study were more efficient when using a program with a text-based menu, therefore causing this design to be more effective for learning for these particular students versus the icon-based menu.

There are many different types of menus and all can be effective for learning. When designing a menu, it is important to know who the target audience will be in order to decide which type of menu will be most effective for the learners who will use the program.

<span style="font-family: 'Arial','sans-serif'; font-size: 14pt;"> Guidelines and Recommendations <span style="font-family: 'Arial','sans-serif'; font-size: 10pt;"> Ivers and Barron (2006) give **five guidelines** when designing menus for multimedia programs. The five guidelines include: <span style="font-family: 'Arial','sans-serif'; font-size: 10pt;"> Alessi and Trollip (2001) also give **recommendations** for designing menus for a multimedia program. Some of these recommendations are:
 * 1) <span style="font-family: 'Arial','sans-serif'; font-size: 10pt;">Provide three to six options on a menu.
 * 2) <span style="font-family: 'Arial','sans-serif'; font-size: 10pt;">Include an exit option on all menus.
 * 3) <span style="font-family: 'Arial','sans-serif'; font-size: 10pt;">Clearly state the directions for selecting menu options.
 * 4) <span style="font-family: 'Arial','sans-serif'; font-size: 10pt;">Include titles on all menus.
 * 5) <span style="font-family: 'Arial','sans-serif'; font-size: 10pt;">Place menu options in logical sequence.
 * <span style="font-family: 'Arial','sans-serif'; font-size: 10pt;">Always make menus accessible.
 * <span style="font-family: 'Arial','sans-serif'; font-size: 10pt;">If designing a full-screen menu, give the menu a good header name.
 * <span style="font-family: 'Arial','sans-serif'; font-size: 10pt;">Keep choices in a menu simple.
 * <span style="font-family: 'Arial','sans-serif'; font-size: 10pt;">If using a hierarchical menu, keep the levels few in number.
 * <span style="font-family: 'Arial','sans-serif'; font-size: 10pt;">Use menus for global control.
 * <span style="font-family: 'Arial','sans-serif'; font-size: 10pt;">Use full-screen or frame menus for programs with simple structures.
 * <span style="font-family: 'Arial','sans-serif'; font-size: 10pt;">Use hidden menus (pull-down or pop-up menus) for programs with hierarchical or other complex structures.

<span style="font-family: 'Arial','sans-serif'; font-size: 14pt;"> References <span style="font-family: 'Arial','sans-serif'; font-size: 10pt;"> Alessi, S. M., & Trollip, S. R. (2001). //Multimedia for learning: Methods and development// (3rd ed.). Massachusetts: Allyn and Bacon.

Bahr, C. M., Nelson, N. W., Van Meter, A., & Yanna, J. V. (1996). Children’s use of desktop publishing features: Process and product. //Journal of Computing in Childhood Education, 7// (3 – 4), 149 – 177.

Coll, J. H., Coll, R., & Nandavar, R. (1993). Attending to cognitive organization in the design of computer menus: A two-experiment study. //Journal of the American Society for Information Science, 44// (7), 393.

Ivers, K. S., & Barron, A. E. (2006). //Multimedia projects in education: Designing, producing, and assessing// (3rd ed.). Westport, CT: Libraries Unlimited.

TechWeb Tech Encyclopedia. []

Images are screenshots taken by me.

<span style="font-family: 'Arial','sans-serif'; font-size: 10pt;">Created by Tracy Sanborn Last updated April 25, 2010