Brad A. Myers, CMU

Pilot:Exploratory

Programming for Interactive Behaviors: Unleashing Interaction Designers’ Creativity

Pilot:Exploratory

Programming for Interactive Behaviors: Unleashing Interaction Designers’ Creativity

Brad Myers, Stephen Oney, John Zimmerman, Bonnie John,

Miso Kim, Kursat F. OzencHuman Computer Interaction Institute

School of Design Carnegie Mellon University

Brad Myers, Stephen Oney, John Zimmerman, Bonnie John,

Miso Kim, Kursat F. OzencHuman Computer Interaction Institute

School of Design Carnegie Mellon University

Brad A. Myers, CMU 22

GoalsGoals

Making it easier for designers to create interactive behaviors

User studies to discover needs and natural expressions of designers

Create novel authoring tools and languages

Foster creativity of designers

EUCLASE: End User CenteredLanguage, APIs, System, and Environment

Making it easier for designers to create interactive behaviors

User studies to discover needs and natural expressions of designers

Create novel authoring tools and languages

Foster creativity of designers

EUCLASE: End User CenteredLanguage, APIs, System, and Environment

Brad A. Myers, CMU 33

“Designers”“Designers” Graphic Designers, User Interface Designers, Interaction Designers, Experience Designers, … Not “software designers”, not engineers

Designers usually participate in the creation of user interfaces & interactive web sites

Designers have many tools for the look

Graphic Designers, User Interface Designers, Interaction Designers, Experience Designers, … Not “software designers”, not engineers

Designers usually participate in the creation of user interfaces & interactive web sites

Designers have many tools for the look

Brad A. Myers, CMU 44

“Interactive Behaviors”“Interactive Behaviors”

Fewer tools for the interactive behavior What the program does in response to

user Most require elaborate programming

Javascript or ActionScript “Real” languages – collaboration of a

developer

Fewer tools for the interactive behavior What the program does in response to

user Most require elaborate programming

Javascript or ActionScript “Real” languages – collaboration of a

developer

Brad A. Myers, CMU 55

Pilot ActivitiesPilot Activities

Field studies (“Contextual Inquiry”) of 13 designers

Survey of 259 designers Lab study of 16 designers &

programmers Workshops with professional designers Further studies Tool investigations

Field studies (“Contextual Inquiry”) of 13 designers

Survey of 259 designers Lab study of 16 designers &

programmers Workshops with professional designers Further studies Tool investigations

Brad A. Myers, CMU 66

Results of Field Study and SurveyResults of Field Study and Survey

Reported at VL/HCC’08 Behaviors are

more difficult toprototype “Behaviors are dynamic” “Often ill-defined until final implementation” “There’s no such thing as low-fidelity interaction,

it has to be right.” “Current tools for defining behavior suck.” “I can represent very exactly the desired

appearance. However, I can only approximate the backend behaviors.”

Reported at VL/HCC’08 Behaviors are

more difficult toprototype “Behaviors are dynamic” “Often ill-defined until final implementation” “There’s no such thing as low-fidelity interaction,

it has to be right.” “Current tools for defining behavior suck.” “I can represent very exactly the desired

appearance. However, I can only approximate the backend behaviors.”

14%

86%

0% 20% 40% 60% 80% 100%

Appearance

Behavior

(t=6.8, p < .0001)

Brad A. Myers, CMU 77

More ResultsMore Results Required Behaviors are Complex Creativity is important Makes us skeptical of approaches like Adobe

Catalyst Some examples:

Physical simulations of dominos falling onto each other

Graphics that changed based on various sensors Interactions among graphical

objects on the screen such as bouncing off each other

An animated ‘lens effect’ Novel physical devices Character animation 3D rotation Synchronised behaviours

Required Behaviors are Complex Creativity is important Makes us skeptical of approaches like Adobe

Catalyst Some examples:

Physical simulations of dominos falling onto each other

Graphics that changed based on various sensors Interactions among graphical

objects on the screen such as bouncing off each other

An animated ‘lens effect’ Novel physical devices Character animation 3D rotation Synchronised behaviours

Brad A. Myers, CMU 88

More ResultsMore Results Sketches (used by 97%) and storyboards

(88%), etc. are popular, but not adequate Annotations are key Arrows, small text, large paragraphs Used to collaborate with developers, and as

specifications Designer explore alternatives

Multiple versions sketched Design emerges through creation, exploration More difficult with behaviors

Sketches (used by 97%) and storyboards (88%), etc. are popular, but not adequate Annotations are key Arrows, small text, large paragraphs Used to collaborate with developers, and as

specifications Designer explore alternatives

Multiple versions sketched Design emerges through creation, exploration More difficult with behaviors

Brad A. Myers, CMU 99

Lab Study on “Natural” Expressions

Lab Study on “Natural” Expressions

Lab study of 16 designers & programmers

Natural = Closer to the way that people think about algorithms and solving their tasks

Use before and after pictures so language not biased

Lab study of 16 designers & programmers

Natural = Closer to the way that people think about algorithms and solving their tasks

Use before and after pictures so language not biased

Brad A. Myers, CMU 1010

Some ResultsSome Results Noticeable commonalities in

designers’ descriptions, e.g., “appears/disappears”, “fade in/out”

Other concepts resulted in diverse expressions: “extend”, “expand”, “increase”, “grow”, “enlarge”, and “become larger”

Noticeable commonalities in designers’ descriptions, e.g., “appears/disappears”, “fade in/out”

Other concepts resulted in diverse expressions: “extend”, “expand”, “increase”, “grow”, “enlarge”, and “become larger”

Brad A. Myers, CMU 1111

WorkshopWorkshop

7 professional designers doing design in teams

Wanted to observe collaboration, ideation, communication around interactive behaviors

Some results: Communication using talking, drawing, gesturing

Often communication difficulties caused switch of modalities

Drawings often included context, not just the item being designed

7 professional designers doing design in teams

Wanted to observe collaboration, ideation, communication around interactive behaviors

Some results: Communication using talking, drawing, gesturing

Often communication difficulties caused switch of modalities

Drawings often included context, not just the item being designed

Brad A. Myers, CMU 1212

Next StepsNext Steps Further studies

Natural expressions Appropriate primitives out of which to build

behaviors Future tools

Focus on switch from sketching to computer-based tools

Ideas: New, more natural textual programming

language Metaphor based on storyboards More appropriate interaction primitives Support for exploration, versions and undo in

editor

Further studies Natural expressions Appropriate primitives out of which to build

behaviors Future tools

Focus on switch from sketching to computer-based tools

Ideas: New, more natural textual programming

language Metaphor based on storyboards More appropriate interaction primitives Support for exploration, versions and undo in

editor

Brad A. Myers, CMU 1313

Go Steelers!Go Steelers!