The act of converting content from its original format into a format capable of being displayed on the web
Manage Multiple WordPress Sites

23 Best User Interface Design/Website Wireframing Tools with Features and Comparison

Mock ups and wire frames are extremely important when you are working on a project. Having a mock up or wire frame handy not only accelerates the building and design process of your projects, but it also ensures that the project progresses in a systematic way.

There are many tools available for you to create high quality mockups and wire frames. But which one are the best? Which one are the worst? Which ones are to be chosen and which ones are to be left?

To know all that, read on.

1. iPlotz

iPlotz thumb 23 Best User Interface Design/Website Wireframing Tools with Features and Comparison

With iPlotz you can create clickable, navigable wireframes to create the experience of a real website or software application. You can also invite others to comment on the designs, and once ready, you can then manage the tasks for developers and designers to build the project.

iPlotz1 thumb 23 Best User Interface Design/Website Wireframing Tools with Features and Comparison

Verdict: Nice Interface and easy to use. The slick design also helps the user to stay focused along with the compelling dark background that the application has.
Priced: Free version available along with Single user subscription of $99/Year. Desktop version for $75
Rating: Excellent

2. MockingBird (beta)

mockingbird thumb 23 Best User Interface Design/Website Wireframing Tools with Features and Comparison

MockingBird is another easy to use wire framing software that is still in beta phase. However, in spite of being in Beta phase, the service is good and it’s easy to use with all the important features embedded inside.

mockingbird1 thumb 23 Best User Interface Design/Website Wireframing Tools with Features and Comparison

Verdict: On one hand, this is another good tool for making mockups and wire frames, still we can’t make it to rank higher in our tests. Maybe because still the framework is somewhat limited interface due to beta phase
Price: Free
Rating: Good

3. Balsamiq

balsamiq thumb 23 Best User Interface Design/Website Wireframing Tools with Features and Comparison

Blasmiq is a quick mockup and wire framing tool with a nice feature of tem collaboration which sets it apart from other mocking up tools. The user interface is nicely designed so that one doesn’t have to keep looking for a function or button

balsamiq1 thumb 23 Best User Interface Design/Website Wireframing Tools with Features and Comparison

Verdict: Great user interface with nicely laid buttons which helps the users to get most out of it. The most used functions are nicely laid on the top bar which are always visible to the user.
Price: $79 for a single-user, multi-computer license
Rating: Excellent

4. Napkee

napkee thumb 23 Best User Interface Design/Website Wireframing Tools with Features and Comparison

Napkee lets you export Balsamiq Mockups to HTML/CSS/JS and Adobe Flex 3 at a click of a button. However, it runs on Adobe AIR and you need to get it installed first.

Verdict: Although Napkee is an overall good wire framing and mock up tool still, Adobe AIR is required to make it get going; which may be a negative point.
Price: Starting from $49
Rating: Good

5. Mockflow

mockflow thumb 23 Best User Interface Design/Website Wireframing Tools with Features and Comparison

MockFlow is hybrid, so you can design seamlessly from anywhere & even with No net-connection. With MockFlow, you can get your visual concept ready in minutes. Exporting table less CSS layouts using Layout Builder is also supported.

mockflow1 thumb 23 Best User Interface Design/Website Wireframing Tools with Features and Comparison

Verdict: Simplicity is the thing that makes MockFlow stand out from others in the list. Instead of just giving a whole array of functions, users are greeted with a simple and easy to use interface
Price: Free
Rating: Good

5. MockLinkr

mocklinkr thumb 23 Best User Interface Design/Website Wireframing Tools with Features and Comparison

Mocklinkr introduces the concept of hosted mockups. With their technology, you also have the freedom of hosting the mockups on their servers and showing and collaborating with your clients in real time.

mocklinkr1 thumb 23 Best User Interface Design/Website Wireframing Tools with Features and Comparison

Verdict: The concept of hosted mock ups is great. And it enables users to collaborate with their clients in real time, making it one of the most interesting tools for mockups and wire framing.
Price: Free for up to 10 images. Then $19 per month for unlimited images
Rating: Fair

