Click to Rate and Give Feedback
MSDN
MSDN Library
.NET Development
Windows Vista
Guidelines
Windows Environment
 Notification Area
Notification Area

Is this the right user interface?
Design concepts
Usage patterns
Guidelines
Text

The notification area is a portion of the taskbar that displays icons for system and program features that have no presence on the desktop. The notification area also provides a temporary source for notifications and status.

Items in this area are referred to as notification area icons, or in the context of the notification area, icons for short.

The notification area.

Note: Guidelines related to the Start menu, taskbar, notifications, and balloons are presented in separate articles.

Is this the right user interface?

To decide, consider these questions:

  • Is the icon used to display a notification? If so, you must use a notification area icon.
  • Is the icon displayed temporarily to display a change of status? If so, a notification area icon may be appropriate, depending upon the following factors:
    • Is the status useful and relevant? That is, are users likely to monitor the icon and change their behavior as a result of this information? If not, either don't display the status, or put it in a log file.

      Incorrect:

      In this example, the disk drive activity icon is inappropriate because users are unlikely to change their behavior based on it.

    • Is the status critical? Is immediate action required? If so, display the information with a form of user interface (UI) that demands attention and cannot be easily ignored, such as a dialog box.
  • Does the feature already have "desktop presence"? That is, when run, does the feature appear in a window on the desktop? If not, use an icon for program access and to show status. Otherwise, display the information in the program's status bar or other status area.
    • Exception: Use a notification area icon if it is useful when other programs are active.

      In this example, the Outlook icon is used to display connection status.

      In this example, the backup program is performing a long-running task whose status is relevant while other programs are active.

  • Is the icon primarily to launch a program or access its features or settings quickly? If so, use the Quick Launch area of the taskbar or the Start menu instead. The notification area isn't intended just for quick program access.

    In this example, Quick Launch is used to launch Windows® Explorer and Windows Internet Explorer quickly.

Design concepts

The Windows Desktop

The Windows Vista® desktop has the following program access points:

  • Desktop. A large surface where the user can store programs, documents, and their shortcuts.
  • Start menu button. The access point for all programs and special Windows places (Documents, Pictures, Music, Games, Computer, Control Panel), with "most recently used" lists for quick access to recently used programs and documents.
  • Quick Launch. A direct access point for programs selected by the user.
  • Taskbar. The access point for programs that have desktop presence.
  • Deskbands. Minimized functional, long-running programs, such as Windows Media® Player. Programs that minimize to deskbands aren't displayed in the taskbar.
  • Notification area. Access point for system and program-related features that have no presence on the desktop, as well as a short-term source for notifications and status.
  • Sidebar. The access point for Sidebar gadgets.

The Windows desktop consists of the desktop surface, Start menu button, Quick Launch bar, taskbar, deskbands, notification area, and Sidebar.

The desktop is a limited, shared resource. You should use its areas as intended—any other usage should be considered an abuse. Such abuse creates clutter and makes it difficult for these access points to serve their intended purpose.

To use the desktop access points effectively:

  • Desktop. If your target users are likely to use your program frequently, provide an option during setup to put a shortcut on the desktop, unselected by default.
  • Start menu. During setup, put your program in only a single location on the Start menu.
  • Quick Launch. Don't put program shortcuts in Quick Launch by default. Rather, during setup, give users this option, unselected by default.
  • Deskbands. For functional, long-running programs, such as Windows Media Player, have an option to minimize to a deskband that is unselected by default.
  • Notification area. Use only for system and program features that have no presence on the desktop, as well as a short-term source for notifications and status. Any other usage should be optional, unselected by default.

The desktop is the user's entry point to Windows. Leave the user in control. Use these entry points appropriately—never view them as ways to promote awareness of your program or its brand.

Keeping users in control

Keeping users in control extends beyond using the notification area correctly. Depending on the nature of your icon, you may want to let users do the following:

  • Remove the icon. Your icon may provide relevant, useful status, but even so, users may not want to see it. The Customize Icons dialog box in Taskbar and Start Menu Properties allow users to always hide icons, but this feature isn't necessarily discoverable. To keep users in control, provide a Display icon in notification area option on the icon's shortcut menu. Note that removing an icon doesn't have to affect the underlying program, feature, or process.
  • Select types of notifications to display. Your notification must be useful and relevant, but there may be notifications that users don't want to see. This is especially true for FYI notifications.
  • Suspend optional features. Icons are used to display status for features without desktop presence. Such features tend to be long-running, optional background tasks, such as printing, indexing, scanning, or synchronizing. Users may want to suspend such features to increase system performance, reduce power consumption, or because they are offline.
  • Temporarily quit program. The program is stopped and restarted when Windows is restarted.
  • Permanently quit program. The program is stopped and not restarted when Windows is restarted (unless the user chooses to restart later). Either the user no longer wants to run the program, or wants to run the program on demand—perhaps to improve system performance.

Although it's a good idea to provide most of these settings on the icon's shortcut menu, the program's default experience should be suitable for most users. Don't turn everything on by default and expect users to turn features off. Rather, turn the important features on by default, and let users enable additional features as desired.

If you do only three things...
1.  Don't abuse the notification area. Use it only for features without desktop presence and as a source for status and notifications.
2.  Keep users in control. Provide appropriate options to control the icon, its notifications, and the underlying features.
3.  Present a default experience that is suitable for most users. Let users enable desired features rather than force them to disable undesired ones.

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, Windows Task Manager shows CPU usage status while it is running.

Temporary event status
Programs with desktop presence can display icons temporarily to show important events or changes in status.

