UI Style Guide Menus - Revision history

Janne Peräaho: Removed extra linefeed

2017-06-19T11:17:56Z

Removed extra linefeed

← Older revision		Revision as of 11:17, 19 June 2017
Line 298:		Line 298:
	\| [options]		\| [options]
	\|		\|
	\| Listed in this menu should be any specific options you wish to handle through a menu item, such as what screen resolution to operate in or baud rate for a terminal package. Or you could have an option labelled Set Settings... that would bring up a control panel which could be used to set all the program's options. [options] can be toggle items, or they can bring up submenus or requesters - it all depends on your		\| Listed in this menu should be any specific options you wish to handle through a menu item, such as what screen resolution to operate in or baud rate for a terminal package. Or you could have an option labelled Set Settings... that would bring up a control panel which could be used to set all the program's options. [options] can be toggle items, or they can bring up submenus or requesters - it all depends on your application's needs. Whatever these options are, they would change the user's preferences for that session only. To save them as defaults the user would have to use one of the Save Settings items. Note: the word [option] shown here is only a placeholder to be replaced with a descriptive menu label.
	application's needs. Whatever these options are, they would change the user's preferences for that session only. To save them as defaults the user would have to use one of the Save Settings items. Note: the word [option] shown here is only a placeholder to be replaced with a descriptive menu label.
	\|-		\|-
	\| Create Icons?		\| Create Icons?

Janne Peräaho: Removed extra linefeed

2017-06-19T11:16:55Z

Removed extra linefeed

← Older revision		Revision as of 11:16, 19 June 2017
Line 270:		Line 270:
	\| Assign Macro...		\| Assign Macro...
	\|		\|
	\| Assign Macro... should bring up a requester through which the user can assign the script created by the previous two commands. Macros can be implemented [in] a number of ways. One longtime favorite is to assign the macro to the function keys, the ten keys across the top of the		\| Assign Macro... should bring up a requester through which the user can assign the script created by the previous two commands. Macros can be implemented [in] a number of ways. One longtime favorite is to assign the macro to the function keys, the ten keys across the top of the keyboard, or to some other keyboard combination. Or the Macro can be assigned to the User menu (see section later in this chapter). Or the macro can be given a name and saved to disk; from there it can be implemented via an ARexx command console. Some programs may choose to support one, some or all of these methods. Your Assign Macro... requester should reflect all the possible choices your program supports.
	keyboard, or to some other keyboard combination. Or the Macro can be assigned to the User menu (see section later in this chapter). Or the macro can be given a name and saved to disk; from there it can be implemented via an ARexx command console. Some programs may choose to support one, some or all of these methods. Your Assign Macro... requester should reflect all the possible choices your program supports.
	\|-		\|-
	\| Load...		\| Load...

Steven Solie: /* Colors */

2013-07-31T22:17:28Z

Colors

← Older revision		Revision as of 22:17, 31 July 2013
Line 46:		Line 46:
	=== Colors ===		=== Colors ===

	When possible, menus should use dark text on a light background~~. Note: the examples shown in this chapter don't follow this rule because the version of Release 2 they were taken from had color constraints that prevented this rule from being obeyed~~.		When possible, menus should use dark text on a light background.

	=== Font ===		=== Font ===

Alexandre Balaban: Categorized into User Interface Style Guide

2013-04-26T09:27:41Z

Categorized into User Interface Style Guide

← Older revision		Revision as of 09:27, 26 April 2013
Line 1:		Line 1:
			[[Category:User Interface Style Guide]]
	== Menus ==		== Menus ==

Steven Solie at 21:26, 24 April 2013

2013-04-24T21:26:49Z

← Older revision		Revision as of 21:26, 24 April 2013
Line 110:		Line 110:
	When a menu item brings up a window or requester, an ellipsis (three dots) should be appended to the menu item's label.		When a menu item brings up a window or requester, an ellipsis (three dots) should be appended to the menu item's label.

	[[File:SG6-4.png\|frame\|center\|~~Fig 6.4:~~ A menu item that brings up a requester or another window]]		[[File:SG6-4.png\|frame\|center\|A menu item that brings up a requester or another window]]

	==== Submenus ====		==== Submenus ====
Line 116:		Line 116:
	When an item has a submenu, the symbol » should be placed on the far right side of the menu item. These should be flush right (see the next section).		When an item has a submenu, the symbol » should be placed on the far right side of the menu item. These should be flush right (see the next section).

	[[File:SG6-5.png\|frame\|center\|~~Fig 6.5:~~ A menu item that brings up a submenu]]		[[File:SG6-5.png\|frame\|center\|A menu item that brings up a submenu]]

	==== Lining up on the Right ====		==== Lining up on the Right ====
