• RSS
  • del.icio.us
  • StumbleUpon
  • Digg
  • TwitThis
  • Mixx
  • Technorati
  • Facebook
  • NewsVine
  • Reddit
  • Google
  • LinkedIn
  • co.mments
  • YahooMyWeb
  • E-mail this story to a friend!
Join 38,000 of our readers, by following us via our RSS Feed, on Twitter, on Facebook or on Digg

Paper prototyping is a commonly used low cost usability method for testing and evaluating web designs and applications. This method lets developers conduct tests before a single line of code has been written, and allows you to identify and fix any potential issues early on in development.

Paper prototyping is a variation of usability testing where representative users perform realistic tasks by interacting with a paper version of the interface that is manipulated by a person ‘playing computer,’ who doesn’t explain how the interface is intended to work.” Quote from Carolyn Snyder.

In this post we have collected our top 10 videos that not only illustrate how effective paper prototyping can be, they also show you how to cost effectively conduct your own tests and some of the videos have been animated, which are just amazing to view.

If you would like to know more about Paper Prototyping, you can try these useful resources:
Paper Prototyping by Shawn Medero (A List Apart) »
What is Paper Prototyping? (paperprototyping.com) »
Paper Prototyping: Get User Data *Before* Coding (Jakob Nielsen's Alertbox) »
Paper Prototyping Methods (UsabilityNet) »
Five Paper Prototyping Tips (uie.com) »
Paper Prototyping on Wikipedia »
Paper Prototyping PDF from ibm.com »

This is our weekly section were we highlight the Top 10 resources from any given field from within the design community. These mini-articles give us an opportunity to share some really useful resources which would be either-wise ignored and difficult to justify with a full blown article.

Paper Prototype Animation

Hanmail Paper Prototype

This video is a paper-based prototype for Daum's web mail service, Hanmail.net made with Ajax.

Paper Prototype Website – Testing a Web Shop

The goal of this prototype is for the user to find and order a red (or purple)shirt with turtleneck for this prototype.

Usability Testing with a Paper Prototype

The video shows a Usability session with a paper prototype of a leave application.

Paper Mock-Up – Trip Plannin Concept

Lo-fi Web Prototyping

PhotoTron Paper Prototype

Paper Prototype Testing for User Centered Interface Design at Ai Minnesota.

Paper Prototype Demonstration

This is a demonstration of how to use a simple paper prototype technique to design the composition of a webpage.

iPhone App Paper Prototyping

Paper GMail Art

This video is not quite a paper prototype usability test, but it is pretty cool, and it has been built with paper after all. Its a video that Saatchi Moscow created and produced for Google to attract more Russian people on GMail. Enjoy.

You might also like…

10 Mind-Blowing Experimental CSS3 Techniques and Demos »
30 Pure CSS Alternatives to Javascript »
15 CSS3 Navigation and Menu Tutorials and Techniques »
20 CSS3 Tutorials and Techniques for Creating Buttons »
24 CSS (in some cases with jQuery) Navigation and Menu Tutorials »
22 CSS Button Styling Tutorials and Techniques »
CSS References, Tutorials, Cheat Sheets, Conversion Tables and Short Codes »
50 Useful Tools and Generators for Easy CSS Development »
50 Essential Web Typography Tutorials, Tips, Guides and Best Practices »
The Blueprint CSS Framework – Tutorials, How-to Guides and Tools »
20+ Resources and Tutorials for Creative Forms using CSS »


3 Comments Leave yours

  1. Rich Janitor
    25 Jun, 2010

    Paper prototyping is pretty interesting, but some of this looks like it would be more time consuming than just a regular mock up. I suppose it has it’s place though. Maybe I’ll give it a try sometime.

    Reply

  2. S.M.Karthick
    25 Jun, 2010

    But I’m struggling to find the perfect color combination for a website?? How to find perfect combination ?

    Eg: color combination between menu,background,content area etc.,

    Reply

  3. Heam
    28 Jun, 2010

    Love the last video :D

    Reply