The 14 Best Tools for Design Mockups

Creating a mockup for your client's website is an excellent way to begin the web design process. A mockup is a basic layout of text and other graphical elements on a website at the initial stage of web design. Mockups are sometimes referred to as wireframes.

A mockup is very important in professional web design. It helps you to quickly show your client or other colleagues what the website will look like. The design can then be modified through collaboration and communication between the web designer and the client.

In order to simplify and enhance the process of creating and modifying mockups, several software tools have been designed. These tools help you to speed up the process of creating, sharing and editing you mockups. They will save you a lot of time and effort. They also have features that can be used to convert your mockup into a functional prototype. With this, you can proceed smoothly to your final design and implementation. In this article, we will be reviewing some of the best applications for creating web design mockups.

1. Mockingbird

Mocking Mockup

Mockingbird is a well known web-based mockup application. It has a drag and drop editor for creating web interfaces on your own or with other design team members. This application is excellent for rapid prototyping. Mockingbird makes it easy for you to link your pages together to produce interactive mockups. The mockups produced with Mockingbird can easily be shared with your clients online for quick review and approval.

To use Mockingbird, you need to sign up for a subscription plan. The personal account plan requires a $9 monthly subscription and permits you to work on just two projects at a time. The cheapest team plan requires a $20 monthly fee. Team plans that accommodate a large number of projects are also available at higher rates.

2. Balsamiq Mockups

Balsamiq

This is a cross-platform application that works on Windows, Mac and Linux. You can use this application as a stand alone desktop program or work online for effective interaction with team mates and your clients.

Balsamiq has a unique sketchy user interface elements. This makes it very convenient for non-techies to easily make their input into the designs. In addition, you have avenues to share your mockups and receive feedback. You can also couple the desktop application with a cIoud-based file sharing service for real time collaboration.

The desktop application will cost you $79 for a single-user license while you can subscribe to the web-based service at the rate of $12 per month.

3. HotGIoo

Hotgloo

HotGIoo is a Flash based website mockup application that is widely used by professional web designers. This application comprises of a huge library of design components. You can use a drag and drop interface with grids, presets, layers and other user interface elements to quickly and easily create your mockups for sharing and review. HotGIoo has one of the most precise and attractive user interfaces. It also provides tools to produce master templates that can be used throughout your project. These templates will save you a lot of time and effort.

HotGIoo has a free account with limited functionality. The subscription plans start at $14 per month and rise to $54 for unlimited access and functionality. You can start using this application with the 15-day free trial.

4. MockFIow

Mockflow

MockFIow has an extensive library of templates and presets that make it one of the simplest mockup and prototyping applications available today. It is a powerful application that enables you to produce and share complex interactive design mockups and wireframes.

Just like Balsamiq, it works on all major desktop operating systems. It has an offline desktop application as well as a web based online version. MockFIow has a unique free mobile application for presenting your mockups to your clients.

You can start using MockFIow immediately with the free plan that permits just two active projects and two collaborators. For unlimited access to all features, and other professional features, you need to pay $99 per year.

5. inPresso Screens

Inpresso

inPresso Screens is a mockup tool for creating professionally designed websites. A unique feature of this application is the skin creation feature that you can use to mimic themes in a typical desktop environment. You can enjoy the features of this application through a free desktop application. This application allows you to create mockups and prototypes that can be used and shared locally.

In addition, you can use the subscription based version of this application. In the subscription package, you will have access to a full online library of templates and user interface elements. With this web based interface, you can publish your mockup designs instantly and share them with your clients through a web player.

inPresso Screens offers a budget friendly solution at just $29 per year.

6. JustProto

JustProto

JustProto has a big library of mockup creation elements and templates with a user-friendly drag and drop interface. In addition to these, JustProto has some really unique features for collaboration and communication between your web design team and your clients.

First, you can share your designs by sending a URL to your clients and colleagues. Then you can engage in real time communication with your team members and clients and keep a transcript of the entire communication. With this unique feature, you can create your mockup in real time, share it and receive an instant response.

JustProto online subscription ranges from $19 to $99 depending on the features included and the number of nrnir-ants and nnllahnratnrs that will he wnrkinn nn them.

