出自UXGuide.net

通知区域

Notification Area

目录 1 这样的用户界面是否正确？ 2 设计理念 2.1 Windows 桌面 2.2 Using the notification area appropriately 2.3 让用户来控制 3 Usage patterns 4 Guidelines 4.1 General 4.2 When to show 4.3 Where to show 4.4 Icons 4.5 Interaction 4.5.1 Hover 4.5.2 Left single-click 4.5.3 Left double-click 4.5.4 Right-click 4.6 Context menus 4.7 Rich tooltips 4.8 Notification area flyouts 4.9 Options dialog box 4.10 Minimizing programs to the notification area 5 Text 5.1 Infotips 6 Documentation

“通知区域”是任务栏的一部分，用于为那些不出现在桌面上的系统或程序特性显示图标。通知区域也为通知和状态提供了临时的位置源。

该区域中的项被称为“通知区域图标”，或者在通知区域的上下文中简称为“图标”。

通知区域

To give users control of their desktop in Windows® 7, not all notification area icons are displayed by default. Rather, icons are displayed in the notification area overflow unless promoted to the notification area by the user.

The notification area overflow.

注：与开始菜单、任务栏、通知和气球状提示相关的设计规范请参考各自相应的章节。

这样的用户界面是否正确？

考虑下列问题以进行判断：

• 该图标是否用于显示通知？如果是，你“必须”使用通知区域图标。
• 该图标是否用于临时显示状态的改变？如果是，通知区域图标可能适用，视下列因素而定：
  • 该状态是否有用且对用户有现实意义？或者说，用户是否会留意该图标并因为该信息而改变他们的行为？如果不会，那么要么不要显示该状态，要么就记入日志文件中。

错误：

在这个示例中，磁盘驱动器活动图标是不合适的，因为用户不会因此而改变他们的行为。

• • 该状态信息是否非常重要？是否需要立即采取行动？如果是，则应使用能够吸引注意力且无法轻易忽略的用户界面形式来显示该信息，如对话框。

Programs designed for Windows 7 can use overlay icons on the program's taskbar button to show change of status, as well as taskbar button progress bars to show progress of long-running tasks.

• 该功能特性是否已经在桌面上有所展现？或者说，该功能特性在运行时是否会在桌面上显示窗口？如果不会，则应使用一个图标来访问程序并显示状态。否则，应将信息显示在程序的状态栏或其他状态区域中。or, for Windows 7, directly on the taskbar button. If the feature doesn't have desktop presence, you can use an icon for program access and to show status.
• 该图标是否主要用于快速启动程序或访问其功能或设置？如果是，则应改用开始菜单来启动程序。通知区域不是仅用于快速访问程序的。

在这个出自 Windows Vista® 的示例中，快速启动栏用于快速启动 Windows® Explorer 和 Windows Internet Explorer。

For programs designed for Windows 7, users can pin taskbar buttons for quick program access. Programs can use a Jump List or thumbnail toolbar to access frequently used commands directly from a program's toolbar button. The Quick Launch area isn't displayed by default in Windows 7.

In this example, a Jump List is used for quick command access.

设计理念

Windows 桌面

Windows 桌面包含下列程序访问点：

• Work area. The onscreen area where users can perform their work, as well as store programs, documents, and their shortcuts. While technically the desktop includes the taskbar, in most contexts it refers just to the work area.
• 开始按钮：所有程序及特殊 Windows 位置（文档、图片、音乐、游戏、计算机、控制面板）的访问点，并包含“最近使用”列表以快速访问最近使用过的程序和文档。
• 快速启动：对用户选择的程序的直接访问点。Quick Launch was removed from Windows 7.
• 任务栏：对出现在桌面上的程序的访问点。While technically the taskbar spans the entire bar from the Start button to the notification area, in most contexts taskbar refers to the area in between, containing the taskbar buttons. This area is sometimes referred to as the taskband.
• 桌面工具栏：功能最精简的、持续运行的程序，如语言栏。最小化为桌面工具栏的程序不再显示在任务栏中。Deskbands are not recommended for Windows 7.
• 通知区域：A short-term source for notifications and status, as well as an access point for system- and program-related features that have no presence on the desktop.

Windows 桌面入口点由开始按钮、任务栏、桌面工具栏及通知区域组成。注意任务栏按钮的缩略图特性。

The Windows desktop is a limited, shared resource that is the user's entry point to Windows. Leave users in control. 你应当按照其本意来进行使用——任何其他的使用方式都应视为滥用。Never view them as ways to promote awareness of your program or its brand.

Using the notification area appropriately

The notification area was originally intended as a temporary source for notifications and status. Its efficiency and convenience has encouraged developers to give it other purposes, such as launching programs and executing commands. Unfortunately over time, these additions made the notification area too large and noisy, and confused its purpose with the other desktop access points.

