In the absence of design / UX folk, Product Managers are sometimes called upon to create mockups. The tools I’ve seen fall in a spectrum from quick ‘n’ dirty to glorious but laborious:
- POP + pen and paper: the flexibility, speed and feel of pen and paper
- moqups, Balsamiq: speed and decent looks, but you’re basically stuck with their library of components
- Photoshop, Sketch: Maximum fidelity, but time-consuming and has higher learning curve
What I’ve been using of late falls somewhere in between the second and third bucket: PowerPoint + Powermockup. If you’ve read about Google’s Design Sprint, the concept of using PowerPoint / Keynote should be familiar to you.
The Workspace: Powermockups in PowerPoint
Powermockup is a library of shapes for PowerPoint. They’re pretty up-to-speed – you’ll find Bootstrap components, as well as high-fidelity iPhone and Android UI components. moqups/Balsamiq is much simpler, but these are a 100x more customisable – they’re PowerPoint shapes after all.
Powermockup’s Library of Shapes
That’s not to downplay the work the Powermockup team has put into these shapes. They’ve done some work to make sure most resize nicely; when I resize a dialog box, for example, the title bar remains the same height – it doesn’t just expand like how a regular shape would. There were some exceptions to this (the Bootstrap modal), but for the most part resizing was pleasant.
Notice that the title bar of these shapes remains the same, even after I resized them!
Where possible, they’ve also used SmartArt-styled shapes. Take the alert dialog, for example – when I click on the shape, a list of options appears, allowing me to easier change the icon or number of buttons:
Most of the components are actually groups of shapes – meaning you can tweak individual shapes as you please. For example, I can change the date in this iPhone calendar component:
Suggestions to the team – make icons out of filled shapes rather than outlines, so we can color them; I’d love to have some ready-made page setups to mimic common resolutions and aspect-ratios (especially for mobile). The resizing of some components are a little tricky.
Overall, I do like this tool! You do have to pay for it, but it’s worth considering. Check out their free trial – it has a limited library of shapes and components, but you’ll get a good idea whether it’s a fit for your workflow. I highly recommend it.