Tools for web mockups, "wire-framing"


I'm looking for a tool that'll help me create sketches/mockups of web pages. I'm not talking about the "photo-realistic" sets of PSD's that break everything down into components. I'm not looking at "public facing" results. I'm talking more about a sketchy wire-framing tool to replace a pen an paper. I know there are a few of those around.

Thanks for your input.

Web Design

asked Jan 6 '10 at 06:58
Ron M.
4,224 points
Top digital marketing agency for SEO, content marketing, and PR: Demand Roll

13 Answers


The service that's been making the most waves in this area is Balsamiq, a micro-ISV itself that's grown to greater than one million in profits in around a year and a half.

answered Jan 6 '10 at 07:04
Jay Neely
6,050 points
  • I've been a big believer in paper prototyping as the first step to any app/major enhancement. I've now used Balsamiq Mockups on my initial design of my startup and my "2010.1" version I'm developing from. Far superior to paper. – Bob Walsh 14 years ago
  • +1 for Balsamiq - I am using it and I love it! – Ricardo 14 years ago


Probably not what you're looking for, but it has worked best for me.

answered Jan 6 '10 at 07:20
Olivier Lalonde
2,753 points


There are number of wireframe stencils that can help speed up your mockups. I have tried several for Visio. Yahoo has their Design Stencils, which are available for many tools. Yahoo! Design Stencil Kit version 1.0 is available for OmniGraffle, Visio (XML), Adobe Illustrator (PDF and SVG), and Adobe Photoshop (PNG), and covers the following topics:

* Ad Units

* Calendars
* Carousels
* Charts and Tables
* UI Controls
* Form Elements
* Grids
* Menus and Buttons
* Mobile - General
* Mobile - iPhone
* Navigation and Pagination
* OS Elements
* Placeholder Text
* Screen Resolutions
* Tabs
* Windows and Containers
answered Jan 6 '10 at 07:47
Jason M
41 points


I hear great things about Balsamiq but haven't used it. I have used Axure ( ) with a lot of success. We were able to get our protos done on the free trial alone.

answered Jan 6 '10 at 08:25
41 points


Check out Pencil, Its a free tool, works as a Plugin to Firefox. It has a very decent UI, and a great response time.

answered Jan 6 '10 at 11:01
Shree Mandadi
599 points


I've tested a alot of them lately and settled on I found it's web-based version to be very helpful when geeting feedback from customers.

I like its sketchy-style better than Balsamiq, as it feels a step more professional without being to perfect.

answered Jan 7 '10 at 00:02
Chris Dansie
491 points
  • I just checked out iPlotz. Really awesome video tutorials! – Steve D 13 years ago


Pencil is free. I've used it informally and works well. It has he exporting features you need. You can make your pages look like a "sketch" or more realistic. Some developers frown on making it look too realistic because clients will think it's almost completed and will not trust you time requirements.

answered Mar 13 '12 at 00:08
Jeff O
6,169 points
  • I was about to recommend the same, Pencil is a great tool. – Christian 12 years ago
  • Looks great. Thanks! – Ali 12 years ago


Surprised it's not listed, but Mockingbird is GREAT. All online and free.

answered Jul 6 '10 at 21:28
273 points
  • Agree agree agree. – Tbaums 13 years ago


Balsamiq. Free for 30 days. Then it's $79 - one of the best purchases you'll ever make on web software. I've tried about 5 tools and balsamiq remains my favorite.

answered Mar 16 '12 at 17:24
Alex Cook
641 points


Looks like Microsoft has jumped into this space. It is free. I have never used it but Microsoft development tools are usually very slick. It will probably put balsamic out of business since they are giving it away.

answered Jan 6 '10 at 13:30
510 points
  • I couldn't find a free version. Sketchflow appears to only be sold as part of Microsoft Expression Studio Ultimate at $599 retail US. It also is not just a wireframing tool but a full blown rapid prototyping product with the ability to capture annotations. Would be awesome for custdev / leanstartup work. – Steve D 13 years ago


WireframeSketcher (my product) is a tool that helps quickly create wireframes, mockups and prototypes for desktop, web and mobile applications. It comes both as a standalone version and as a plug-in for Eclipse IDEs. It has some distinctive features like storyboards, components, linking and vector PDF export. Among supported IDEs are are Aptana, Flash Builder, Zend Studio and Rational Application Developer.

answered Mar 2 '11 at 17:51
Peter Severin
101 points
  • Please add some disclosure that you are developer of this tool. – Ross 13 years ago


I've been trying a number of these as well recently including:

Pencil - mentioned above

Mockflow - Has a desktop version. Nice. Built an iPhone mockup with included iPhone template.

Simplediagrams - very cool chalk board look.

Cacoo - good multi-purpose web app diagramming tool with collaboration.

My focus was on free or free trials. I'll have to check out the others listed in this thread now.

answered Mar 2 '11 at 18:24
Steve D
318 points


The problem with many mockup tools is that they give you a false sense of real estate.

It matters quite a lot how many pixels you have available to distribute your elements around with.

I would recommend FireWorks as it gives you a more realistic idea about your wireframes.

answered Jan 15 '10 at 07:26
Thom Pete
1,296 points

Your Answer

  • Bold
  • Italic
  • • Bullets
  • 1. Numbers
  • Quote
Not the answer you're looking for? Ask your own question or browse other questions in these topics:

Web Design