Line 132:		Line 132:
	Applications that create, edit and save data should have a Project menu. The Project menu should be the first menu on the left side of the menu bar and should contain as many of these items as appropriate - in the order shown.		Applications that create, edit and save data should have a Project menu. The Project menu should be the first menu on the left side of the menu bar and should contain as many of these items as appropriate - in the order shown.

	[[File:SG6-6.png\|frame\|center\|~~Fig 6.6:~~ The Project menu]]		[[File:SG6-6.png\|frame\|center\|The Project menu]]

	{\| class="wikitable"		{\| class="wikitable"
Line 210:		Line 210:
	You should support the Clipboard as your buffer for cut-and-paste operations. This will allow the user to share the clips between applications. For more information on the Clipboard see [[UI Style Guide Data Sharing]].		You should support the Clipboard as your buffer for cut-and-paste operations. This will allow the user to share the clips between applications. For more information on the Clipboard see [[UI Style Guide Data Sharing]].

	[[File:SG6-7.png\|frame\|center\|~~Fig 6.7:~~ The Edit menu]]		[[File:SG6-7.png\|frame\|center\|The Edit menu]]

	{\| class="wikitable"		{\| class="wikitable"
Line 252:		Line 252:
	The Macros menu should allow the user to create and assign macros. Optionally, you can include the ability to load and save macros as well.		The Macros menu should allow the user to create and assign macros. Optionally, you can include the ability to load and save macros as well.

	[[File:SG6-8.png\|frame\|center\|~~Fig 6.8:~~ The Macros menu]]		[[File:SG6-8.png\|frame\|center\|The Macros menu]]

	{\| class="wikitable"		{\| class="wikitable"
Line 289:		Line 289:
	Two items should be accessible through this menu (if your program supports them): a toggle item asking if icons should be created and an overall Save Settings item. They may be directly in the menu or in a requester brought up by a menu item.		Two items should be accessible through this menu (if your program supports them): a toggle item asking if icons should be created and an overall Save Settings item. They may be directly in the menu or in a requester brought up by a menu item.

	[[File:SG6-9.png\|frame\|center\|~~Fig 6.9:~~ The Settings menu]]		[[File:SG6-9.png\|frame\|center\|The Settings menu]]

	{\| class="wikitable"		{\| class="wikitable"
Line 324:		Line 324:
	The User menu is a variable-length menu that contains user-defined macros and any other optional features a user may want to add as a menu item. This should be located at the far right.		The User menu is a variable-length menu that contains user-defined macros and any other optional features a user may want to add as a menu item. This should be located at the far right.

	[[File:SG6-10.png\|frame\|center\|~~Fig 6.10:~~ A sample User menu]]		[[File:SG6-10.png\|frame\|center\|A sample User menu]]

Steven Solie: /* Ghosting */

2013-04-24T21:25:48Z

Ghosting

← Older revision		Revision as of 21:25, 24 April 2013
Line 92:		Line 92:
	Whenever a menu or menu item is inappropriate or unavailable for selection, it should be ghosted. Never allow the user to select something that does nothing in response.		Whenever a menu or menu item is inappropriate or unavailable for selection, it should be ghosted. Never allow the user to select something that does nothing in response.

	[[File:SG6-3.png\|frame\|center\|~~Fig 6.3:~~ A menu with ghosted items]]		[[File:SG6-3.png\|frame\|center\|A menu with ghosted items]]

	=== Labeling ===		=== Labeling ===

Steven Solie: /* Toggle Items */

2013-04-24T21:25:35Z

Toggle Items

← Older revision		Revision as of 21:25, 24 April 2013
Line 57:		Line 57:
	Toggle items should be indented to allow room for the check mark. This will give the user a visual cue that it is a toggle item.		Toggle items should be indented to allow room for the check mark. This will give the user a visual cue that it is a toggle item.

	[[File:SG6-2.png\|frame\|center\|~~Fig 6.2:~~ A toggle menu item shown in both states]]		[[File:SG6-2.png\|frame\|center\|A toggle menu item shown in both states]]

	=== Organization ===		=== Organization ===

Steven Solie: /* Menu Anatomy */

2013-04-24T21:25:15Z

Menu Anatomy

← Older revision		Revision as of 21:25, 24 April 2013
Line 17:		Line 17:
	The menu system consists of the menu bar which shows the name of each menu, a drop-down menu under each name showing the list of choices (also known as menu items), and an optional group of secondary choices called a submenu, which are attached to a menu item. Submenus should appear to the right of the menu.		The menu system consists of the menu bar which shows the name of each menu, a drop-down menu under each name showing the list of choices (also known as menu items), and an optional group of secondary choices called a submenu, which are attached to a menu item. Submenus should appear to the right of the menu.

	[[File:SG6-1.png\|frame\|center\|~~Fig 6.1:~~ Elements of the menu system]]		[[File:SG6-1.png\|frame\|center\|Elements of the menu system]]

	== General Rules ==		== General Rules ==

Steven Solie at 20:11, 1 September 2012

2012-09-01T20:11:37Z

← Older revision		Revision as of 20:11, 1 September 2012
Line 1:		Line 1:
			== Menus ==

	Menus are used either to invoke an action from a fixed list of choices or to set an option within an application.		Menus are used either to invoke an action from a fixed list of choices or to set an option within an application.

Steven Solie: /* User Menu */

2012-08-30T16:54:51Z

User Menu

← Older revision		Revision as of 16:54, 30 August 2012
Line 322:		Line 322:
	The User menu is a variable-length menu that contains user-defined macros and any other optional features a user may want to add as a menu item. This should be located at the far right.		The User menu is a variable-length menu that contains user-defined macros and any other optional features a user may want to add as a menu item. This should be located at the far right.

	Fig 6.10: A sample User menu.		[[File:SG6-10.png\|frame\|center\|Fig 6.10: A sample User menu]]