This document discusses storyboarding and techniques for designing user experiences. It begins by introducing concept experience design and moving from insights to ideation. It then discusses defining the product by establishing the what, why, who, when and where. This includes defining the product concept as a mobile experience and designing for mobile affordances. It also discusses establishing a customer value proposition and "make mantra". The document then covers storyboarding and sketching to refine designs, convey value propositions and sell ideas. It provides examples and discusses immersion techniques to develop designs.

1. and the various techniques to illustrate the interaction
STORYBOARDING
Presented By: Prarthana Panchal and informed by Jon Mann.

2. INTRODUCTION
Concept Experience Design
• Design
• Develop compelling user
experiences for hardware, software
and services
• Align
• Work closely with Innovation
Marketing and Product
Development
• Pitch
• Create a synergistic vision and sell
the product
feasibility
viability
desirability
HOME
WEB
MOBILE
SERVICES

3. INTRODUCTION
Moving from Synthesis to Ideation
• Synthesize insights into solutions
• Address market and user needs
• Brainstorm ideas/concepts/features
• Define your user(s)
• Define user experience and
interaction models

4. DEFINE YOUR DESIGN
DEFINING YOUR PRODUCT
The What, Why, Who, When and
Where of it all

5. DEFINE YOUR DESIGN
The What…A Mobile Experience
• Always on, always on us
• Linked to the cloud
• Socially enabled
• Shared (hand off your phone)
• Sixth sense (and more coming)
• Microphone, speaker, camera, gps
accelerometer, compass, ambient
light

6. DEFINE YOUR DESIGN
Designing For Mobile
• Optimized, quick, accessible,
intelligent
• Leverage prediction and probability to
narrow down options (ambient
awareness)
• Multi-modal input: touch, keys, voice,
gestures
• Snack sized, not a buffet
• Quick access window into a larger
ecosystem
• Context of use

7. DEFINE YOUR DESIGN
The Why
What is the Customer Value Proposition?
• Why would they use it, what do they get?
• What is the promise
• Appeal to a core need
What is the benefit to the company?
• Does it align with a larger strategy
• How do you differentiate
• Does the company have credibility

8. DEFINE YOUR DESIGN
Make Mantra
Make Mantra *
• What is the essence of your product
• Bring clarity and simplicity to your goals
• Your mantra is the compass (and filter) to
direct your product features
* From Guy Kawasaki’s “The Art of the Start”

9. DEFINE YOUR DESIGN
Example Mantras
• Authentic athletic performance (Nike)
• Fun family entertainment (Disney)
• Rewarding everyday moments (Starbucks)
• Think (IBM)
• Winning is everything (Vince Lombardiʼs
Green Bay Packers)

10. DEFINE YOUR DESIGN
Doing it Differently
vsPS3
Technological marvel
Amazing graphics
Blue-ray player
Hardcore gamers
Wii
Simple
Accessible
Accelerometers
Non-gamers

11. DEFINE YOUR DESIGN
The Who
Target Users
• Can come from research or marketing
• Remember multiple use cases & users
Personas
• Can be simple or complex
The Mobile Angle
• Design for sharing

12. DEFINE YOUR DESIGN
The Where & When
The Mobile Angle
• Inside vs outside (contrast)
• Stationary vs moving (complexity)
• Active vs passive control (proximity)
• Other environmental limitations
• Public vs private (alerts)
• Other rules of etiquette

13. DEFINE YOUR DESIGN
Let’s Put It All Together
Mantra: Constantly pushing the limits
What:
• Record tricks (skater & recorder modes)
• Learn/master tricks mode (AR & motion capture)
• Upload & share tricks. Brag/comment/teach
Users:
• Skater: primary owner and user
• Recorder/observer: secondary user
Where/When
• Skate parks and urban streets
• Mostly day, some dusk (low light is an issue)
Mobile Affordances:
• Accelerometer + compass + gps for
motion capture (passive recording)
• Camera for recording + augmented
reality overlay (active recording)
• Upload data to cloud for sharing
• Share recordings on-the-spot with
friends (share phone)
• Simplified UI during recording (w/
auto start/stop)
Special Considerations:
• Viewing in bright light
• Use with safety equipment (helmet,
gloves, etc)

