Tell me more ×
Answers OnStartups is a question and answer site for entrepreneurs looking to start or run a new business. It's 100% free, no registration required.

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.

share|improve this question
This topic has been done to death on SO, stackoverflow.com/questions/55363/… and is borderline on-topic at best there. This isn't relevant specifically to startups. – David Dec 10 '11 at 19:24

18 Answers

up vote 17 down vote accepted

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.

share|improve this answer
2  
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 Jan 5 '10 at 21:05
+1 for Balsamiq - I am using it and I love it! – Ricardo Jan 6 '10 at 3:25

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

alt text

share|improve this answer
hehe! you're right, but there's no way I'm fitting a notebook on my crammed table :-) – ron M. Jan 5 '10 at 21:08
3  
For paper mockups, you might want to checkout this collection of printable wireframe templates: geekchix.org/blog/2010/01/03/… – Jay Neely Jan 6 '10 at 0:55

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.

http://developer.yahoo.com/ypatterns/about/stencils/

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
share|improve this answer
Great link. We're going to put these in diagram.ly ASAP so people can use them in a free tool. – David Mar 18 '11 at 12:09

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

share|improve this answer

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

share|improve this answer

I've tested a alot of them lately and settled on http://www.iplotz.com

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.

share|improve this answer
I just checked out iPlotz. Really awesome video tutorials! – SteveD- Mar 2 '11 at 8:06

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

http://gomockingbird.com/mockingbird/

share|improve this answer
Agree agree agree. – tbaums Mar 2 '11 at 7:58

Pencil is free. http://www.evolus.vn/Pencil/Home.html 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.

share|improve this answer
1  
I was about to recommend the same, Pencil is a great tool. – Christian Mar 12 '12 at 14:53
Looks great. Thanks! – Ali Mar 12 '12 at 16:53

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.

http://team.silverlight.net/product-technology-deep-dive/sketchflow-rapid-prototyping-that-works/

share|improve this answer
1  
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. – SteveD- Mar 2 '11 at 8:15

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.

share|improve this answer

I vote for Balsamiq mockups also - not just for wireframing, but also for communicating with others - you can easily markup the mockups, and include notes regarding functionality directily in to the mock up and the export to pdf.

I put up a short review/demo of how to use this too at blog.conxt.com.

Cheers!

Eric

share|improve this answer

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.

share|improve this answer

It's worth mentioning that Balsamiq also has sweet integration with he atlassian products jira and confluence. If you are using either, even more reason to pick this tool.

share|improve this answer

Checkout DesignerVista 3.0 Software for both High-Fidelity and Low-Fidelity GUI Mockups of Desktop, Websites, Office Ribbon Style Applications.

http://www.designervista.com

share|improve this answer

For a desktop app Balsamiq is great. I also use http://creately.com - an online web-app with collaboration and also support for more than just mockups. We use it for collaboration across the team, from devs to designers, to work on UML, page flows, mockups, etc.

share|improve this answer

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

Pencil - mentioned above

Mockflow - http://www.mockflow.com/ Has a desktop version. Nice. Built an iPhone mockup with included iPhone template.

Simplediagrams - http://www.simplediagrams.com/home very cool chalk board look.

Cacoo - http://cacoo.com/ 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.

share|improve this answer

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.

Sample WireframeSketcher mockup

share|improve this answer
1  
Please add some disclosure that you are developer of this tool. – Ross Mar 17 '11 at 13:02

http://www.mockflow.com/ has a free version, you will need to register to use the free version and be able to download and use their desktop version, i recently have registered there and did exactly that, ive yet to use it so cant comment on whether i like it or not, it allows for Multi page PDF document. Theres also something about Generate Specification in MS Word format, but i haven't read that yet.

If you search both on here though and at http://stackoverflow.com/ there really are lots of tools for this, some allow for certain things that others dont, some more interactive than others.

Once ive got something on paper i will probably stick with mockflow as im no designer or developer and only need to be able to take my paper skectches eventually from that to online.

share|improve this answer

protected by Zuly Gonzalez Mar 16 '12 at 15:25

This question is protected to prevent "thanks!", "me too!", or spam answers by new users. To answer it, you must have earned at least 10 reputation on this site.

Not the answer you're looking for? Browse other questions tagged or ask your own question.