6. Freui

foreui thumb 23 Best User Interface Design/Website Wireframing Tools with Features and Comparison

ForeUI is a handy UI prototyping tool. It can rapidly create static or interactive, sinkable UI prototypes of your website or software.

Verdict: The user interface is not so great. The look and feel also doesn’t give you a finished software.
Price: $99 for single user license
Rating: Poor

7. Justinmind

justinmind thumb 23 Best User Interface Design/Website Wireframing Tools with Features and Comparison

Justinmind Prototyper is available for Windows and Mac OS platforms.
Justinmind Prototyper: Design advanced wireframes and run realistic simulations to capture and communicate functional specifications. Visualize user requirements without code
Justinmind Server: Generate a fully functional web wireframe and share it with your stakeholders. Your customers and key users will be able to test and annotate the software wireframe with their web browsers

Verdict: The tools and buttons offered looks amazing
Price: Per-Seat license of $495
Rating: Fair

8. Axure

axure thumb 23 Best User Interface Design/Website Wireframing Tools with Features and Comparison

Axure is nicely designed wireframe software that automates specifications that will allow avoiding tedious documentation.

Verdict: This one is definitely recommended. With a price tag of $589, it may seem to burn a hole in your pocket, but all good things come for a price.
Price: $589 – Perpetual Single User License
Rating: Good

9. DesignerVista

designervista thumb 23 Best User Interface Design/Website Wireframing Tools with Features and Comparison

This is a desktop based mockup tool that may be also classified more in the category of sot wares. However, the design and user interface is just bad

Verdict: We didn’t like the design, interface and functionality at all. The software is neither nicely made, nor it has an intuitive user interface that we were expecting.
Price: License price of $79.99
Rating: Poor

10. Simulify

simulify thumb 23 Best User Interface Design/Website Wireframing Tools with Features and Comparison

Simulify is an elegantly designed mockup tools with a nice user interface including all the tools necessary to design a complete mockup.

simulify1 thumb 23 Best User Interface Design/Website Wireframing Tools with Features and Comparison

Verdict: Nicely designed and having all the functionality required. As the name suggests, it doesn’t over load the users with useless designs and functionality tweaks.
Price: Free online editor and $89 for Desktop Edition.

Rating: Excellent

11. Justproto

justproto thumb 23 Best User Interface Design/Website Wireframing Tools with Features and Comparison

JustProto claims to be the first tool to create the prototypes of network and desktop applications. However, it has all the functionalities which are expected from a mockup tool.

Verdict: Should be free, but it comes for a price.
Price: Standard: $19 per month, plus: $49 per month, Unlimited: $99 per month
Rating: Good

12. FairBuilder

flairbuilder thumb 23 Best User Interface Design/Website Wireframing Tools with Features and Comparison

Fairbuilder is a multipurpose Desktop and Online client. This works excellent when you need a tool to quickly prototype something for a project. It is also less of a load on your pocket as you don’t have to pay a lot upfront, but only a smaller amount each month.

flairbuilder1 thumb 23 Best User Interface Design/Website Wireframing Tools with Features and Comparison

Verdict: Although comes for a price, but can be a very good investment.
Price: $24/month and $99/year
Rating: Fair

13. Dub

dub thumb 23 Best User Interface Design/Website Wireframing Tools with Features and Comparison

With all the amazing free mockup software around, this one is very tough to use at. The user interface is very confusing and there are not at all even the basic functionalities.

Verdict: Needs a lot of improvement. The functionality needs to be improved; the user interface needs to be improved. This one really needs to work real hard to be there.
Price: Free
Rating: Poor

14. ConceptDraw

conceptdraw thumb 23 Best User Interface Design/Website Wireframing Tools with Features and Comparison

Verdict: N/A
Price: ConceptDraw Office ($499), ConceptDraw Mindmap ($299),ConceptDraw PRO ($249), ConceptDraw Project ($199)
Rating: N/A

15. Inpreso Screens

inpreso thumb 23 Best User Interface Design/Website Wireframing Tools with Features and Comparison

