Pen and paper wireframing without the hassle

I love wireframing by hand especially when working collaboratively with the client. When you work on a computer only one person can wireframe at a time, but with pen and paper we can all wireframe together.

The problem is that pen and paper wireframing takes a lot of redrawing. You find yourself constantly drawing and redrawing screen elements, which proves time consuming. This is not a problem on a computer where you can copy and paste.

Apparently I am not alone in my desire to combine the best of computer based wireframing and good old pen and paper. Nat from Lanyrd feels the same and has solved the problem in a simple, yet elegant way.

  • Interesting approach. These could be useful: Printable post-it notes:

    I remember ordering a book from a few years ago and they gave a free sheet of magnetic UI elements that you could stick to a whiteboard. Things like buttons, form elements, image placeholders etc. Thought they were a good idea but never did use them

    • Joshua Lewis

      Get some magnetic sheeting (or even magnetic tape) and you can make your own custom UI elements. With the right type of backing, maybe vinyl, you could even change labels as needed.

  • The secret to wire framing is finding something that works for you and those you work with. There is no “perfect” method, but I’ve found large whiteboards (and capturing them digitally) works for brainstorming, moving to fireworks or OMNIGRAFFLE help create a more maintainable file for team and client review.