Pwireframing: Paper Wireframing | mStoner, Inc.

by Doug Gapinski •  28 May 2009

The Bethel Strategy Background
Every web redesign project we get comes with an essential strategy document. This strategy document is a tailored roadmap laying out specifics for a successful relaunch including wireframes to help visualize how new web templates will take shape, a review of competitor sites, key messages to be surfaced in the new creative stylings of a site, a streamlined information architecture, rollout schedules, and more.

Two clients of ours from Bethel UniversityMark Erickson (Director of Web Communications) and Michael Vedders (Director of Web Technology), came to mStoner’s Chicago office for two days earlier in the month to work directly with us on the Bethel strategy document. The idea was that two days of intense collaboration and discussion would produce a more cohesive report, better suited to Bethel’s needs.

It Doesn’t Get Any More Old School than Paper and Scissors
Part of this two day process was an exercise that I like to call paper wireframing, or Pwireframing. It’s an idea that came to me based on a link that my colleague Laurel Hechanova sent me: The Design Police Visual Enforcement Kit. If you take a look at this page, it’s essentially a print-it-yourself sticker kit, laying out a bunch of funny “laws” you can stick to a piece of communication.

The idea behind Pwireframing (again, wireframing with paper) was to make the regular wireframing process more modular and collaborative. Instead of having a designer simply follow the instructions of a strategist, we started by discussing all possible contents of pages as a group, including syndicated feeds Bethel is currently maintaining. We also made some decisions about feeds or content Bethel would be likely to bring online in the near future. After this, I drew and printed modular drawings of all of the types of content we talked about, and cut them into sets.

[Article]

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