Microsoft
Wang Li, Wang Yini, Li YIcheng
 This
is a presentation about Microsoft
Windows7 guidelines
 Wang
Li K8wali00
 Li Yicheng K8liyi00
 Wang Yini k9wayi00
 This
style guide gives descriptions about
Design Principles, Controls, Commands, Text,
Messages, Interaction, Windows, Visuals,
Experiences, Windows Environment

Describe what the style guide says about navigation
What features are important for navigation?
-Recognizable, Obvious, Relevant,
 Nail the basics
 Design experinces , not features
 Be great at something
 Don’t be all thing to all people
 Make the hard decisions
 Make the experience like a friendly conversation
 Do the right thing by default
 Make it just work
 Ask questions carefully
 Make it a pleasure to use
 Make it responsive
 Keep it simple
 Avoid bad experiences
 Design for common problems
 Don't be annoying
 Reduce effort, knowledge, and thought
 Follow the guidelines
 Test your UI

The following fonts and colors are defaults for Windows Vista and Windows 7
Choose fonts and optimize window layouts based on the UI technology and the target version of Windows:

Color is typically used in UI to
communicate:
Meaning. The meaning of a message can

State.

Differentiation.

Emphasis. Color can be used to draw

be summarized through color. For example,
color is often used to communicate status—
where red is a problem or error, yellow is
caution or warning, and green is good.
An object's state can be indicated
through color. For example, Windows® uses
color to indicate selection and hover states.
Links within Web pages use blue for unvisited
and purple for visited.
People assume that
there is a relationship between items of the
same color, so color coding is an effective
way to differentiate between objects. For
example, in a control panel item, task panes
use a green background to visually separate
them from the main content. Also,
Microsoft® Outlook® allows users to assign
different colored flags to messages.
users' attention. For example, Windows uses
blue main instructions to help them stand
out from the other text.
Application icons and Control Panel items: The full set includes 16x16, 32x32, 48x48, and 256x256 (code scales
between 32 and 256). The .ico file format is required. For Classic Mode, the full set is 16x16, 24x24, 32x32, 48x48
and 64x64.
List item icon options: Use live thumbnails or file icons of the file type (for example, .doc); full set.
Toolbar icons: 16x16, 24x24, 32x32. Note that toolbar icons are always flat, not 3D, even at the 32x32 size.
Dialog and wizard icons: 32x32 and 48x48.
Overlays: Core shell code (for example, a shortcut) 10x10 (for 16x16), 16x16 (for 32x32), 24x24 (for 48x48),
128x128 (for 256x256). Note that some of these are slightly smaller but are close to this size, depending on shape
and optical balance.
Quick Launch area: Icons will scale down from 48x48 in Alt+Tab dynamic overlays, but for a more crisp version, add a
40x40 to .ico file.
Balloon icons: 32x32 and 40x40.
Additional sizes: These are useful to have on hand as resources to make other files (for example, annotations, toolbar
strips, overlays, high dpi, and special cases): 128x128, 96x96, 64x64, 40x40, 24x24, 22x22, 14x14, 10x10, and 8x8.
You can use .ico, .png, .bmp, or other file formats, depending on code in that area.

Menu bars. A menu bar is best used to catalog all the available top-level commands within a program. New users of your program
are likely to review all the commands in the menu bar to answer questions like: What can the program do?

What commands does the program have?

What are the shortcut keys for the common commands?
Effective menu bars are comprehensive, well organized, and self-explanatory. Efficiency is desirable, but not crucial (and often
not possible). Consider menu bars to be primarily a learning and discovery tool, especially for new users.

Toolbars. A toolbar is best used for quick, convenient access to frequently used, immediate commands. They don't have to be
comprehensive or even self-explanatory—just direct and efficient.

Command buttons. Command buttons are a simple, visible, direct way to expose a small number of primary commands. However,
they don't scale well, so you should use menus in primary windows for more than a few commands.

Context menus. Context menus are simple, direct, and contextual. They are also efficient because they display only the commands
and options that apply to the current context. Because they are displayed at the pointer's current location, they eliminate the
need to move the mouse to display a menu. However, they normally have no visible presence on the screen. Consider context
menus appropriate only for redundant contextual commands and options targeted at advanced users.
A Help system is composed of various types of content designed to assist
users when they are unable to complete a task, want to understand a
concept in more detail, or need more technical details than are available
in the UI.
http://www.oamk.fi/~teraisan/K1033BI/Exerci
ses/styleguide/WIN7_UXGuide.pdf