Ever wanted to quickly sketch GUI prototypes? But never found a quick and easy way to come up with GUI mockups?
This post outlines some of the popular tools out there for quick prototyping and a listing of the commercial and open source variants plus a detailed outline of the free and open source Pencil mockup application.
During the search for prototyping tools I stumbled upon the following commercial tools.
|Balsamiq||Provides a Cloud and a desktop application for mockups and prototyping. Excellent collection of templates. Consists of wireframe to sketch type UI elements.Consists of integration with Confluence, Jira and Google Drive for collaboration.||http://balsamiq.com/|
|Invision||A web based solution which allows to organize the prototypes according to projects. It allows prototyping for Web and mobile projects. The free subscription allows two projects to be created.||http://invisionapp.com/|
|UXPin||A web based solution which allows to organize the prototypes according to projects. It allows prototyping for Web and mobile projects. The free subscription allows two projects to be created.||http://uxpin.com/application-features.html|
The free alternative applications I came across are following
|Pencil||A popular opensource application for preparing mockups is pencil as I mentioned above. It comes as a desktop application. Pencil is flexible and contains many templates and UI elements to start off designing.||http://pencil.evolus.vn/|
|Concept.ly||This is a web prototyping tool more geared towards commenting and collaborating on a set of GUIs designed and uploaded from elsewhere. It supports adding hotspots to various parts of the GUI and allowing to add comments and refinement feedback. Currently its provided as a free service during the time of this blog.||http://www.concept.ly/features.html|
When Pencil was put in to use for our GUI designing, I seemed to find the tool quite convenient. Though there weren’t many stensil collections as much as Balsamiq, Pencil consisted of all of the crucial GUI components for Desktop, mobile and for Web right out of the box.
Furthermore it provided ways to link buttons to other pagers and allows to export all GUI pages onto a navigatable Web archive. This allows to quickly go through the UI and to identify screen flows easily. Additional Page notes can be attached to describe about the pages, and to hold the nitty gritty details of a page that might be required during actual UI implementation.
Pencil also provides ways to maintain your own collection of stencils and to import vector based stencil templates from illustration tools such as Inkscape.
For more details do visit the Pencil project website. For added stencils and templates follow the link here