Prototype:
Make Something that Represents Your Ideas
Prototype
What is a "prototype"?
In design thinking, a prototype is a model of an idea. It is something that represents your ideas, often for testing, review, and further ideation. A prototype is not the "thing" itself, but a representation of the thing which people can talk about, think about, and interact with.
High fidelity, low fidelity
Prototypes have "fidelity." Fidelity means something like "exactness" or "clarity." You can think of it as how highly refined or unrefined a prototype is.
Some industrial design prototypes:
Clockwise from top left:
1) The idea. Using something that exists to set it up.
2) A sketch. A low fidelity prototype to explore the unique scope.
3) A 3-d model. A medium fidelity prototype.
4) A working car. A high fidelity prototype that acutally works, but it not a final production model.
Some web design prototypes:
What are they for?
It seems reasonable to think that a prototype is a "first attempt" as a executing your solution. And maybe in some ways it is.
But to view a prototype as a "first attempt" at executing your solution is to assume that your solution is "ready." Remember that the design thinking steps are a dance. Try to be sceptical when you think "yes, this is the idea I need to take to the finish line."
Critical to prototyping is creating something that the user can interact with. If the user cannot interact with the prototype, it cannot be used to define, ideate, test, or build empathy. If the user cannot interact with it, then you cannot test your assumptions about the users' behaviours.
strong prototypes are something the user can somehow interact with.
In this example the designers were trying to create 3-d printed maps for public structures like art museums. Through user testing of prototypes, the designers got ideas about what perceptual cues were missing - like color, texture, and smell. But they also had new ideas about memory connections.
The foyer of the AGO, for which a 3D printed model was created with the participation of visually impaired users
00:12 But it doesn't provide anything about the texture. Which is why you have this box. The texture in this box fills it in.
00:16 Like this 3d model is like a colouring book that's not coloured in. But the items in this box colours it in.
00:22 The other thing we found from the audience interviews what that…and this is a very small sample…but for some people the smells conjured a lot of memories, childhood memories, it seemed that that helped people understand the model a little bit more.
00:55 So with the wood, maybe a piece of fir doesn't feel all that different from a piece of pine. But with the smell, its like another perceptual cue that can be helpful.
1:02 Another thing is, when you think about what Melissa was saying about someone moving their hand over the map, and they are talking as well, think about how that corresponds to real maps are3dmap
Dr. Peter Coppin of OCADU's Inclusive Design program talks about how user interaction with a 3d-tactile map of the AGO foyer created ideas and a more flexible design. See the full video here.
Uh, so what did learn?
Notice how the designers thought they understood the user's needs - navigation, orientation, location, and shape. Even the users thought that this would be interesting and satisfying. But once the prototype was made, people starting asking questions that nobody anticipated, and the designers identified new needs:
- texture
- quaility
- colour
- smell
- memory
- sense of space
- mood
These new needs, which happen to be both tangible and in-tangible, would have are hard to predict for designers and users. Only through interacting with the prototype did they manifest.
Back to Cats
Prototyping with a Cat
Recall my theories about cats, sleeping, windows, and hunting/food. The situation was:
- Cleo the cat cries and wakes everyone up at 5:30 in the morning to be fed
- But Jasmine needs to sleep until 7:00 to keep her schedule
- Karl tries to keep Cleo from crying by leaving food out, but Cleo eats all the food and gets sick.
A "Wicked Problem"
This is what they call a "wicked problem," because any intervention to solve one problem (like leaving food out) just causes another (sick cat).
After defining the problem last week as:
How might we leverage a cat's need to hunt into a system that empowers cats to access food whenever they want in a healthy way.
...we needed to start coming up with ideas that we could turn into testable prototypes.
We tried some ideation exercises like the DnD style roleplay. Jasmine and Karl pretended to buy an automatic feeder that feeds at a specific time of day. They set the timer for 5:30 in the morning and also envisioned a microchip necklace so the feeder only opens when the cat is nearby.
Designer:
You set the timer for 5:30. The first night it seems to work fine. The next night, Cleo cries at 5:00 instead of 5:30.
Karl:
Alright, then instead of a timer, we will set the food to open whenever the cat's microchip collar is near the feeder.
Jasmine:
That's no different than if the cat had full access to the bowl. And anyhow I am not putting wet food out at room temperature all night and I'm not dealing with cooler packs.
Designer:
Do you see anything else in the room that could control the feeder?
Karl:
Maybe my phone?
Designer:
How do you want to control the feeder with the phone?
Karl:
Maybe when the cat wakes us up, instead of getting out of bed, I can open the food doors remotely via an app?
Jasmine:
That is good, but we still need to wake up.
Karl:
Well, the phone can hear the cat, or maybe skip the phone and the food bowl hears the cat and opens automatically.
Jasmine:
The cat still needs to make sounds.
Karl:
Right...so we need to do it without sounds. But sounds are how we know when to feed Cleo.
New realization, new paradigm:
As we ruled out option after option, it occurred to me here that we were stuck in a paradigm. Our paradigm was that we thought we had to anticipate the meow, or react to the meow. The first was not possible, and the second was not acceptable. The window of time the cat can ask to be fed is just to unpredictable. We need something that is "always on" but also could not overfeed.
Then I remembered that we have another paradigm and another perpsective on cats. The hunter paradigm. The very silent and very patient hunters. What if empowered the cat to hunt for food instead of asking for it?
Feedback Loops
My hope is that the cat feeding process will become a self-regulating feedback loop. Desginers, including marketers, use feedback loops all the time.
Sean Parker and Chamath Palihapitiya (founders and CEO of Facebook) on the Dopamine loops.
So if people have dopamine driven feedback loops, what kind of feedback loops do cats have? They have a hunting feedback loop. They see dusk or dawn, they get hungry, the instinct hits, they look for food, they rest until it is time to repeat. What I need is a system that fits into that natural cycle.
A centrifugal governor demonstrates the design concept of "self-regulation."
1) The vertical shaft is connected to the engine and spins with it.
2) Faster spinning causes the heavy balls to fly out and up
3) Linkages are raised which in turn lifts the freely-sliding platform
4) Linkages close a valve that reduces fuel, which reduces spinning.
When the engine slows down the balls spin slower and fall, lowering the platform, and increasing the fuel, so it speeds back up.
Here is my goal for self-regulation, visualized:
To find out, we needed a prototype.
The Window Cat Feeder Prototype.
Recall that Cleo likes being in the window. Cat's "hunt" food through the window. They will spend hours in silence tracking birds and bugs, happily appeasing their predatory instincts, without even a chance of catching food. But what if there was a chance of they could? What if, after a bit of stalking, they could catch and eat whatever was behind that window?
Will cats interact with a window as a feeder?
Yes!
Catch that bird!
Catch it!
After 15 minutes of "hunting" I offered the kitty some kibble. The kitty seemed to connect the "hunting" activity with eating, and ate the food.
Testing to see if the cat would eat after playing with the "window"
Then I observed that the cat sat and watched the birds from a distance for another 30 minutes. The cat was engaged and silent for a total time of about 45 minutes.
After playing for 15 minutes, and satisfied from eating, the cat was content to just sit and watch for about 30 minutes.
How is that a Prototype?
This would be a "low fidelity prototype." Instead of building a sophisticated piece of electronics that turned on the birds video and automatically dispensed food, I did those things. I stood in for the technology.
Types of prototypes:
Paper Prototypes:
- sketches
- diagrams
- wireframes (drawn or digital)
- paper interfaces
- flow charts
These tend to be good for prototyping interfaces.
A wireframe of a social media app. Sometimes paper is better, especially if the user is more willing to interact with paper than a computer.
This wireframe shows a number of screens in an app to give an impression of how it all might fit together.
Storyboards:
- illustrated or (by hand or digital)
- photographic
- can even be written, like a journey map
- Sketch noting
This simple storyboard shows the cooking/delivery progress on a food ordering app.
Physical models:
- Lego
- Cardboard
- Paper
- Wood
- Wikkistix
- Electronics
- Playdo, modeling clay
- 3d Printing
This curcuit is a prototype that later become part of a multisensory art exhibit.
This multisensory globe was first tested and refined with play-doh, and then with 3d-printing cross-sensory globe. By Uttara Ghodke and Lena Yusim.
This carboard controller uses real buttons. They might be actually be functional, they can be prototyped using the DnD method. Credit to u/joycem137
These people are using Lego to explain the system by which the BBC gathers and publishes content.
ProMeet and Serious Work
Human Prototypes
- Sketches and Acting
- Wizard of Oz
- DnD prototypes using voice only
- Roleplay
This Wizard of Oz prototypes an app for your home using paper. By Rebecca Lee, Hanzhi Wang, Sabrina Zafarullah, Isabel Zhuang.
Mixed Methods
You might notice that these overlap, and sometimes you might use more than one method. Sometimes you are using more than one method at once, sometimes you are using one to get to another.
Here you can see moving from paper prototyping to digital. The one on the left is low-fidelity (simple, low detail) and the one on the right is medium-fidelity (more detailed).
You might start with a paper prototype using Wizard of Oz style.
And then after testing move on to something in XD.
You can also mix paper, physical models, and roleplay. Here I printed some test labels, then I stuck them to all sort of containers around my house, and started to use them in context.
Remeber, it's not about "how good" the prototype is, it is about what you can learn about user behaviours from the prototype.
Involve the user by giving them a scenario or asking them to act out their normal routine with the prototype.
In this I am prototyping prescription labels on a variety of containers. I just want to see what ideas come up.
For apps that exist as part of the built environment (kiosks, installations, dashboards, etc) you can mix roleplay, XD, and paper prototypes to really see how a design can work in context.
Do you know those community "libraries" of books that people use to share books in the neighbourhood?
These students are demonstrating an app for sharing physical books: