Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As...
-
date post
19-Dec-2015 -
Category
Documents
-
view
216 -
download
2
Transcript of Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As...
![Page 1: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/1.jpg)
stanford hci group
Björn Hartmann, Joel Brandt,
Scott R. KlemmerAdobe SF, 10 March 2008
Design As Exploration Software Tools for Prototyping Interaction Designs
![Page 2: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/2.jpg)
Outline
Juxtapose(with Loren Yu, Abel Allison, Yeonsoo Yang)
Understanding Input Devices(with Sean Follmer)
Time-Shifting & Simulating Input Traces (with Marcello Bastea-Forte, Timothy Cardenas)
![Page 3: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/3.jpg)
JUXTAPOSE(with Loren Yu, Abel Allison, Yeonsoo Yang)
![Page 4: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/4.jpg)
[Buxton, Sketching User Experiences]
Design as Divergence & Convergence
![Page 5: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/5.jpg)
[Buxton, Sketching User Experiences]
![Page 6: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/6.jpg)
Prototypes for the Microsoft mouseFrom Moggridge, Designing Interactions, Ch2
![Page 7: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/7.jpg)
7From Design Secrets: Products 2
![Page 8: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/8.jpg)
Tohidi et al, CHI 2006
![Page 9: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/9.jpg)
[Adobe Flash]
![Page 10: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/10.jpg)
Alternatives are expressed both in control flow and parameter values
…jMyron.track( red, green, blue, tolerance);…
…codePathA();//codePathB();…
![Page 11: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/11.jpg)
Alternatives are authored in one representation, observed in another
![Page 12: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/12.jpg)
Juxtapose
![Page 13: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/13.jpg)
Juxtapose
![Page 14: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/14.jpg)
Juxtapose
![Page 15: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/15.jpg)
Juxtapose
![Page 16: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/16.jpg)
![Page 17: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/17.jpg)
![Page 18: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/18.jpg)
![Page 19: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/19.jpg)
Longest Common Subsequence
![Page 20: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/20.jpg)
![Page 21: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/21.jpg)
![Page 22: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/22.jpg)
![Page 23: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/23.jpg)
![Page 24: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/24.jpg)
![Page 25: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/25.jpg)
![Page 26: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/26.jpg)
Juxtapose
![Page 27: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/27.jpg)
![Page 28: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/28.jpg)
28
![Page 29: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/29.jpg)
Pocket projector
[Crider et al, GI 2007]
![Page 30: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/30.jpg)
![Page 31: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/31.jpg)
![Page 32: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/32.jpg)
Participatory Design Study Extending Tohidi et al.’s results, conduct
user tests with modifiable vs. non-modifiable prototypes
Hypotheses: Higher # of suggestions in modifiable
condition More ground covered by those suggestions
Reasoning: Modifiability makes prototype feel less
finished Participants can get feedback on their
suggestions immediately Also observe: how many suggestions
were we able to implement?
![Page 33: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/33.jpg)
Other Steps to Take
Fix up the UI! Integrate alternatives for graphics +
code
![Page 34: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/34.jpg)
Related things we found at Adobe and UIUC
Troikatronix Isadora
![Page 35: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/35.jpg)
Related things we found at Adobe and UIUC
Adobe Image Foundations Toolkit
![Page 36: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/36.jpg)
Related things we found at Adobe and UIUC
Team Storm, UIUC
![Page 37: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/37.jpg)
UNDERSTANDING INPUT DEVICES(with Sean Follmer)
![Page 38: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/38.jpg)
Motivation: Beyond Multitouch
JazzMutant Lemur Behringer BCF2000 Multitouch Overlays
![Page 39: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/39.jpg)
State of the Art in Input Taxonomies:15 years old?
Lipscomb, J. S. and Pique, M. E. 1993. Analog input device physical characteristics. SIGCHI Bull. 25, 3
Card, S. K., Mackinlay, J. D., and Robertson, G. G. 1991. A morphological analysis of the design space of input devices. ACM Trans. Inf. Syst. 9, 2
Buxton, W. 1983. Lexical and pragmatic considerations of input structures. SIGGRAPH Comput. Graph. 17, 1
![Page 40: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/40.jpg)
![Page 41: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/41.jpg)
INPUT ACTIVE OUTPUT
PASSIVE PROPERTIES
![Page 42: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/42.jpg)
![Page 43: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/43.jpg)
INPUT ACTIVE OUTPUT
PASSIVE PROPERTIES
BIG MESS!
![Page 44: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/44.jpg)
Analogy: Network Stacks
![Page 45: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/45.jpg)
![Page 46: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/46.jpg)
Issues/Next Steps
Successful as a tool for structuring conversation
But: too much like a white paper, onerous to work out details for a given device
Output not captured well
![Page 47: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/47.jpg)
Example: Actuated Mixer
![Page 48: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/48.jpg)
Example: Ultimarc Keyboard Encoder
Unspecified – Left up to user
![Page 49: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/49.jpg)
Example: Ultimarc Keyboard Encoder
32 discrete digital switches
![Page 50: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/50.jpg)
Example: Ultimarc Keyboard Encoder
Transform switch to ASCII key code
![Page 51: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/51.jpg)
Example: Ultimarc Keyboard Encoder
Keyboard BIOS routines – key repeat
![Page 52: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/52.jpg)
Example: Ultimarc Keyboard Encoder
Keycode Press, release
![Page 53: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/53.jpg)
TIME-SHIFTING & SIMULATING INPUT TRACES(with Marcello Bastea-Forte, Timothy Cardenas)
![Page 54: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/54.jpg)
Motivation Testing non-WIMP interaction code is essential
but hard Real-time data may not be available due to
hardware/context constraints (e.g., GPS) Generating data may require leaving the desk, or
skilled/time-consuming actions (e.g., Wii Bowling) Reliable interactions need to be tested on many cases
(unit tests)
Cc Michael T Gilbert
![Page 55: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/55.jpg)
Robots to the Rescue!
Wizards: humans who do the work of (recognition) algorithms
Robots: algorithms that emulate human
input (e.g. java.awt.robot)
![Page 56: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/56.jpg)
Realtime Offline (Before)
Real data
Simulated Data(Proxied Data)
Phidgets
DART
?
Normalcase
Where does the data come from?W
hen
is t
he d
ata
gen
era
ted
?
![Page 57: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/57.jpg)
Needs for a richer device abstraction
Visualize/monitor data that is presented to application
Record/replay of traces Realtime simulation of data Editing (=offline simulation) of data
![Page 58: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/58.jpg)
Concept
DeviceAbstraction in Application
Live Data from Input Device
![Page 59: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/59.jpg)
Control UI WidgetsConcept
DeviceAbstraction in Application
Simulated Data
Live Data from Input Device
RecordedData
Visualization
On/Off
Memory/ Disk
Editor
![Page 60: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/60.jpg)
Prototype
Library replaces input device abstraction classes in Processing
General architecture; current implementation support Mouse, Keyboard, Arduino, Video input
![Page 61: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/61.jpg)
VideoInputChannels
![Page 62: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/62.jpg)
Video
Current State
![Page 63: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/63.jpg)
Video
History(editable in place)
![Page 64: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/64.jpg)
VideoToggle betweenLive & time-shifted modes
![Page 65: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/65.jpg)
Video
Toggle betweenlive & time-shifted modes
![Page 66: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/66.jpg)
Video
List of recorded sessions
![Page 67: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/67.jpg)
Video
ProcessingSketch
Playing back previously recorded video
![Page 68: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/68.jpg)
Arduino
Processing sketch
Visualization
![Page 69: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/69.jpg)
stanford hci group
http://hci.stanford.edu
![Page 70: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/70.jpg)
Evaluation
N=18, 12male, 6 female, ages 20-32, students
75-90 minute sessions, three tasks: warm-up, matching, designing map navigation
70
![Page 71: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/71.jpg)
Mapping Task
Given Actionscript code that loads a multilayered map, develop navigation options for a handheld GPS prototype for pedestrians and car drivers.
71
![Page 72: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/72.jpg)
Qualitative Results
Participants had clear conceptual model of linked editing and tuning and applied both.
Alternative tabs were used as a lightweight versioning mechanism and starting point for code experiments.
72
![Page 73: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/73.jpg)
Qualitative Results
Areas for improvement: Runtime changed should be reflected
back in source code. Additional callback functions are
sometimes needed to update application state based on variable tuning.
73
![Page 74: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/74.jpg)
Tree Matching Task
Search in 4D parameter space. Given recursive drawing code code for this:
Produce these:
74
![Page 75: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/75.jpg)
75
0
50
100
150
200
250
300
257.81
161.81
Tree Matching Task:Mean Completion Times
ControlJuxtapose
secon
ds
p<0.001 (paired two-tailed Student’s t)
![Page 76: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/76.jpg)
76
Tree 1 Tree 2 Tree 3 Tree 40
50
100
150
200
250
300
350
Tree Matching Task:Mean Completion Times by Tree
ControlJuxtapose
secon
ds
p<0.01 p~0.01not
significantnot
significant
![Page 77: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/77.jpg)
77
0
10
20
30
40
50
60
70
2.60
64.26Mean Parameter Changes
Tested per Minute
ControlJuxtapose
Ch
an
ges/m
inu
te
![Page 78: Stanford hci group Björn Hartmann, Joel Brandt, Scott R. Klemmer Adobe SF, 10 March 2008 Design As Exploration Software Tools for Prototyping Interaction.](https://reader038.fdocuments.in/reader038/viewer/2022103123/56649d2d5503460f94a0452b/html5/thumbnails/78.jpg)
78
10 20 30 40 50 60 70 80 90 100
Mor
e0
10
20
30
40
Histogram of Changes per Minute
Juxtapose Tuning Inter-faceEdit-Compile-Test Cycle