What’s the Best Application for Making Wireframes?
People just getting into information architecture (t d) frequently ask me which application to use for creating wireframes. After nearly a decade of making wireframes myself, I still ask this question on a client-by-client basis if not a project-by-project basis.
That answer relies on the answers to 2 other questions:
- Is the purpose of the wireframes: requirements gathering, interaction design, functionality validation, content organization, usability evaluation, or site documentation?
Each of these purposes inherently has different needs and requires different levels of detail and different frequency of change. For example, wireframes in usability evaluation will need to be quickly modified after each evaluation where as those documenting a site will only change during major refreshes. - Which applications do your clients prefer?
Good wireframes are living, breathing documents - just like the sites they represent. Wireframes are the easiest way to visually communicate and comprehend the impact of a change across an entire system. This makes them the perfect candidate to experiment with well after the major Information Architecture engagement is over. Therefore, it’s best to choose an application everyone is comfortable with.
With these two questions in mind, I’ve had experience with a number of applications, each with their benefits and drawbacks. None of them the best answer. Map the strengths and weaknesses below against your answers to the above questions and you’ll find the least square peg for wireframe’s preverbal round hole.
- Wall-sized Whiteboard and a Stack of Markers
- Description: Sometimes the best way to sort through a difficult problem is some dedicated wall-time. I normally start complex projects this way. Some of my most interesting conversations have come out of these wall sessions where everyone has a marker and we’re diagramming as we’re talking.
- Strengths: very approachable, great for exploring different interaction models quickly with 1-5 project team members.
- Weaknesses: requires a decent amount of physical space, difficult to distribute digitally, no redo, no copy-paste.
- Pen, Paper, Stickies, & a Copymachine
- Description: stuff you have lying around the office, think of it as a portable whiteboard.
- Strengths: very accessible, easy to update, rough and unfinished look provides excellent feedback in evaluations.
- Weaknesses: difficult to distribute digitally, adds more paper to your life, no redo, no copy-paste.
- Adobe Illustrator
- Description: Adobe’s professional digital illustration tool.
- Strengths: Most popular vector-based drawing tool, fast, very flexible text operations, cross-platform, readable by Adobe Acrobat.
- Weaknesses: no support for multiple pages in the same document, no text underline feature out-of-the box, no customized and editable stencil palette, tedious to make changes across multiple documents, tough learning curve.
- Macromedia Freehand
- Description: Macromedia’s professional illustration and layout tool.
- Strengths: supports multiple pages in the same document, find and replace for shapes and text, shapes stay connected when moved, robust text handling,
- Weaknesses: not as popular as Illustrator, tough learning curve.
- OmniGraffle
- Description: a young Visio for Macintosh. This is what I use for all my side projects.
- Strengths: very flexible custom palette system, a number of wireframing stencils already exist, exports to Visio’s XML format, shapes want to be locked together, inexpensive compared to Illustrator or Freehand.
- Weaknesses: not everywhere, Mac-only, no easy way to draw freehand, interface model not exactly like Illustrator or Freehand, doesn’t support multiple layouts, awkward to draw freehand.
- Microsoft Visio
- Description: Microsoft’s flow-charting tool, originally built to help software developers to visualize and organize their code.
- Strengths: supports multiple pages, supports multiple layouts, can auto-insert useful information like last-modified date, lots of organizations already have this in-house as part of Microsoft Office, wireframing stencils exist and can be easily customized, shapes stay connected when moved.
- Weaknesses: interaction model completely unlike Freehand or Illustrator - will drive experienced graphic designers batty, might be the only reason to purchase VirtualPC, nasty type handling.
- Macromedia Dreamweaver
- Description: Macromedia’s website building tool.
- Strengths: hyperlinking, form elements, templating built-in, great for creating live prototypes, has site-mapping built-in, supports styelsheets, files are text and can easily be added to version-control systems, can integrate into live systems.
- Weaknesses: no easy way to handle annotations, the generated code is throw-away, some knowledge of HTML is needed to create quickly, doesn’t print well.
- Microsoft PowerPoint
- Description: The application you love-to-hate and hate-to-love.
- Strengths: slides are already formatted for screens, very flexible printing options, hyperlinking and animation built-in, supports multiple pages in the same document, offers a specific place for annotations, find-and-replace, super easy to update on the fly, everybody can update it easily.
- Weaknesses: doesn’t support multiple layouts easily, difficult to design pages longer than a single screen, somewhat awkward interaction model.

6 Comments
Here are the apps I have experience with and the order of how I like them:
1. Paper and pen
2. HTML
3. Photoshop screen shots
4. Denim
5. Visio
6. Getting poked in the eye with a sharp stick
7. Powerpoint
I have heard some god things about some mac tools like OmniGraffle 3 and there was another one I used for a while that was slick something with card in it - maybe more like rapid prototyping?
Of course this thread could easily get bogged down in a semantics discussion of what wireframing is and isn’t and what flow mapping is and isn’t but I will leave that for someone else.
I just stumbled upon this list of options today:
http://www.iawiki.net/DiagrammingTools
Take a look at a PowerPoint add-in that simplifies creating IA artifacts.
Even though I’m not a big fan of PowerPoint, I created IATools because PowerPoint was the one application that everybody had on their computer.
Did you have a look at Denim?
stw
Denim
I haven’t looked at Denim for a few years now. Being free is a huge win. As the site mentions “DENIM was designed with a pen interface in mind”. That’s the downside I recall. Working with a mouse or keyboard in Denim’s non-standard interface is awkward. It does export to HTML which is a win. If you’re looking for an electronic napkin sketch, Denim might work well.
It was awhile ago now, but we used to use a tool called Inspiration. It was cross platform and easy to use when I was starting out.
I’ve also used to use CaseWise Corporate Modeler which is a hella expensive db driven system and process flowchart application. You can treat process steps as objects and associate them across multiple systems, sites, department process maps, on and on. It was crazy to learn but working with it expanded my perspective. Bottom line is that unless you’re working in a vaccuum, drawing software only works if it is shareable amongst stakeholders.
3 Trackbacks
Finally, Rapid Prototyping that is actually rapid.
I recently crawled out from under a rather large rock, career-wise, and before I did so I made like the cool kids and got myself a Gmail account.
Oh, behold the glory that is Gmail.
Anyway…
Reading through a discussion on CHI-WEB or sigia-l (I…
Rapid Prototyping with Ruby on Rails
On the heels of Fred’s MNteractive debut, “Finally, Rapid Prototyping that is actually rapid”, I’m finally digging into Ruby on Rails and have been pleasantly surprised.
After playing with it for a couple days, the RailsDay.co…
ConceptDraw is Visio for Mac
I’ve finally had an opportunity to dig into using ConceptDraw on an information architecture project. It’s very much a cross-platform Visio. I first noticed this in the toolbar interaction, the Zoom tool specifically. In conventional illust…