Windows XP addressed the scale problem by making the area collapsible and hiding the unused icons. Windows Vista addressed the noise by removing unnecessary, annoying notifications. Windows 7 has gone a step further by focusing the notification on its original purpose of being a notification source. Most icons are hidden by default in Windows 7, but can be promoted to the notification area manually, by the user. To keep users in control of their desktops, there is no way for your program to perform this promotion automatically. Windows still displays notifications for hidden icons by promoting them temporarily.

In Windows 7, most notification area icons are hidden by default.

In addition, Windows 7 supports many features directly in the taskbar buttons. Specifically, you can use:

• Jump Lists and thumbnail toolbars to quickly access frequently used commands.
• Overlay icons to show status for running programs.
• Taskbar button progress bars to show progress for long-running tasks.

In short, if your program has desktop presence, take full advantage of the Windows 7 taskbar button features for these purposes. Keep the notification area icons focused on displaying notifications and status.

让用户来控制

让用户来控制已经不仅仅是正确使用通知区域。根据你的图标的特性不同，你可能希望让用户进行下列操作：

• 移除此图标。你的图标也许能提供切实有用的状态信息，但即便如此，用户也可能不想看到它。任务栏和开始菜单属性中的自定义图标对话框允许用户永远隐藏图标，但这个功能并不那么容易发现。要让用户来控制的话，应当在图标的快捷菜单中提供一个“在通知区域显示图标”的选项。要注意移除图标并不需要影响背后的程序、功能或操作。
• 选择要显示的通知类型。你通知的内容必须有用且与实际相关，但还是有用户不想看到的通知，尤其是那类FYI（仅供参考）的通知信息。让用户选择启用那些不太重要的信息。
• 暂停可选的功能。图标是用于显示那些不会呈现在桌面上的功能状态的。这类功能通常都是长时间的、可选的后台任务，例如打印、索引、扫描或同步。用户可能想暂停这类功能以提高系统性能、减少电量消耗或因为目前处于脱机状态。
• Quit the program. Provide the more suitable of these options:
  • 临时退出程序。该程序将中止并当 Windows 重新启动后再次启动。This approach is suitable for important system utilities such as security programs.
  • 彻底退出程序。该程序将中止且“不会”在 Windows 重新启动后再次启动（除非用户选择稍后重新启动）。用户要么不想再运行该程序，要么希望只在需要时才运行——也许是为了提高系统的性能。

虽然在图标的快捷菜单上几乎把所有设置都提供出来是不错的主意，但程序的默认体验应当适合于大多数用户。不要默认把什么都打开然后期望用户来一个一个关掉。而是默认打开最重要的特性，让用户根据他们的需要启用额外的特性。

最重要的四件事：

1. 不要滥用通知区域。仅将其用于那些不会出现在桌面上的特性或是作为状态或通知的位置源。
2. 让用户来控制。提供合适的选项以控制图标、其通知及背后的功能特性。
3. 提供适用于大多数用户的默认体验。让用户来启用他们需要的功能而不是强迫他们关掉他们不想要的。
4. Take full advantage of the Windows 7 taskbar button features to show status and make your program's most frequently performed tasks efficient.

Usage patterns

Notification area icons have several usage patterns:

System status and access Displayed continuously to show important but not critical system status, and to provide access to relevant features and settings.	System features that need notification area icons have no persistent desktop presence. Can also be used as a notification source. In this example, the battery, network, and volume icons are displayed continuously when applicable.
Background task status and access Displayed while a background task is running to show status and provide access to features and settings.	Background processes need notification area icons when they have no desktop presence. Can also be used as a notification source. In this example, the Action Center icon allows users to check its status even when it has no desktop presence.
Temporary event status Programs with desktop presence can display icons temporarily to show important events or changes in status.	In this example, icons for printing and installing updates are displayed temporarily to show important events or changes in status.
Temporary notification source Displayed temporarily to show a notification. Removed after a timeout, or when the underlying problem is addressed or task performed.	Temporary icons are preferred for pure notification sources. Don't display an icon that doesn't provide useful, relevant, dynamic status just because a feature might need to display a notification in the future. In this example, the plug-and-play icon is displayed while a new hardware detected notification is shown.
Minimized single-instance application To reduce taskbar clutter, a single-instance, long-running application can be minimized to a notification area icon instead.	In this example from Windows Vista, Outlook and Windows Live™ Messenger are single-instance applications that minimize to notification area icons. Consider using this pattern only if all of the following apply: The application can have only a single instance. The application is run for an extended period of time. The icon shows status. The icon can be a notification source. Doing so is optional and users must opt in. If all these conditions apply, minimizing to an icon eliminates having two access points when only one is necessary. Note: This icon pattern is no longer recommended for Windows 7. Use regular taskbar buttons instead if your program has desktop presence. In this example from Windows 7, a regular taskbar button takes little space, but benefits from the Windows 7 taskbar button features, including Jump Lists, overlay icons, and rich thumbnails.

Guidelines

General

• Provide only one notification area icon per component.
• Use an icon with 16x16, 20x20, and 24x24 pixel versions. The larger versions are used in high-dpi display modes.

When to show

