My talk at UXLX in 2012 advocating for attention to motion as an aesthetic concern in designing interfaces using gestural interactions.

1. Make Your Users Boogie
Design Gestures Like a Choreographer
Dave Malouf @daveixd #uxlxBoogie

2. I’m a split personality
Analytical Emotional
Time Beauty
Abstraction Aesthetics
Metaphor Engagement
Story
Dave Malouf @daveixd #uxlxBoogie

3. Motion
Where it connects
(for me)
Dave Malouf @daveixd #uxlxBoogie

4. Gestures have been around
Dave Malouf @daveixd #uxlxBoogie

5. Elevator
handle
Dave Malouf @daveixd #uxlxBoogie

6. And then
buttons
Dave Malouf @daveixd #uxlxBoogie

7. Other controls, too ...
Dave Malouf @daveixd #uxlxBoogie

8. Feedback
The full range of
motion informs
someone as to their
probable outcome.
Dave Malouf @daveixd #uxlxBoogie

9. Dance & Percussion share an
aesthetic of sound and motion
Dave Malouf @daveixd #uxlxBoogie

10. Stops vs.
Slides
Need to balance this
like consistency &
contrast in visual
design
Dave Malouf @daveixd #uxlxBoogie

11. Audience Performer
Dave Malouf @daveixd #uxlxBoogie

12. The Pose
never as good in
reality as we imagine
it in our head
Dave Malouf @daveixd #uxlxBoogie

13. Spinner
Outcome is purely known visually, but the motion and
audio makes the experience!
Dave Malouf @daveixd #uxlxBoogie

14. Playing musical instruments
Balances all these pieces
Dave Malouf @daveixd #uxlxBoogie

15. Just so easy
Strumming is low
precision.
Dave Malouf @daveixd #uxlxBoogie

16. Piano is precision
harder to learn; posture, yes; pose? not so much
Dave Malouf @daveixd #uxlxBoogie

17. The front man
9 times out of ten, the
front man is playing a
guitar if anything.
Dave Malouf @daveixd #uxlxBoogie

18. Keytar?
All the rockin’ melody
of a guitar, and
percussive precision
of a keyboard.
Dave Malouf @daveixd #uxlxBoogie

19. Can this ever work?
I mean besides the Gorilla arm issue.
Dave Malouf @daveixd #uxlxBoogie

20. It’s not just about the
movement ...
The surfaces we are moving on or against has a
lot to do with the aesthetics of the gestures.
Dave Malouf @daveixd #uxlxBoogie

21. Stops have their place
Dave Malouf @daveixd #uxlxBoogie

22. A few examples
So let’s look at an app w/ arguably great appeal
due to its interesting use of novel gestures.
Dave Malouf @daveixd #uxlxBoogie

23. Pull to spring
Causes a get command
Dave Malouf @daveixd #uxlxBoogie

24. Swipe to reveal
It’s the new “right-click”
Dave Malouf @daveixd #uxlxBoogie

25. Taps & Swipes
Tap causes reveals of secondary content; swipes then dismiss
it. Easy to find and now includes the “reset” gesture again.
Dave Malouf @daveixd #uxlxBoogie

26. 2-finger pull
Reveals conversation without loss of context:
2 fingers is arguably not intuitive, hard to discover.
Dave Malouf @daveixd #uxlxBoogie

27. Reverse pinch reveal
Try it! It’s REALLY hard to do consistently.
Dave Malouf @daveixd #uxlxBoogie

28. So how are we going to do
this stuff?
It really is about going
back to basic design.
Experience
Externalize
Envision
Evaluate
Execute
Dave Malouf @daveixd #uxlxBoogie

29. Gotta own it ...
... minimum at least 1 touch-based device,
hopefully 1 that you are designing for.
Dave Malouf @daveixd #uxlxBoogie

30. Sketch!
Dave Malouf @daveixd #uxlxBoogie

31. Video Prototype
Dave Malouf @daveixd #uxlxBoogie

32. Sketch!
and sketch some more.
Dave Malouf @daveixd #uxlxBoogie

33. Act it out!
Paper prototypes, rock!
Dave Malouf @daveixd #uxlxBoogie

34. Re-visualize
Dave Malouf @daveixd #uxlxBoogie

35. Experience
Again
Dave Malouf @daveixd #uxlxBoogie

36. Be sure to bring the love
the emotion, the fun, the expressiveness,
responsiveness, etc.?
Dave Malouf @daveixd #uxlxBoogie

37. Thanx!
David Malouf
Professor of IxD
SCAD
@daveixd
http://davemalouf.com/
dave.ixd@gmail.com
Dave Malouf @daveixd #uxlxBoogie