Tldr

Just prototype from easy to hard

prototyping

• Approximate (quick) version of the design so that you can quickly get feedback.

• Design Hypothesis

• Feedback iteration

  1. Build prototypes
  2. Evaluation
  3. Learn for the next design

• Explore multiple prototypes rather than arguing with one specific version

• From low fidelity → High fidelity

• Some goals often conflict with each other.

  • Prioritize them using feedback (from users)

• Interactivity

  1. Fixed prototype:Watch only
  2. Partially interactive: Fixed scenario prototype
  3. Fully interactive: Open prototype

Fidelity

1. Low: Rough design, Feedback is broader
2. High: Close to final design, feedbacks more detailed

Prototyping technique order by fidelity

1. Lowest: Storyboards
2. Paper Prototype
3. Wireframing
4. Highest: Digital mock-ups

Storyboard

• is this the right idea?
• Does it solve a problem?
• Does it meet a user’s need?

Paper Prototype

• Rough idea of UI

• Reusable widgets

• High-level question

  • Does our design address the problem you want to solve?

• not low-level question

  • Is a button size slightly bigger?

Wireframing

• more concrete digital UI

Digital mock-ups

• high-level feedback

Wizard of Oz prototyping

• users interact with a system that is fully functional but actually a human is performing the system’s functions.

Video prototyping

• can be any fidelity
• effective in showing the context of usage

Footnotes