In this example, new message, printing, and installing updates icons 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, Microsoft 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 conditional apply, minimizing to an icon simply eliminates having two access points when only one is necessary.

Guidelines

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:
      PatternWhen to remove
      Action success When notification is removed.
      Action failure When problem is resolved or after 5 minutes.
      Non-critical system event When problem is resolved or after 5 minutes.
      Optional user task When task is done or after 5 minutes.
      FYI When notification is removed.
      Feature advertisement When notification is removed.
  • For the temporary event status pattern, display the icon while the event is happening. Remove icons that display other changes in status after 5 minutes.
  • 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 Shortcut menus).
  • Don't display icons meant for administrators to Standard users.

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:
    PatternIcon 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. Apply the other Aero-style icon guidelines as well.
  • Use full-color icons. Certain Windows system icons are high key (mostly white) with color overlays, but other programs should not use this style.
  • 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 these standard overlays:
    OverlayStatus
    Stopped
    Started
    Disabled
    Disconnected
    Offline
    Warning
    Error
    Needs attention

    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 continuous animations to show continuous activities. 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 these examples, the Wireless icons use a brief animation to show connection and sign-in status.

    • 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.

    In this example, a rich infotip is used to give detailed status information.

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 dialog box or popup window with the most useful settings.

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

    • The program window.

      In this example, left clicking displays the program window.

    • A status dialog box.

      In this example, left clicking displays the status dialog box.

    • The related control panel item.
    • The shortcut menu.
  • Display a shortcut menu only if the other choices don't apply, with the default command in bold. In this case, display the same shortcut 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 shortcut 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 shortcut menu, with the default command in bold.

Shortcut menus

  • Display the shortcut menu near its associated icon, but away from the taskbar.
  • The shortcut 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 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"
  • Remove rather than disable any shortcut menu items that don't apply.
  • For Open, Run, Suspend/Resume commands, be specific about what is being opened, run, suspended, and resumed.

    In this example, Windows Defender has specific Open and Run commands.

  • Use Suspend/Resume, not Enable/Disable. Use a check mark rather than toggle between two states.

    Incorrect:

    In this example, Windows Defender should use a check mark to suspend or resume protection.

  • All background tasks must have a Suspend/Resume command. Choosing the command should temporarily suspend the task. Users may want to temporarily suspend background tasks to increase system performance or reduce power consumption. Suspended background tasks are restarted when resumed by the user or when Windows is restarted.
  • Allow users to opt into or out of different notification types if your program has notifications that some users might not want to see. The FYI notification pattern requires users to opt in, so these notifications must be disabled by default.

    In this example, Outlook allows users to choose the notifications they receive from the icon.

  • Clearing the "Display icon in notification area" option removes the icon from the notification area, but doesn't affect the underlying program, feature, or process. Users can redisplay the icon from the program's Options dialog box. Don't automatically re-display the icon when Windows is restarted.
  • The Exit command quits the program for the current Windows session and removes the icon. Don't have an Exit command if program can't be shut down. The program is restarted when Windows is restarted. Users can permanently quit the program from the Options dialog box.
  • Don't have an About command. Such information should be communicated by the icon, its infotip, and the shortcut menu. If users want more information, they can view the primary UI.

For general shortcut menu guidelines and examples, see Menus.

Options dialog box

  • Options not accessible directly from the shortcut menu must be in the Options dialog box. This dialog could be the feature's control panel.
  • The Options dialog box may include the following items as appropriate (exact text is in quotes):
    • Enable [feature name] (check box)
      • Clearing this option permanently quits the program. Program can be restarted from its control panel. The Exit command in the shortcut menu quits the program only for the current Windows session.
    • "Display icon in notification area" (check box)
      • Removing the icon from the notification area doesn't affect the underlying feature.
      • Selecting this option allows user to restore the icon, which of course can't be done from the icon itself.
  • Disable features that are rarely used, or potentially annoying or distracting. Let users opt in to such features.

For general Options dialog box guidelines and examples, see Property Windows.

Minimizing windows to the notification area

  • To reduce taskbar clutter, provide the ability to minimize applications to the notification area 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.
  • Use the Minimize button on the application's title bar, not the Close button.
  • Use zoom rectangles to clearly associate the application window with its minimize destination.

    In this example, Windows Live Messenger uses zoom rectangles to show where it is being minimized.

Text

Infotips

  • The icon infotip should have one of the following formats (where the company name is optional):
    • (Company name) Feature, program, or device name
    • (Company name) Feature, program, or device name - Status summary
    • (Company name) Feature, program, or device name
      Status summary.
    • (Company name) Feature, program, or device name
      Status list with each item on a separate line

Infotip phrasing:

  • Use sentence fragments.
  • Don't use ending punctuation on the first line. Use ending punctuation with a status summary, not with a status list.
  • Omit unnecessary words. Don't include the software version or other extraneous information.

    Incorrect:

    In this example, the infotip has extraneous information.

  • Don't explain how to interact with the icon.

    Incorrect:

    In this example, the Wireless Network Connection icon gives right-click instructions.

Documentation

When referring to the notification area:

  • Refer to the notification area as the notification area, not the system tray.

When referring to a notification area icon:

  • Refer to the icon using the exact name given in its infotip, including its capitalization, followed by icon.
  • For the first reference, also refer to the notification area.
  • When possible, format the heading text using bold. Otherwise, put the heading in quotation marks only if required to prevent confusion.

Example: To check the network status quickly, right-click the Local Area Connection icon in the notification area.

Guidelines feedback

© 2008 Microsoft Corporation. All rights reserved. Terms of Use  |  Trademarks  |  Privacy Statement
Page view tracker