How to Create Wireframe of Website


Volkside design company made a gift for web developers, releasing free bookmarklet tool – Wirify. With Wirify you can create wireframe of any website with just one click.

This is very useful tool to quickly assess some aspects of website design: a modular system of layout, visual hierarchy, white space, symmetry, golden section, the rule of thirds, etc.

You can just simply drag this bookmarklet to your bookmarks and use it on any page. It works with all modern browsers.

How to Create Wireframe of Website

Rendering on jQuery is not always perfect, sometimes there are slight distortions. The export of website wireframe is not supported in Wirify, but you can use some plugins to save the web page as an image: Screengrab for Firefox and Screen Capture for Chrome.

If you, as a web designer, have to deal with wireframes, then it makes sense to look on other tools. For example, the developers of jMockups web tool promise to add a feature for importing wireframes of any web page in a couple of mouse clicks. That means you can just go and borrow someone’s layout for your own web design without breaking any copyrights.

By the way, developers of Wirify also wants to add this kind of feature, but it will export website wireframes directly to OmniGraffle (Mac OS X and iPad analog of MS Visio).

About Alex Joy

I'm founder and editor of Webdesignzo, architect designer, web designer, graphic designer and SEO optimizer.

One Response to How to Create Wireframe of Website

  1. Nice post, thank you for sharing. You have really imparted useful knowledge on wireframe. This is a really a big help for all of us.

Leave a Reply

Your email address will not be published. Required fields are marked *