• For the temporary notification source pattern:
  • Windows displays the icon when the notification is displayed.
  • Remove the icon based on its notification design pattern:

    Pattern	When to remove
    Action success	When notification is removed.
    Action failure	When problem is resolved.
    Non-critical system event	When problem is resolved.
    Optional user task	When task is done.
    FYI	When notification is removed.

• For the temporary event status pattern, display the icon while the event is happening.
• For all other patterns, display the icon when the program, feature, or process is running and the icon is relevant unless the user has cleared its Display icon in notification area option (for more information, see Context menus). Most icons are hidden by default in Windows 7, but can be promoted to the notification area by the user.
• Don't display icons meant for administrators to standard users. Record the information in the Windows event log.

Where to show

• Display windows launched from notification area icons near the notification area.

Windows launched from notification area icons are displayed near the notification area.

Icons

• Choose the icon based on its design pattern:

  Pattern	Icon type
  System status and access	System feature icon
  Background task status and access	Program or feature icon
  Temporary notification source	Program or feature icon
  Temporary event status	Program or feature icon
  Minimized single-instance application	Program icon

  

  
  

  In this example, Outlook uses an e-mail feature icon for a temporary notification source and its application icon for the minimized application.
• Choose an easily recognizable icon design. Prefer icons with unique outlines over square or rectangular shaped icons. Keep the designs simple—prefer symbols over realistic images. Apply the other Aero-style icon guidelines as well.
• Use icon variations or overlays to indicate status or status changes. Use icon variations to show changes in quantities or strengths. For other types of status, use the following standard overlays. Use only a single overlay, and locate it bottom-right for consistency.

  Overlay	Status
  	Warning
  	Error
  	Disabled/Disconnected
  	Blocked/Offline

  

  
  In this example, the wireless and battery icons show changes in quantities or strengths.

  

  
  

  In this example, overlays are used to show error and warning states.
• Avoid swaths of pure red, yellow, and green in your base icons. To avoid confusion, reserve these colors to communicate status. If your branding uses these colors, consider using muted tones for your base notification area icons.
• For progressive escalation, use icons with a progressively more emphatic appearance as the situation becomes more urgent. In these examples, the appearance of the battery icon becomes more emphatic as the urgency increases.
• Don't change status too frequently. Notification area icons shouldn't appear noisy, unstable, or demand attention. The eye is sensitive to changes in the peripheral field of vision, so status changes need to be subtle.
  • Don't change the icon rapidly. If underlying status is changing rapidly, have the icon reflect high-level status. Incorrect: In this example, the modem icon displays blinking lights (as a hardware modem does), but those state changes aren't significant to users.
  • Don't use long-running animations to show continuous activities. Such animations are a distraction. An icon's presence in the notification area sufficiently indicates continuous activity.
  • Brief, subtle animations are acceptable to show progress during important temporary, transitive status changes. In this example, the Wireless icon displays an activity indicator to show that work is in progress.
  • Don't flash the icon. Doing so is too distracting. If an event requires immediate attention, use a dialog box instead. If the event otherwise needs attention, use a notification.
• Don't disable notification area icons. If the icon doesn't currently apply, remove it. However, you can show an enabled icon with a disabled status overlay if users can enable from the icon. In this example, users can enable sound output from the icon.

For general icon guidelines and examples, see icons.

Interaction

Note: The following click events should occur on mouse up, not mouse down.

Hover

• Display a tooltip or infotip that indicates what the icon represents.

In this example, a tooltip is used to describe the icon on hover.

For infotip text guidelines, see the Text section of this article.

Left single-click

• Display whatever users most likely want to see, which may be:
  • A flyout window, dialog box, or program window with the most useful settings and commonly performed tasks. For presentation guidelines, see Notification area flyouts.

In these examples, left clicking displays popup windows with the most useful settings.

• • A status flyout.

In this example, left clicking displays the status flyout.

• • The related control panel item.
  • The context menu.

Users expect left single-clicks to display something, so not displaying anything makes a notification area icon appear unresponsive.

• Display a context menu only if the other choices don't apply, with the default command in bold. In this case, display the same context menu that is shown on right-click to avoid confusion.
• Prefer using a popup window over a dialog box for a more lightweight feel. Show only the most common settings and have them take immediate effect for a simpler interaction. Dismiss the popup window if the user clicks anywhere outside the window.
• Display small windows near the associated icon. However, large windows such as control panel items can be displayed in the center of the default monitor.

Left double-click

• Perform the default command on the context menu. Typically, this displays the primary UI associated with the icon, such as the associated control panel item, property sheet, or program window.
• If there is no default command, perform the same action as a left single-click.

Right-click

• Display the context menu, with the default command in bold.

Context menus

• Display the context menu near its associated icon, but away from the taskbar.
• The context menu may include the following items, as appropriate, in the listed order (exact text is in quotes):

Primary commands

Open (default, list first, in bold)

Run

Secondary commands

<separator>

Suspend/resume enable/disable command (check mark)

"Minimized to notification area" (check mark)

Opt in to notifications (check mark)

"Display icon in notification area" (check mark)

<separator>

"Options"

"Exit"