K-Sketch: A “Kinetic” Sketch Pad for Novice Animators

K-Sketch: A “Kinetic” Sketch Pad for Novice Animators Richard C. Davis SMU School of Information Systems Collaborators: Brien Colwell (NYU), James Landay (UW) NUS CS Seminar, Feb 25, 2009

How Would a Teacher Animate This?

Need Quick & Easy Animation! • Students & Educators • Learn complex concepts • Need to animate fast before or during class • Amateur Artists • Play in new medium • Need a simple way to get started • Professionals • Share dynamic ideas • Need tool expressive enough for variety of tasks

Users Need Animation “Paper” • Properties of paper • Fast: Express ideas quickly • Simple: Learn fast, focus on high-level task • Expressive: Handle wide variety of tasks • K-Sketch realizes this vision

K-Sketch: Outline • Related Work • Field Studies • Interface Optimization • K-Sketch System • Evaluations • Future Work

Current Animation Tools Lacking • Child Tools • Too slow • Professional Tools • Too complex • Focused on polish • Special Case Tools • Too constraining Sketchy (GoKnow)

Current Animation Tools Lacking • Child Tools • Too slow • Professional Tools • Too complex • Focused on polish • Special Case Tools • Too constraining Flash (Adobe) PowerPoint (Microsoft)

Current Animation Tools Lacking • Child Tools • Too slow • Professional Tools • Too complex • Focused on polish • Special Case Tools • Too constraining Pivot Stick Figure Animator

Solution: Informal Interfaces • Defer Details • Focus on precision distracts & slows down • Precision often unimportant • Sketched Input • Hand drawn objects • Motion imprecise SILK (Landay & Myers 1995) DENIM (Newman et al. 2003)

Research Stops at Techniques • How to choose techniques? • Visual Language • Koka (Takahashi, et al. 2005) • Physical Simulation • Assist (Alvarado & Davis 2001) • Demonstration • Race Sketch(Moscovich & Hughes 2001)

Interviews with Animators • Seven animators • 4 made short films • 1 made web sites with Flash • 2 made conference presentations • Wanted to work more in rough form • Interested in prototyping Storyboard from a film animator

Interviews with Non-Animators

Example: Particle Collisions

Example: Contra Dance

Example: Machine Tread

Library of Usage Scenarios • Complete usage scenarios • User task • Animation that accomplishes the task • 72 examples in library • 27 from animators • 23 from non-animators • 22 from children (students of animator) • Identified 18 Animation Operations

Examples of Animation Operations Orient to Path Move Relative Copy Motion Trace

Our Library is a Gold Mine • Scenarios: breadth of applications • How many can we handle? • Many approaches to each • Some require “extra” steps • Animation Ops • Can we leave some out?

Goals  Optimization Constraints • Goals of “paper-like” interfaces • Fast: Express ideas quickly • Simple: Learn fast, focus on high-level task • Expressive: Handle wide variety of tasks • Goals expressed as optimization • Fast: Allow only a few extra steps • Simple: Minimize # Anim Ops • Expressive: Maximize # supported animations

Simplicity/Expressivity Tradeoff Look for point of diminishing returns Simplicity (Less Anim Ops) Expressivity (More Supported Animations)

Break up: Animations  “Features” Features  “Approaches” Required Anim Ops Number of “Extra Steps” Battery Example Three Features (electrons, sulfate ions, switch) Two sulfate ion approaches Appear + Translate + Disappear + Copy (6 steps) Appear + Translate + Disappear (12 steps, 6 extra) Step 1: Code All 72 Animations

Step 2: Find Best Operation Sets • Optimization program • For N = 1 to 72 animations • Find smallest set of operations • That supports N animations • No approaches with >4 extra steps • Examples • (Appear, Translate, Disappear, Copy) supports Battery • Use fastest approach for Sulfate ion • (Appear, Translate, Disappear, Morph) does not • Only available approach for ion has 6 extra steps

Diminishing Returns Optimization Results 0 2 4 6 # Animation Operations (Simplicity) 8 10 12 14 16 18 Supported Animations (Expressivity)

Black: operation is needed in all minimal sets Grey: operation is in some, but not all sets Optimization Results: Detailed View Animation Operations

K-Sketch Strikes Best Balance • Existing tools omit • Demonstration • Trace • K-Sketch Omits • Cel-based animation • Deformation • Precision

Interface Optimization Works • Data-driven • Feature decisions often subjective • Scenario data brings objectivity • Before application release • Better than frequency counts • Find best operations sooner • Widely applicable • Code works on any data set • Current algorithm parallelizes easily

K-Sketch System Demo

K-Sketch Key Features • Demonstration • Combines many ops in one • Visible motion paths • Easy coordination/editing of motions • Ability to add relative motions • Correction interface resolves ambiguity • Copy motions • Scale up animations quickly • Simplified timeline • Easily change timing of events

What Should We Compare With? • Professional tools for different users • Flash: Designers • PowerPoint: Presenters • Research tools incomplete • Only interaction techniques • Not our main contribution • Our Strategy • Use best tool for situation

Summative Evaluation • Goals of “paper-like” interfaces • Fast: Express ideas quickly • Simple: Learn fast, focus on high-level task • Expressive: Handle wide variety of tasks • Evaluation Strategy • Lab Study 1: How fast, How simple? • Lab Study 2: How expressive? • Case Studies: How is work affected?

Laboratory Study 1 • Evaluate speed and simplicity • 16 novices (varied professions, ages) • Within-subjects experiment: PowerPoint • General-purpose • Targets novices • Practice task plus two from library

Task A Particle Collision Task B Dance Maneuver Laboratory Study 1: Tasks

Study 1 Results: K-Sketch Fast • K-Sketch was faster (statistically significant) • Tasks took 1/3 the time • Felt faster

Study 1 Results: K-Sketch Simple • K-Sketch was simpler (statistically significant) • Half the practice time needed • Felt easier • Lower cognitive load

Study 1 Results: Comfort Level • K-Sketch no worse in sharing with others • More comfortable creating with K-Sketch (statistically significant)

PowerPoint 15 min. 24 sec. Told: avoid precision Still perfected paths K-Sketch 4 min. 38 sec. More comfortable showing & creating Part. 8: Dance Maneuver

Laboratory Study 2 • Evaluate Expressivity • 7 novices (students, various ages) • 9 tasks chosen randomly • Compare with “The TAB Lite” • “Supports” only 32% of scenarios • Two 3-hour sessions with each tool • Use pen in both conditions

Study 2: Handling Varied Tasks • K-Sketch handles more important AnimOps • Speed improves when AnimOps missing from TAB

Study 2: Creative Improvisation • K-Sketch required less paper sketches/notes • 7% of K-Sketch tasks • 41% of TAB Lite tasks • K-Sketch required no calculations • 5 of 7 participants struggled with math in TAB “With K-Sketch, I didn’t have to draw plans or do calculations, which leads me to believe it is a more ‘intuitive’ tool.”

Study 2: Evidence of Expressivity • Nine random tasks with K-Sketch • Tasks cover 17 of 18 Animation Ops • Speed due to expressivity • Average 61% faster than TAB • Only 3 of 63 trials incomplete (12 for TAB)

Case Study #1 • “Zero button mouse” design • Prototyping animated feedback • Quickly evaluated 25 designs

Case Study #2 • High school learning exercises • 3 months, 5 classes, 106 students • Better recall & motivation • Misconceptions clearer

K-Sketch: A “Kinetic” Sketch Pad for Novice Animators