Paper Prototyping

Mock-up the UI on paper. Use markers, colors, post it, index cards, etc..

Work quickly and reuse components where possible.


  • Widgets
    • Paper
    • Cardboard
    • Transparencies
    • stick-its
  • Connectors
    • Tape
    • Glue
    • Rubber Cement
  • Drawing
    • Markers
    • Pens
    • Color is good


Get users and stakeholders involved. This empowers and encourages people to play an active role in design process.


People will give feedback liberally due to the ad-hoc nature of paper prototypes.

Digital Mock-ups

You can make digital mock-ups with several tools,  including:

  • Inkscape
  • Pencil
  • GNU Image Manipulation Progrem

Digital mock-ups are generally:

  • High fidelity
  • Time consuming
  • Visually appealing

Users may give less feedback as it seems that more effort has been spent creating a digital mock-up.


Notes from the Human Computer Interaction class at Stanford University.

Focus on task that project is designed to support. What will the UI help a person accomplish?

Storyboarding is about communicating ideas.

Star People

Star people are quick and easy to draw. Their name comes from their resemblance to stars:

Star People

Star People

Star people can point, gesture, talk, and be drawn performing other activities.


People, environment, task


  • Steps to complete task
  • What leads people to use the application?
  • What task is illustrated?


What are the accomplishments? How is satisfaction measured?


Storyboarding is holistic. It portrays a whole sequence of events to meet a goal.

Time Bound

Emnforce a time limit when storyboarding. E.g. 20 minutes is often sufficient.