As the name suggests, Inpresso is pretty impressive. It has an impressive collaborative screen to create high quality mockups and wireframes.

inpreso1 thumb 23 Best User Interface Design/Website Wireframing Tools with Features and Comparison

Verdict: The whole layout is impressive. With nicely laid buttons and functions, it has a nice sidebar that acts as a secondary notepad for you where you can store temporary notes for further references.
Price: Paid version is for $79 for one year.
Rating: Excellent

16. HotGloo

hotgloo thumb 23 Best User Interface Design/Website Wireframing Tools with Features and Comparison

HotGloo is another interesting mock up and wireframing tool out there. With an extensive set of usable functions, it indeed is worth a look
Verdict: HotGloo is hot and simple. It provides with a large array of options and functionalities,  but comes with a price tag and is not free. However, the whole layout is impressive.
Price: Paid version is for $79 for one year.
Rating: Excellent

17. Pencil Firefox Add on

firefox thumb 23 Best User Interface Design/Website Wireframing Tools with Features and Comparison

Pencil is a Firefox add-on to do GUI prototyping and simple sketching. Since it’s a browser add on, you don’t have to get anything installed.

firefox1 thumb 23 Best User Interface Design/Website Wireframing Tools with Features and Comparison

Verdict: Got firefox? Then there is no need to invest in any stand alone mockup and wire framing tool. With this free plugin, all the features of a high end mocking and wire framing tool can be incorporated right inside your browser!
Price: Free.
Rating: Excellent

18. Lovely Charts

LovelyCharts 23 Best User Interface Design/Website Wireframing Tools with Features and Comparison

Lovely Charts is an online diagramming application, that allows you to create flowcharts, sitemaps, organization charts and wireframes.

One of the key features is the application’s ability to make assumptions based on the type of diagram you’re drawing, and thus streamline the drawing process. The History management feature is extremely useful, keeping 20 states of your diagram in memory should you wish to go back to an earlier version or undo any changes.

Verdict: This is a powerful yet simple tool set provided, with an extensive library of crafted symbols to suit most requirements.
Price: Free.
Rating: Excellent

19. Cacoo

Cacoo 23 Best User Interface Design/Website Wireframing Tools with Features and Comparison

Cacoo is a user-friendly online drawing tool that allows you to create a variety of diagrams, such as sitemaps, wireframes and network charts.

The drag and drop UI means creating diagrams is relatively simple; there are also a number of stencils to utilize which could make the process even more efficient. Unlimited Undo is a neat feature with the history of all modifications saved, meaning you can undo right back to the start.

Verdict: A very powerful browser based mockup tool where more than one users can also work on and complete the same diagram simultaneously with the application supporting real-time collaboration
Price: Free.
Rating: Good

20. Lumzy

Lumzy 23 Best User Interface Design/Website Wireframing Tools with Features and Comparison

Real-time collaboration is one of the key features, with tools for team editing, a chat engine for deliberating over designs and file versioning. Lumzy is also the only mockup tool with a real image editor built-in — simply grab any picture from your drive and edit it, apply hue, saturation, adjust contrast, and so on, and then add it to your project.

Verdict: Lumzy is a mockup and prototype creation tool for websites and applications. You can add events to controls, place controls inside other containers and emulate your project with easy page navigation triggered by user actions.

Price: Free.
Rating: Fair

21. Denim

Denim 23 Best User Interface Design/Website Wireframing Tools with Features and Comparison

Denim is a free multi-platform desktop app that supports sketching and allows design at various refinement levels. It’s an efficient tool for early stage brainstorming and wireframing. Two main features within Denim are Components, which enable you to create widgets that can be reused and Conditionals, which allow you to create transitions between pages depending on the end-users’ actions, resulting in a more interactive experience.

Verdict: It’s a simple yet effective tool and allows for easy annotation using editing gestures.
Price: Free
Rating: Fair

22. Website Wireframe

WebsiteWireframe thumb 23 Best User Interface Design/Website Wireframing Tools with Features and Comparison

Website Wireframe is a very simple web-based tool for building wireframes in a matter of minutes. A link to view the wireframe can be sent through email, instant message, or mobile phone, and then the wireframe can be easily updated based on feedback, discussion, ideas and suggestions.

