Intro to Rapid Prototyping: Learn the basics

Evan Kimbrell, Director at Sprintkick

Play Speed
  • 0.5x
  • 1x (Normal)
  • 1.25x
  • 1.5x
  • 2x
11 Lessons (1h 9m)
    • 1. Welcome to the class!

      1:39
    • 2. First thing to do

      1:05
    • 3. Terminology A-Z

      11:29
    • 4. Wireframing vs prototyping

      5:46
    • 5. High fidelity and low fidelity

      6:13
    • 6. Why do we wireframe?

      9:21
    • 7. Picking a tool

      7:13
    • 8. K.I.S.S.

      4:37
    • 9. Following the construction path

      17:42
    • 10. The class project

      2:14
    • 11. Keep the learning going

      1:33

Project Description

Assignment: Go and find the ugliest version of your favorite website

Prototypes and wireframes are all around us! You just need to know how to look for them.

In this class, we covered the basics of wireframing and prototyping. Now that you feel a little more confident talking and spotting prototypes, let's put that skill to the test.

This assignment is a scavenger hunt. I want you to go online and try to find A) a wireframe or B) a prototype of one of your favorite websites or mobile applications.

Every big company you use (yes every one of them) started with one of these techniques. Check this out: 

9f62f106

Can you guess what that is?

That was the FIRST wireframe of Twitter,  before it went on to becoming a multi-billion dollar company.

Here are some more prototype examples:

995dd991

That's the first version of Uber.com

88435ef6

Behold the first prototype of Airbnb (once called Airbed&Breakfast).

Now go and find the humble origins of any of your favorite brands, sites, or apps.

Deliverable:

When you find a wireframe or prototype, post it in the Class Project section. Upload the wireframe as your cover photo or as an image attachment. If we can't tell what it is, please leave a description.

Resources:

Student Projects