14. DEFINE YOUR DESIGN
DESIGNERS TOOLBOX
Telling and selling your story

15. DESIGNERS TOOLBOX
The Designers Toolbox
BRAINSTORMING MIND MAPPING
DESIGN SKETCHING STORYBOARDING

16. DESIGNERS TOOLBOX
Why Storyboard/Sketch
Refine the Design
• Inform the interaction model +
wireframes
• Vet product concepts and interactions
• Quick and iterative
• Build out your use cases
Sell Your Ideas
• Convey product value proposition
• Sell the vision and brand fit

17. DESIGNERS TOOLBOX
Storyboarding/Sketching Principles
DO
• Focus on the high-level
tasks/interactions
• Focus on a couple of your primary
use cases
• Show the most likely user experience
DON’T
• Get bogged down in the detailed
interactions. Save that for the
wireframes

18. DESIGNERS TOOLBOX
Storyboard: Experience/CVP

19. DESIGNERS TOOLBOX
Storyboard: Motion Graphics

20. DESIGNERS TOOLBOX
Design Sketching: Interactions

21. DESIGNERS TOOLBOX
Design Sketching: Task Flows

22. DESIGNERS TOOLBOX
Examples
Who:
People who are having trouble counting in their heads in accordance with specific
note values in the music. Also, I’d like this app to motivate people to progress
The first goal would be targeted to both older individuals and younger, while the latter
competitive would be mainly targeted at younger students.
What:
This is an visual system that functions as the verbal counting mechanism that many
individuals learn “one and two and three and four and one and…etc).
Where:
The concept could be embedded in the music stand, or the music itself. Also the
instrument could be augmented in some way.
When: The use would come while practicing at home away from a lesson or at an
orchestra rehearsal when you have to be able to site read with the other players. A
big challenge is remembering what you learned at your lesson and then applying
those principals to your practice at home.
Why:
Learning an instrument is difficult. Most of the challenge is staying motivated to
practice even when the going is slow. Many times students quite after a few months
or even a couple of years, on the cusp of understanding. People quite just before they
start to sound good on their instrument.
How:
I want this to be visual and not verbal because when I’m playing it’s very hard for me
to talk or read things.
Either this is a visual map that helps you get through the music or a device that
records your progress and puts you head-to-head with another player.
http://seedandsprout.com/s10_gd492/category/students/cox/

23. DESIGNERS TOOLBOX
Examples
http://seedandsprout.com/s10_gd492/category/students/cox/

24. DESIGNERS TOOLBOX
Examples
http://seedandsprout.com/s10_gd492/category/students/cox/

25. DESIGNERS TOOLBOX
Immersion Techniques
Scenarios
Act out the interaction
Portray the interactions in the
environmental contexts they
would be used.
Note: if you can live it for real, do it!
Role Playing
Act out the roles
Portray the needs and
perspectives of the players in
the interaction.
Personification
Act out the personality
Give personality to the
inanimate qualities of the
product, service or brand.

26. DESIGNERS TOOLBOX
Tangibles Techniques
Props
Acting with the object
Use props to investigate our
physical and emotional
interactions to the problem
context.
Rapid Prototyping
Interacting with the object
Build interactive props to
experience the
product/service/brand in use.
Sensory Deprivation
Expand beyond the object
Introduce physical constraints
(sight, hearing, dexterity) to
promote more holistic solutions
that cater to all the senses.
IF YOU ARE THINKING NUI!

27. DESIGNERS TOOLBOX
Simulated experience

28. DESIGNERS TOOLBOX
AIGA Hive Workshops 28
Tangibles
In Practice
Kinetic UX AIGA Hive Workshops 2011

29. DESIGNERS TOOLBOX

30. Make Mantra
• Identify the customer value proposition and use as a compass
Make it Mobile (or the platform you are working in)
• Design for the unique affordances of mobile (platform)
• Embrace the changing contexts of the mobile (platform) user
Storyboard
• Tell your story, sell your CVP
• Sketch: quick and iterative
Conclusion

31. Thank you.