Prototyping

"If a picture is worth a thousand words, then a prototype is worth 10,000."

– Prototyping, A Practitioner’s Guide

Prototyping is a good way to spark hundreds and thousands of ideas, get them out of your head and make them tangible for people to play with and test. In the course prototyping studio, I had the chance to use different prototyping methods to address various design challenges each week.

Methods
Paper Prototyping

Paper is the most widely used prototyping methods thanks to its zero cost and zero barrier nature.

 

In this week's assignment, we were asked to develop a product concept that involves synchronization of data between a smart watch and a smart phone, and finally run a user test to evaluate its effectiveness.

Phone Widgets

Check out how the paper prototype "CourseUp" works in action.

 
Video Prototyping

Video is a strong storytelling tool to demonstrate a design concept. It can quickly showcase a scenario-based use case and explain to customers why and how they would use this service.

 

In this week's assignment, we were asked to create a video prototype that demonstrates clearly and effectively the functionality of a transportation service. I chose car2go as the service and communicated one of its selling points that it can be a one-way trip from point A to point B without the hassle of returning it back to the same spot, unlike other carsharing services.

Check out the final product demo of car2go.

Storyboards

 
Behavioral Prototyping

Behavioral prototyping, or the Wizard of Oz experiment, is commonly used in the design process to evaluate a perceived autonomous computer system, operated by a human behind the scene. As part of the iterative design process, this technique enables designers to build a relatively inexpensive prototype with limited resources. 

 

The goal of our experiment was to simulate a driving experience in which a driver interacts with an in-car music entertainment system (or “infotainment”) via hand gestures. We created a 3D gesture user interface for the vehicle audio component of the system. The interface included a set of simple gesture interactions enabling the driver to focus their attention on the road. We decided to focus on what we estimated to be the most commonly used actions in streaming music playback: start, stop, pause, next song, previous song, volume up, and volume down.

Team

Lyle Klyne, Ricki Si Xie

Available Gestures

setup

The Setup and the Materials Used

Check out how we successfully "fool" participants into believing that it's working to gather feedback.

 
Wireframe Prototyping

Wireframe is able to showcase the information architecture, features available and intended interactions. Low-fidelity prototype is relatively quick to build, while high-fidelity prototype takes a step further towards the final product with the visual elements being considered.

 

In this week, we were asked to create mobile and desktop prototypes based on a design specification that has already been produced, so as to simulate a scenario when a UX practitioner is not involved in the requirements design of the application, but have been asked to implement a working prototype based on a specification developed by a team.

Tools Used

Axure, Illustrator, Invision, Premiere

Sketches

A video demonstrates the key features of the app and the desktop visualization.

 
Model Prototyping
Low-fi 3D Prototypes

This week, we were asked to build 3D low-fidelity prototypes with whatever materials we had in hands.

 

The design challenge was to help the OXO company explore a better design of a shower controller and represent design concepts with model prototyping. More specifically, try to design an intuitive digital shower controller that includes the functions of adjusting temperature, volume and valves (control whether the water comes out of the tub spout, the shower head or a handheld wand). It should be easy to use in the context of showering when challenges like soapy hands, steamy showers and absence of corrective lenses exist.

 

Final Prototypes

Direction 1
Direction 2
Direction 2
Direction 3
Direction 3
Raw Materials
Half Way Through
Sketches

The 3 Design Directions and the Materials Used

Laser Cut and 3D Printed Prototypes

To learn how to use the laser cutter and 3D printer, we were asked to produce two specific objects - one is a laser cut smartphone paper prototyping frame that can use for a usability test, and the other one is a 3D printed chess piece. I used Rhino to build the 3D models.

Paper Prototyping Frame
Front
Back
Laser Cutter
3D Printer
Queen

The Final Prototypes and the Tools Used

 
Physical Computing Prototyping

Arduino provides designers with open-source hardware, open-source software, and microcontroller-based kits to build digital devices and interactive objects that can sense and control physical devices.

 

We were asked to try out different Arduino components, including the photocell light sensor, the Hall Effect sensor, the LEDs, the trim pot, and a simple piezo buzzer.

 

A video shows some of the Arduino components work in action.

 

© 2019 by Yitao Wang

  • LinkedIn - Grey Circle
  • Instagram - Grey Circle
  • Twitter - Grey Circle
  • medium
Direction 3

This is the most “traditional” controller among these three iterations that is with a longer pipe sticks out and a circle digital interface displaying temperature and volume value at the center. At the bottom, there is another shorter pipe for user to swirl.