A website wireframe is a basic design draft done before any artwork and used in web design to show the structure of a website, custom user paths, most important user interface elements, their position and relationships between website pages. Wireframes lay out in black and white schematically most important elements in the interface such as header, footer, contact form, navigation.
Wireframing is a process that can significantly decrease the amount of time required in design and development by removing potential visual distractions and focusing the attention of project stakeholders on vital functionality and strategic marketing factors.
Here are a few key reasons you should always wireframe:
In this article we'll look at a few neat Wireframing & Prototyping solutions available out there.
Type: OSX App
OmniGraffle can help you make eye-popping graphic documents quickly by keeping lines connected to shapes even when they're moved, providing powerful styling tools, importing and exporting Microsoft Visio files, and magically organizing diagrams with just one click.
Type: Windows App
ConceptDraw PRO is a full-featured diagramming platform that lets you display, communicate, and dynamically present.
Pidoco is a real time collaborative online wireframing and GUI prototyping tool that used to enhance software projects as it saves time and lowers the options of rework. Picodo also helps to increase the profit margin of firms as it reduces the cost and augments usability.
Type: AIR App
Balsamiq Mockups is a wireframing tool that is designed specifically to mimic hand drawn designs whilst giving you the quick easy to update properties of programs like Microsoft Word.
Mockingbird is an online tool that makes it easy for you to create, link together, preview, and share mockups of your website or application.
Type: Firefox Addon
The Pencil Project's unique mission is to build a free and opensource tool for making diagrams and GUI prototyping that everyone can use.
Type: Online / Flash-Flex
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.
ProtoShare is a collaborative online tool to build website wireframes and dynamic, navigable website prototypes that team members can then review and comment on in real-time.
Hot Gloo is the online wireframe application currently in free beta. You can drag and drop elements, scale, link, name and rename them. You can also edit, comment & share any moment of the developing process with colleagues and clients.
Design, collaborate (in real-time) user interface mockups for your software and websites.
Gliffy free wireframe software makes it easy to create website wireframes and to share web mockups with anyone. You can export your wireframe for future use in other applications as well.
Cacoo is a user-friendly online drawing tool that allows you to create a variety of diagrams, such as sitemaps, wireframes and network charts.
Type: Online / Flash-Flex
A powerful and easy to use online diagramming tool that runs right in your web browser. With an intuitive UI and built in collaboration features, Creately makes working with teams easy.
Lovely Charts is a diagramming application that allows you to create professional looking diagrams of all kinds, such as flowcharts, sitemaps, business processes, organisation charts, wireframes and many more...
Type: Online / Silverlight
MockupBuilder is a new look to solve old problem with prototyping and sharing sketches with customers.
Create diagrams and drawings such as a flowchart, mind map, network diagram, UML diagram, wireframe, user interface design and other drawings online with free flowchart software.
Please feel free to post your suggestions, reviews or new tools as comments.