«
»

State Based HTML Wireframes with Polypage

January 17th, 2009


Ben pointed me to an interesting set of HTML wireframes which use Polypage. Polypage expands HTML wireframes or mock-ups and allows for the creation of page states. Furthermore, the various states are independent of each other and can be toggled on a small top menu to affect the page view. Say for example you want to show your wireframes to your client in the “logged out” and “first time visit” states. Polypage allows you to click through all your wireframes to demonstrate such a case. Later on when you decide to demonstrate the “logged in” state, all you do is toggle it in the top menu and continue your presentation.

The technique was initially developed at Clearleft, and Richard Rutter explains how to use it better. Here are two more sets of wireframes using this technique which contain more page states to explore.

As a side note, here is also an interesting debate as to whether these things are wireframes or prototypes.

Credits: Ben Sauer

Tags: , , , , ,
Posted in Samples | 5 Comments »

5 Responses to “State Based HTML Wireframes with Polypage”

  1. Matt Lindop Says:
    January 19th, 2009 at 5:39 pm

    Looks interesting – but many UX designers may not have code skills that advanced. I currently use Axure – it's not without its drawbacks, but has still brought our interactive prototypes on miles.

  2. Ben Sauer Says:
    January 19th, 2009 at 6:23 pm

    Agreed its not for everyone, but if you have a even a basic understanding of XHTML / CSS, then something like this is well within reach. You don't need to be an expert at anything I've used: its all pretty simple.

  3. Andy Budd Says:
    January 21st, 2009 at 11:49 pm

    You don't have to be particularly advanced to wireframe in html/css as it doesn't need to be semantic, cross browser or production quality. Hell, you could even use pre-built libraries like the Blueprint framework. And if you can understand css you can use polypage.

    I think if you're working on the web you need to have a basic knowledge of what makes it tick. So i'd say it makes more sense to learn html/css than another software tool. It's more useful at least.

  4. Walter Aprile Says:
    January 30th, 2009 at 10:34 am

    this is really useful! A bit of a mindfuck, but useful.
    Quite outside of Polypage, how are things?