Wire Framing the Web in the Physical Realm

Using wooden blocks and print photographies


Recently, I read the Techcrunch post on Qleek Brings Your Music Back In To The Physical Realm. I was wondering how could I apply a similar design and concept with something I am familiar with. There are many creative professionals that still find web development difficult, which deters them from extending storytelling beyond their own medium.


As an experimental concept, a user would be able to create web <DIV> frames utilizing wooden blocks or physical objects in combination with using print photographs. Non-technical creatives would:

  1. rearrange blocks accordingly
  2. take a snapshot
  3. run the app
  4. create the wireframe without reliant on a web developer.

The arranged blocks would essentially form the shape of the <DIV>. The user could also place photographs on top of the block formations:

You would adjust your phone camera to take a snapshot top-view of the block arrangement, load this image into our web app, and it would generate the HTML <DIV> similar to how Photoshop can cut the image accordingly to generate <DIV>s.

This is primarily useful for creating the home page view seen on the NYTimes or CNN.