With the release of the Visual Studio 11 beta comes a new tool for designing screens: PowerPoint Storyboarding. It’s an add-on for PowerPoint that might at first seem a little underwhelming, but the fact that it’s a PowerPoint extension is exactly what makes it such a great tool for screen mock-ups and collaboration on such mock-ups. Let’s explore this new tool that ships with Visual Studio ALM.

Why PowerPoint?

Although it might be surprising to some, PowerPoint has a surprisingly rich set of features for mocking up screens. Consider the following:

• Approachable for a broad audience
• Drawing basic screens is simple, while complex screens are possible
• Animation is supported
• Includes support for review through commenting, inking and comparison
• Custom formatting of both graphics and text is rich and powerful while keeping usability strong
• Easily extensible with custom graphics, animations and add-ins
• Includes built-in screen- and audio-capture capabilities
• Provides support for rendering audio, video and other application objects (using OLE embedding)
• Macro recording is available
• Action support allows the mouse click/hover over events to fire without programming

To understand and appreciate PowerPoint Storyboarding, take a look at Figure 1, which is little more than PowerPoint with an additional set of storyboarding shapes focused on screen designs (in this particular image the Ribbon toolbar is collapsed).

**Shapes **

The shapes are organized into categories:

• Annotation Useful for adding additional sticky note information to a screen (see Figure 2).
• Backgrounds Starters that jump-start the look and feel of the screen to correspond to the platforms being designed (see Figure 3).
• The background options indicate the focus on Microsoft Platform design, but there’s no such limitation in the tool. It’s reasonable (and the extensibility simple enough) that we can expect additional platform images to appear in the not-too-distant future. This includes iPad, iPhone and Android, for example.
• These shapes aren’t simply images that can’t be divided. Rather, they’re groups of many smaller shapes, making it easy to select individual items and customize them. For example, in Figure 1, the Back/Forward buttons were easily indented to make room for the company logo.
• Common Standard Controls These are available for virtually any platform (see Figure 4). The controls are as one would expect, but notice the “animated icon” alongside the Click shape. Embedding animation into a shape demonstrates why PowerPoint is such a good solution. Placing the Click shape onto the canvas provides a Custom Path animation using standard PowerPoint animation tools (see Figure 5).

#ui