Wireframe Resources

Get Wireframing: The All-In-One Guide

Get Wireframing...

Wireframing is a great tool to incorporate into your projects as it allows for rapid prototyping and helps to pinpoint any potential problems. I personally find it invaluable on projects to have a visual representation of content, hierarchy and layout. Overall it’s an excellent step to incorporate into your project before the design process begins for both you and your clients.

I am continually intrigued about how other firms and individuals incorporate the wireframing stage into their process. I know i’m not the only one, so this list aims to group together some of the best techniques, tools and resources to help you create effective wireframes.

Techniques

——————————

Tools

  • Omnigraffle – Create diagrams, process charts, quick page layouts and website mockups
  • Visio – Visualize, explore, and communicate complex information.
  • Protoshare – Collaborate online wireframe tool with real time communication and clickable wireframes.
  • Balsamiq – Easily and quickly created rough mockups with predefined elements
  • iPlotz – Quickly sketch wireframes of Web sites and demonstrate navigation between pages
  • Lovely Charts – Diagraming app that allows you to create site maps, flowcharts, wireframes and more
  • Jumpchart – Online collaborative wireframe
  • Axure – Rapidly create wireframes, prototypes and specifications for applications and web sites.
  • Gliffy – Create website wireframes and share web mockups with anyone.
  • MockupScreens – For the Non-Designers, allows you to sketch and organise screen mockups.
  • EasyPrototype – Works with your existing techniques such as paper sketches, Photoshop mockups etc.
  • Justinmind – Design a wireframe and test their web usability
  • OverSite – Provides a menu of widgets to create wireframes, or mockups with drag and drop features.
  • Fluid IA – Agile UI Prototyping
  • Pencil – Free sketching & GUI prototyping tool, can be installed as a Firefox add-on or as a standalone application.

——————————

Wireframe Examples

——————————

Wireframing Articles of Interest

——————————

Paper Prototyping

——————————

Useful Wireframing Resources

——————————

Kick Ass Books

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s