Review: 16 User Interface Prototyping Tools
People constantly ask me what the best prototyping or mockup tool is. My standard answer is “whichever tool you are most comfortable/experienced with.” But just to cover all the bases and make sure that I’m not missing out on the “silver bullet”, I decided to do a review of all the tools that I’m aware of. You could (and probably should) distinguish between pure mockup tools (e.g. “Pencil”) and tools for creating interactive prototypes (e.g. Adobe’s soon to be released product code named “Thermo”), but for the purposes of this matrix, I lumped them all together, and I noted which have interactive capabilities and which don’t.
My picks:
1) Low fidelity mockups for idea exploration and communication: Balsamiq
2) Interactive prototypes to test and communicate interactions: Adobe Flex (Thermo may change my mind)
3) High fidelity drawing tool: Adobe Illustrator or OmniGraffle
Review:
| Balsamiq | Pencil | OmniGraffle Pro | Visio Pro | |
| One liner | Cool! | This can’t really be a Firefox addon! | Amazingly simple and powerful drawing | Practical and business-like |
| Ramp up time | none | minuscule | small | small |
| Other expertise required | none | none | none | none |
| Supports interactivity | nope | nope | nope | nope |
| Full lifecycle product (rough to spec) | rough only | rough only | yes | somewhat |
| Fun to use | absolutely! | yes | yes | somewhat |
| Ease of creating a mockup of tree navigation | drag and drop and populate | no tree stencil! | had to download Yahoo stencils | straight-forward |
| Time to build mockup of tree navigation | 15 min | 1 hr | 1 hr | 30 min |
| Quirky? | nope | somewhat | nope | nope |
| Cost | $79 | free | $199.95 | $559.95 |
| Photoshop CS4 | Illustrator CS4 | Fireworks CS4 | Dreamweaver CS4 | |
| One liner | Gold standard for bitmap tools | Gold standard for vector tools | Bitmap Vector but I still don’t get it… | Yes, there are countless HTML toolkits out there, but I still love it |
| Ramp up time | very large | very large | medium | large |
| Other expertise required | knowledge of bitmap tools | knowledge of vector tools | none (for this) | html, javascript, css |
| Supports interactivity | nope | nope | nope | yes |
| Full lifecycle product (rough to spec) | professional | professional | yes | yes |
| Fun to use | somewhat | somewhat | rendering is poor | yes |
| Ease of creating a mockup of tree navigation | from scratch | from scratch | no default tree! | had to find javascript tree control and figure out how to use |
| Time to build mockup of tree navigation | 1 hr | 1 hr | gave up | gave up |
| Quirky? | difference between Illustrator and PS can be confusing | difference between Illustrator and PS can be confusing | average | nope |
| Cost | $699 | $599 | $299 | $399 |
| Flash CS4 | Flex 3 Pro | Thermo (codename) | Powerpoint 2007 | |
| One liner | You can do whatever you want - total interactive flexibility | With some programming experience this rocks! | Not released yet - but from experience on the beta I have high hopes | Great prototyping tool for the earnest product manager  |
| Ramp up time | huge | medium | large | negligible |
| Other expertise required | programming | programming | none | none |
| Supports interactivity | oh yes! | oh yes! | yes! | okay… yes |
| Full lifecycle product (rough to spec) | yes | rough - not really a visual tool | sort of | rough only |
| Fun to use | yes | subjective, but for me yes | yes! | no |
| Ease of creating a mockup of tree navigation | no built-in tree | easier than flash because of built-in tree, but still not automatic | medium | no tree |
| Time to build mockup of tree navigation | gave up | 1 hr | 1 hr | 2 hr |
| Quirky? | not really | nope | nope | nope |
| Cost | $699 | $699 | ? | $299 |
| Axure | iRise Pro | Microsoft Expression Blend 2 | Microsoft Expression Design 2 | |
| One liner | Why? | Think process, large teams, … but why? | Microsoft’s Flash | Microsoft’s Fireworks |
| Ramp up time | very large | very large | very large | large |
| Other expertise required | none | none | a little more than Flash | a little more than Fireworks |
| Supports interactivity | I think | I think | yes | nope |
| Full lifecycle product (rough to spec) | yes | yes | yes | professional |
| Fun to use | no | no | no | no |
| Ease of creating a mockup of tree navigation | didn’t find tree immediately | didn’t find tree immediately | didn’t try - too tired to go on - opened the interface and started clicking around and just closed it | Stopped with Blend 2 - I hope the argument for these tools is not “MS Office integration |
| Time to build mockup of tree navigation | gave up | gave up | gave up | didn’t try |
| Quirky? | not really | not really | don’t know | don’t know |
| Cost | $589 | $6,995 | $499 | $699 (for Studio - couldn’t find individual) |