Verdict: It may not be particularly sophisticated, however it’s simplicity and efficiency is perfect for those who want an alternative to tools with a higher learning curve.
Price: Free
Rating: Good

23. ProtoShare

proshare 23 Best User Interface Design/Website Wireframing Tools with Features and Comparison

ProtoShare allows website prototyping by enabling developers to create a true interactive experience with a drag-and-drop WYSIWYG interface. Team members and clients can then collaborate on the interactive prototype. Once the process of prototyping and collaboration is finished, the development team will have a strong visual specification to follow, reducing rework, delays, and cost in the programming stages.

Verdict: With powerful companies like 3G and SONY using ProtoShare as a tool of their preference, we found this tool totally justifies what it says.
Price: Standard Version for $29 per user per month
Rating: Good

Comparison Table

Name Price Score
iPlotz Free version online, version for $75 Excellent
Mocking Bird Free Good
Balsamiq $79 for a single-user, multi user computer license Excellent
Napkee Starting from $49 Good
MockFlow Free Good
MockLinkr Free for up to 10 images. Then $19 per month for unlimited images Fair
Freui $99 for single user license Poor
Justinmind Per-Seat license of $495 Fair
Axure $589 – Perpetual Single User License Good
Designer Vista License price of $79.99 Poor
Simulify Free online editor and $89 for Desktop Edition Excellent
Justproto Standard: $19 per month, plus: $49 per month, Unlimited: $99 per month Excellent
FairBuilder $24/month and $99/year Fair
Concept Draw ConceptDraw Office ($499), ConceptDraw Mindmap ($299),ConceptDraw PRO ($249), ConceptDraw Project ($199) N/A
Impreso Paid version is for $79 for one year. Excellent
HotGloo Paid version is for $79 for one year. Excellent
Pencil Firefox Add on Free Excellent
Lovely Charts Free Excellent
Cacoo Free Good
Lumzy Free Fair
Denim Free Fair
Website Wireframe Free Good
ProtoShare Standard Version for $29 per user per month Good

Conclusion

We tested quite a good number of mocking up and wire framing tools for you. Some of them were great, some quite well, while some were pathetic. Based upon our test results, we would recommend you the following tools:

The free ones:

  • Simulify
  • Pencil Firefox Addon
  • Mocking Bird

The paid ones:

  • iPlotz
  • Impresso
  • HotGloo

    Manage WordPress Blogs

    Comments:

    1. Jacki says:

      Fantastic post – thank you so much for this. I am really just starting to get serious about designing websites (having messed about casually with it for years) and this will help enormously. I’ve just subscribed to your newsletter as I’m finding so much great info on your site :)

    2. This is a fantastic post about social media. I’m a student just trying to learn more about this business and I really enjoyed reading your post. Keep up the great job!

    3. iEDGE says:

      Some very nice design tools there, the comparison is a lot more useful than individual reviews – thanks!

    4. Henry says:

      its usually so difficult to get good info. love the post!

    5. chathamadmin says:

      Great job! One quick question, why was Mocking Bird which got a score of Good recommended over Lovely Charts which received a score of Excellent?

    6. John says:

      Worth mentioning that Balsamiq can be used as a free web-based service as well as the paid download version.

      A great review of the options – thanks!

    7. redben says:

      Very cool apps but i have to admit that none are near my expectations. I have been using flex builder to build flex apps. Prototyping in that IDE is just unbeatable. If only someone could get inspired from flex builder to create a lighter version just for wireframing…

    8. Lightweight online tool for creating and sharing mockups http://framebox.org/A

    9. This is a great compilation! I hope you will be able to keep it up to date.

    10. Vanina says:

      Yes it is a great list, maybe you could be interested to participate to this collaborative comparison of mockup and wireframing design tools (you can rate or vote for the best ones):

      http://socialcompare.com/en/comparison/mockup-and-wireframing-design-tools-cq7awx5

      This new platform is like a “wikipedia of comparisons”, you can compare everything and embed the table on your blog.