BT
x Your opinion matters! Please fill in the InfoQ Survey about your reading habits!

PowerMockup, A New Tool for Low Fidelity Mockups

by David Bulkin on Jun 22, 2011 |

Agile teams seeking to deliver a high quality user experience often create mockups of varying fidelity to hone in on an appropriate design prior to coding (e.g. prior to sprint/iteration planning). PowerMockup is a new product for those seeking to create low fidelity mockups using a tool they are already familiar with, PowerPoint.

Low fidelity mockups, often called wireframes, are intentionally basic, often consisting of just black and white shapes and text. The lack of color and texture is intentional as it puts the focus on usability, functional design and flow instead of esthetics like color and font. The simplest technology for creating wireframes is paper and pencil, which suffers from a few flaws, including: it is time consuming to create even a basic page layout, updates are difficult, and there is no easy way to share a design.

To fill the gap, digital tools like Balsamiq Mockups, were created. With Balsamic Mockups you can create and manipulate a wireframe that for all intensive purposes looks like it was hand drawn with a felt tip pen. Many also use an old standby, PowerPoint, applying the standard built in shapes to create something that resembles a web page. All digital tools have advantages over pen and paper, including greater speed in modifying a mockup, consistency across mockups, and ease of electronic sharing.

PowerMockups is a new entrant that adds interface elements (shapes) to PowerPoint, allowing many to use a tool they already know. Features include:

  • 78 fully editable user interface elements
  • 84 wireframe icons
  • Compatible with PowerPoint 2007 and 2010 for Windows

Interface elements include basics like a browser window, text box, message box and button, along with many others. They are organized on a ribbon bar into containers, navigation, text, graphics and icons. The interface elements for navigation are shown in the image below.

PowerMockups Navigation Shapes

The interface elements are designed to simplify the creation of mockups, and they can be mixed with, and manipulated like, the built in PowerPoint shapes. To create dynamic representations you can use standard PowerPoint functionality to create slides shows or add links between pages. You can also use static representation to show flow and functionality, as in the following example.

PowerMockup Registration Example

Find out more at the PowerMockup website.

Hello stranger!

You need to Register an InfoQ account or or login to post comments. But there's so much more behind being registered.

Get the most out of the InfoQ experience.

Tell us what you think

Allowed html: a,b,br,blockquote,i,li,pre,u,ul,p

Email me replies to any of my messages in this thread

Open office ? Libre office support? by Vikas Hazrati

is that coming?

PowerMockup is a fantastic UI Mockup Tool by Martin Crisp

Along with many others, I have long believed that PowerPoint is a great tool for creating UI Mockups and linear UI Storyboards. PowerMockup is an outstanding plugin that makes PowerPoint and even more compelling tool for UI/UX design. PowerMockup best feature is it's ability for the user to add their own UI Controls. Not limited by what the vendor has included in the pallet is a powerful consideration when choosing a UI Mockup tool.

One challenge with defining UI Storyboards in PowerPoint however is the ability to define "alternate" flows of user interaction in addition to the main flow. Use Cases have the concept of main flows and alternate flows, but UI Storyboards are stuck in one dimensional main flows only, which leads to duplicating UI Designs across a lot of UI Storyboards that have some common steps. Sure you could take those common steps out and reference them in separate document, but that just leads to a maintenance nightmare as things change, not to mention making it harder for your stakeholders, testers and developers to understand the flow easily.

To address this problem and others you might want to look at PowerStory (www.power-story.com)which allows you to define main flows and alternate flows (sequences) of slides in powerpoint, basically means you can have your BAs or Product Managers define Use Cases within PowerPoint and then have your UI/UX team add UI Mockups for each step in the main and alternate flows to create the UI Storyboard.

In Addition PowerStory will generate a test case for each unique path through the combinations of main flow and alternate flows, and save these test cases into Team Foundation Server (TFS).

PowerStory ensures your use cases, ui mockups, ui storyboards and test cases all communicate the same requirements.

Combining PowerMockup and PowerStory will give you an easy and rapid way to evolve use cases into UI Storyboards while ensuring they stay in sync, as well as save significant project budget automating the creation of test cases.

Allowed html: a,b,br,blockquote,i,li,pre,u,ul,p

Email me replies to any of my messages in this thread

Allowed html: a,b,br,blockquote,i,li,pre,u,ul,p

Email me replies to any of my messages in this thread

2 Discuss

Educational Content

General Feedback
Bugs
Advertising
Editorial
InfoQ.com and all content copyright © 2006-2014 C4Media Inc. InfoQ.com hosted at Contegix, the best ISP we've ever worked with.
Privacy policy
BT