d.tools: Reflective Physical Prototyping

Uploaded by StanfordHCI on 20.08.2009

This video introduces D-Tools, a tool that enables rapid and reflective prototyping of
physical user interfaces. As computing leaves our desktops and enters out world, the number
of use of interfaces with novel, physical form factors and advanced sensor input is
growing quickly.
D.Tools is the first system that offers integrated support for designing, testing and analyzing
early prototypes that bridge the world of bits and atoms. The following scenario shows
how designers can rapidly build and evaluate with D.Tools.
Sam is an interaction designer who wants to create a novel map navigation interface for
a handheld GPS device based on orientation sensors. He connects a small LCD screen for
display and an accelerometer to the D.Tools hardware interface kit. As he plugs in physical
components, virtual counterparts appear in the D.Tools authoring environment on his PC.
Sam then authors interactions by creating visual states, which encapsulate output and
linking them through transitions which get triggered by hardware input events. In this
example, Sam is authoring map zooming through button presses.
To help his work with analog sensors, Sam can author transitions by demonstrating them
in physical space. Here, he is setting thresholds for an accelerometer by tilting it and setting
limits in the live data view, using the keyboard. At any point, he can try out his interaction
model by using the attached hardware inputs. Or by simulating such hardware input on the
After trying out some initial interaction ideas, Sam designs a more durable prototype
to test different interactions with office mates and users. To increase the realism of
the test, he asks Jim, a programmer's office, to add navigation of a live map database.
Jim attaches a few lines of Java to different states in order to remote control the Google
Maps application.
This is an example of how d.tools can be used to create mash up prototypes, an approach
that is becoming increasingly common.
In test mode, d.tools records all user interactions with the prototype . Simultaneously recording
a timed synchronized video stream of the users interaction with the device.
The video is automatically structured through state transitions and input events. During
the test, the designer can also annotate segments of the video for later review.
Switching from test to analyze mode, Sam sees an overview of the interaction model during
the last test. This aggregate view shows which transitions were taken most frequently, and
which ones were never reached during the test.
In analyze mode, the state chart is synchronized with the video interface, allowing our designers
to replay the user's interactions and parallel with the video Visualize time-line events
as they appear in the state chart, and quickly jump to video of particular states, both through
the state chart and through the physical prototype. Multiple categories can be selected, allowing
a designer to pinpoint at particular interaction by replaying it on the device.
Multiple test sessions can be combined into a video spreadsheet, which can be used for
rapid, comparative evaluation. Individual clips can be played simultaneously. Clips
can also be triggered by clicking on the corresponding event on the time-line. Additionally, clicking
on a column plays a single category for comparison across all users.
We employed three different methods to understand the interaction and architectural approaches
embodied in D Tools. We evaluated the threshold with the first-use study with 13 participants.
The ceiling through rebuilding prototypes for existing and emerging devices and naturalistic
use through longitudinal deployment in an HCI class.
Projects build with d.tools by students and authors include a digital camera interface
with a large number of buttons to navigate images and menus on a color LCD screen, a
sensing PDA that can detect portrait and landscape mode, scroll by tilting the and plays voice
memos when held up to the face. A color mixing interface where children can pour color from
tangible buckets onto an LCD screen and then use that color in a painting application.
Tangible drawers that offer access to personal data on an interactive multi-user table.
We have released d-tools to the design community as open source