7. Invision

Invision

Invision is a web based application that helps you to design, test and share your website mockup designs with your colleagues and clients. It has a well polished user interface that allows you to produce a really attractive wireframe or prototype. It also has very good mobile support for presenting your designs while on the move. The interface for designing mockups is so detailed that it gives you extremely precise control over the layout of all your text and graphics.

This application is quite popular. The company that designed it boasts of thousands of completed projects by several high profiles clients and prominent brands.

Invision has a free subscription that is restricted to two projects while you can pay for unlimited projects at the rate of $75 per year.

8. Axure RP

Axure

Axure RP provides professional web designers with a powerful, full featured mockup creation interface. It has all the features you need to create flow diagrams and prototypes whether you are working alone or with a team. It works on Windows and Mac. Axure RP is used by professional web developers, business analysts and software developers in more than half of the Fortune 100 companies for effective application design.

Axure RP has a 30 day trial. Thereafter you can buy the one time full license (including 12 months free maintenance) at $589.

9. Justinmind Prototyper

Justinmind

Justinmind Prototyper is a powerful tool for designing mockups for your website and applications. However, it has the capacity to create fully functional and dynamic prototypes without coding. It works on both Windows and Mac. It is excellent for building web 2.0 sites and rich internet applications (RIA). Justinmind Prototyper is the ideal tool when you are planning to create sites with dynamic user interfaces and conditional navigation.

Justinmind Prototyper has a 15 trial version and a one time license that costs $495.

10. Pencil Project

Pencil Project

This is a unique application designed to offer a free and opensource tool to create mockup and prototypes for your website and other software applications. Some of the features of this noble initiative include: built in templates for creating your layouts and prototypes, automated inter-page links, multiple exports formats such as PNG, HTML, PDF, Word document and Openoffice document.

Pencil Project is a lightweight application that uses system resources efficiently. It is available for Linux, Mac and Windows. You can also use it as a Firefox plug-in.

11. ProtoShare

Protoshare

ProtoShare is a web based mockup and prototyping tool. It is very easy to use and has a very impressive modern user interface. This tool will greatly enhance project collaboration because of the effective visualization it provides for all individuals and teams working on the project. Everyone can see and make their comments on the project at the same time.

ProtoShare has a 30-day free trial. For full access, you can subscribe at the rate of $29 per user per month.

12. Pidoco

Pidoco

Pidoco is an online application that can be used to create and edit professional mockup designs and prototypes. It enhances your productivity through a very simple but effective testing module. Since it is web based, it gives you the opportunity to engage in more effective real time collaboration with your colleagues and clients. This helps to enhance speed and reduce the cost of your web design projects.

Pidoco has three subscription plans with the prices starting from about 7 euro per month.

13. Cacoo

Cacoo

Cacoo is a web based drawing application that helps you create several types of diagrams. You can use it to create wireframes, site maps, network charts and UML diagrams. No software installation is required. This powerful tool allows multiple users to simultaneously edit your mockup design with all the necessary editing tools and interface features.

A unique feature of Cacoo is that you can paste the URL into blogs and wikis. Immediately the original graphic is edited, the pasted diagram will automatically reflect the changes made. With this feature, you do not need to re-upload the diagram each time it is edited.

14. Lumzy

lumzy

Lumzy is a great tool for creating interactive mockup designs. After you have created your initial layout, you can indicate how the site will respond to user interactions by adding events within the controls of each element on the layout. Lumzy allows you to create message alerts or links to external pages when the client clicks on your mockup. But this functionality is added without you being required to do any coding. Lumzy also has collaboration and communication tools for group editing, chating and file versioning to monitor the changes made to the original design.

Written 2013-02-12 (Updated 2016-10-10)
david for reviews7

Written by David Walsh


David Walsh is the editor in chief here at Web Hosting Search. Having been in the industry for many years now he knows pretty much everything about everything. At least that's what he keeps telling everyone at the office. So, don't hesitate to drop him a line  if you've got a question - david(a)webhostingsearch.com.

Share your thoughts

Show all related articles..

Best Value Hosting 2016


Why wait? Get today's best deals now!