0
INTERACTION
DESIGN
(IXD)
INTERACTION DESIGN IS THE CREATION
OF A DIALOGUE BETWEEN A PERSON AND
A DESIGNED ARTIFACT - A PRODUCT,
SERVICE, OR SYSTEM.
TODAY’S CLASS

Goaldirected
Design

4
User
Research

Personas
Scenarios
Task
Analysis
Use Cases
Feature
Design
Advanced Barbies for Design Excellence

PERSONAS &
SCENARIOS
“A persona is a user
archetype you can use
to help guide decisions
about product features,
navigation,
interactions, and e...
Personas bring users into focus
WHY DO WE HAVE THEM?
The average user doesn’t exist.
We can‟t design for everyone

But maybe we can get it right for the right people
But you can play one on TV

YOU ARE NOT THE USER
Empathy & Insight
To remember all that research

MNEMONIC
Personas are a
representative behavior
and activity profile for a
customer base.
Personas

From CarbonIQ , circa 2000
FOR EXAMPLE
Grace

(62/ female/ widowed/ Little Rock, AR.)
“I like playing my favorite games online, but if I can
play with friends, w...
Sarah

(22/ female/ single/ Washington, DC.)
“I like AtomFilms because it‟s just about the films”
Personal Background: Lib...
Scott

(17/ male/ single/ Shaumburg, IL.)
“I want something cool and really on the edge.
Something you can‟t get on TV”
#2...
Persona development

‣

How to create:
• Summarize findings, distribute to stakeholders.
• Hold a work session with stakeh...
Sort your findings
Specific: Each piece of information should be as
precise as possible. Throw out information like, “User...
Specific: Each piece of information should be as
precise as possible. Throw out information like, “Users
like it to be eas...
Write out age(s), genders, ethnicities and other demographics

1 MINUTE
Make pseudo-people

10 MINUTES GROUP TOGETHER LIKE
SHARE
Start adding depth to the personas

ENRICH
Frequency of Use

Weekly
?

Daily

All the
time?
Capability

Computer and IT experience

Novice

Expert
Examples

Eats lunch
at desk
each day

Eats out
with clients

Eats lunch
with team
Examples

New dad,
shares photos
daily

Family archivist
Avoids
grandparents
Examples

Can find
browser if
pressed

Excel whiz

Writes own
SQL queries
From Todd Warfel‟s Persona Talk http://www.slideshare.net/toddwarfel/data-driven-personas
CREATE DETAILS
[Persona’s name]
[A tag line for the persona]
About [Name]
• Who are they?
• What is their background?
• What is their con...
They can be simple
You can make them very fancy

From Todd Warfel‟s Persona Talk http://www.slideshare.net/toddwarfel/data-driven-personas
SANITY CHECK
Do I know people like this?

ARE THEY REAL?
Is it worth targeting them? Do I have information I can use to make decisions?

ARE THEY USEFUL?
Have a made a dream user that isn’t common?

ARE THEY TOO USEFUL?
ROLE PLAY
REFINE FURTHER
Prioritize personas
Prioritization of Personas is essential
To assure that design decisions don't become
generic in the face of too many audie...
secondary

primary
special
secondary

primary
special
Names Matter

Think of your persona as a brand
‣ People are more likely to remember a memorable name e.g.
‣ Phoebe the pho...
Photos of real people

Toby

The Cambridge new comer
About Toby (28)
•
•
•
•
•

Currently lives in Cambridge with his girl...
Choose thoughtfully
‣

A person photo should be:
‣
‣

A head shot

‣

Natural, not too staged

‣

‣

A good size

Royalty ...
EXERCISE: ADD DETAIL
TIPS AND TRICKS
Keep Alive
I’m worried about
Sandy. Can she use
the profile?
Omit needless words

Only include information that is important when it comes to designing
for that person
‣ Throw away an...
Don‟t reinvent for every project
Use personas

‣

Keep them near
•
•
•
•

Hang them on your wall
Make poster, placemats, puppets
Role-play personas
Evaluat...
From Steve Mulder‟s The User is Always right http://www.slideshare.net/MulderMedia/the-user-is-always-right-making-persona...
From Todd Warfel‟s Persona Talk http://www.slideshare.net/toddwarfel/data-driven-personas
THE PROBLEM WITH PERSONAS
I‟ve never been a big
believer in personas.
They‟re artificial, abstract,
and fictitious. I don‟t think
you can build a gr...
Personas Don‟t

“

Personas don’t talk back. Personas can’t answer questions. Personas
don’t have opinions. Personas can’t...
SCENAROS
User
Research
Segments
Personas

Scenarios
Task
Analysis
Use Cases
Feature
Design
Pick a persona
What is that’s personas GOAL for
using your product?
Tell their story.

The most perfect, magical story of ...
Steve Mulder’s Advice
65
Set the scene.
‣ Where are they? What is the situation?
‣ Establish the goal or conflict.
‣ What ...
66
Add business constraints in
Keep the story as positive as possible
Add in log in/registration
Add in check out
Bring bu...
From Steve Mulder‟s The User is Always right http://www.slideshare.net/MulderMedia/the-user-is-always-right-making-persona...
68

ADJUST FOR FREQUENCY
69
Daily-Use Scenarios
Usually only 2-3 of these
Clear training, quickly removed
Shortcuts & power tools
Customization
Tel...
70
Infrequent, Common Scenarios
Users do it only once in a while
Many users do it – core to business
Expected to “just wor...
71
Necessary-Use Scenarios
Must be done, but aren’t done often
User needs to get right, be comfortable it works
Changing p...
72
Edge-Case Scenario
Unusual situations
Programmers must handle, or code will not work
Design can largely ignore beyond q...
73
74
Exercise: Revise your scenarios. Add new ones.
75
Daily?

Common Infrequent?
76

COMMUNICATING SCENARIOS
When Stan is out of the office and working at a client’s location, the last thing he feels like doing at the end of a
long...
Storyboards
78

‣

Kim Goodwin, Designing for the digital age
Comics
79

Kevin Change, See What I Mean
81
82

Emotion matters, but it isn’t hard to communicate!
(from Kevin Cheng’s See What I Mean)
83

You can show time passing….
(from Kevin Cheng’s See What I Mean)
Can’t draw?

84

Stick figures!
Photos!
Clipart!

 Philgreg.tv
 Boxesandarrows.com
t Kevin Change, See What I
Mean
Regardless of how
you present them,
what you want to
leave with is a
clear idea of what
requirements and
features you have...
TASK ANALYSIS & USE CASES
User
Research
Segments
Personas
Scenarios

Task Analysis
Use Cases
Feature
Design
Task analysis
Can be used to
‣ Understand current behavior
‣ Optimize current behavior
‣ Design for new behavior
In Design...
Why the user is performing the task (that is, the underlying
Task Analysis during Research

goal)
Frequency and importance...
From a
McDonald‟s
patent
application on
sandwich
making
9
3

How to Design

TASK ANALYSIS
Scenario: Picking films to see

Persona: Michael
From Information Architecture: Blueprints for the Web by
Christina Wodtke...
9
5

HIGHLIGHT YOUR VERBS
Goal: Michael wants to quickly set up

1. Understand how it works.

a schedule for Sundance.

2. Choose films of interest....
9
7

PULL OUT THE STEPS
Goal: Michael wants to quickly set up
a schedule for Sundance.

From Information Architecture: Blueprints for the Web by
C...
9
9

FIND SUBTASKS
Goal: Michael wants to quickly set up
a schedule for Sundance.

From Information Architecture: Blueprints for the Web by
C...
1
0
1
TRY A SKETCH
Visual Vocabulary
A simple, useful set of shapes to communicate
interaction and hierarchy, used for both flows and
sitemap...
From Jesse James
Garrett’s Reverse
engineered Yahoo Mail

1
0
3
1
0
4
Exercise

REVERSE ENGINEER A COMPETITOR
User
Research
Segments
Personas
Scenarios

Task
Analysis

Use Cases
Feature
Design
A use case from our task analysis
Use cases
This is just more formal and careful documented
task analysis, useful to progr...
First, name all your use cases (or user stories, or scenarios)
(you can get these from your sitepath/system diagram or AOF...
Example: Log in Use Case
Login
Brief Description
This use case describes how a user logs into the Course Registration Syst...
I prefer the two column approach, with user on
one side, system on the other.
Note: I do not say “pushes button.” or the l...
Example user stories.

And User Stories?
Agile, Short, can be tested, no design indicated
Stakeholders write user stories....
Can task analysis and use cases
limit?
If I ask you to
make a vase
you might
come up with
a vast number
of variations of
f...
Design a way to enjoy flowers

But if I ask you to
think of a way to
enjoy plants and
flowers?
And laws and guidelines

PRINCIPLES
SOME LAWS
Fitts‟s Law
Fitts‟s Law simply states that the time it takes to move from a starting position to a final target is
determi...
The Magical Number Seven +- 1

Is a myth
Law of the
Conservation of
Complexity
states that some complexity is inherent in every process. There is a point beyond wh...
Universal Principles

Direct Manipulation
Affordances
Feedback
Mental Model
Standards
Poka-yoke
Direct
Manipulation
Affordances
Feedback
Feedback
Feedback
Discuss
Do you need a message?
Is it enough it always shows?
What if technology doesn‟t allow it to be on top (more recent...
Inline feedback vs validation: Luke Wrobowski
http://alistapart.com/article/inline-validation-in-web-forms

Traditional

I...
Feedback Matters
Inline feedback gave:
•
•
•
•
•

a 22% increase in success rates,
a 22% decrease in errors made,
a 31% in...
The Poka-Yoke
Principle
Poka-Yoke roughly translates in English to mistake proofing: avoiding (yokeru) inadvertent errors
...
Errors

Prevent
Allow fixes
COMPASSION
Avoid learned Dismissal
Standards
"Obey standards unless there
is a truly superior alternative"
- Alan Cooper
Contextual Principles

What you know about the context/users/activity. E.g.
‣ Recipes must be scannable
‣ User should know...
Tivo Tennants

It‟s entertainment, stupid.
It‟s TV, stupid.
It‟s video, dammit.
Everything is smooth and gentle.
No modali...
WHAT ARE YOUR LAWS?
HEADER

Q&A

1
3
7
Interaction Design with Personas and Scenarios
Interaction Design with Personas and Scenarios
Interaction Design with Personas and Scenarios
Upcoming SlideShare
Loading in...5
×

Interaction Design with Personas and Scenarios

7,820

Published on

From the recent class "Fundamentals of User Experience" given 12/13/2013 in NYC

Published in: Design, Technology
2 Comments
62 Likes
Statistics
Notes
No Downloads
Views
Total Views
7,820
On Slideshare
0
From Embeds
0
Number of Embeds
11
Actions
Shares
0
Downloads
318
Comments
2
Likes
62
Embeds 0
No embeds

No notes for slide
  • We’re going to take that literally, here. We’re going to try out playing the computer. Using bodystorming.
  • Welcome to another session of “all the post-it notes must die!”
  • Be a rolling suitcase (from blueprints)In the beginning, only flight attendants had rolling suitcases. They had them becausesomeone who understood the flight attendant’s job designed the suitcases for a veryspecific set of needs. Flight attendants needed to dash from flight to flight. They had tostay fresh for the long flight’s exertions, so they didn’t want to get tired carrying a heavybag. Many flight attendants were quite petite, so carrying a big bag could be tough. Andfinally were changing flights so often, they really needed to carry all their essentials onthe plane—they never knew when their job would send them to Tokyo when their bagswere already on their way to Paris.Does this sound familiar? Ordinary people go through the same pains when they fly. Wewant to carry all our valuables onto the plane with us. We need them to fi t in the overheadcompartment. We get tired of carrying bags in the long lines to the ticket counteror while dashing from Terminal C to Terminal F. And our bags often seem to be determinedto head for Paris when we are en route to Tokyo.A travel-savvy designer met a very specific need for a particular group extremely well,and ultimately he met the needs of flyers everywhere.
  • Alex Reid is desperate to win back his pregnant fiancée after she walked out on him two weeks ago, so he's showing her that he's a sensitive new age dude with a baby belly just like hers!
  • This is a casestudy form early work I did at carbonoiq, that can be shared. But you should probably put in your own.
  • Elementary my dear Watson!Specifi c: Each piece of information should be as precise as possible. Throw outinformation like, “Users like it to be easy,” and keep information like, “Users needto be able to complete a process in half an hour.”{ Relevant: Relevant to your product, not to every site on the Web. Don’t report,“Users like free stuff,” but include, “Many users request free evaluation periods forsoftware to know if paying will be worth it.”{ Universal: Find things that are true for the entire site, not for a single item on asingle page. Weed out things like, “Users couldn’t fi nd the Submit button on thecheckout page,” but leave in, “We have a type of user who knows what he wantsalready and needs a way to speed through fi nding and buying.”
  • A group doesn’t just have to be a demographic group. It could be based around similar attitudes, level of engagement, behaviour etc…ASK students to stop and write these different things on their post its.
  • A group doesn’t just have to be a demographic group. It could be based around similar attitudes, level of engagement, behaviour etc…
  • Comedy names, such as ‘Miguel the Mexican’ are best avoided, as are celebrity names, such as ‘Jo Lo’ or ‘Madonna’
  • Comedy names, such as ‘Miguel the Mexican’ are best avoided, as are celebrity names, such as ‘Jo Lo’ or ‘Madonna’http://www.flickr.com/photos/12433334@N04/2390719990/in/photolist-4Dg4Lb-4Gqfa6-4Mbb3t-4MiAVW-4MkCWW-4NShzN-4Q4hVN-4Rcdv1-4XqeJg-521RhQ-5aFFTB-5f9HRd-5ocznq-5qPRzW-5Tg1Ui-5TkgrC-5Tkgub-5TkkdC-5Tkki1-5UfqRN-5Xgt8t-6gg3ej-6gg5p3-6ghCzf-6hRv2T-6pvxgQ-6su7Zr-6RemDm-6Rk8s2-6RpVSi-7ikFKo-7oGeUc-7rfpZs-bmR5K6-93AGYR-8gyUEC-ahi1ad-7Cf67a-dbbjEu-dq4khD-8r5t8d-8r5Cih-7zwDQf-7Xgegt-9xyerT-8r5Duf-eC1CSZ-avfmYw-eBZEKp-7DCYds-8ndChK
  • If you’re designing a computer system to be used in schools, don’t base your personas on characters from 90210!
  • The last example is from a company that used to send their personas birthday cards and would receive holiday postcards from their personas. It’s all about getting people regularly thinking about their users.
  • These are some persona cards that were created to help everyone get to know the personas. You can see some information about the persona on the back of each card, together with what is important to them and a good quote.
  • http://www.flickr.com/photos/ul_digital_library/with/8978093756/
  • Open with an exercise, ~15 minutes for quiet individual scenario writing, then 15 to exchange them. Instructions for exchanging– keep each other honest, piont out where you are thinking too much about current constraints like paywalls, or design decisions like buttons and links. Focus on the experience. Meeting of Drama Society October 1973, Glucksman Library NO COPYRIGHT RESTRICTIONS
  • Revisit your scenarios with this. Add in details. ~10-15 minutes.“Your mission is to document that experience from the persona’s point of view. I like to use the classic components of good storytelling when doing this.Set the scene.Where is the persona when he or she first discovers the need that will lead him or her to the Web site? When does it happen? Who else is around possibly influencing his or her decision? What else is going on at the time? Be as specific as possible to create a realistic story, just as you were with the persona details.Establish the goal or conflict.Visits to the site are triggered by goals, so something must have happened to prompt your persona to go to your site. What was it? Perhaps it occurred in typical narrative fashion, based on a conflict with someone else or an inner conflict that he or she needed to resolve. Be very clear about what your persona is trying to achieve by visiting the site, keeping in mind that he or she could have multiple goals.Overcome crises along the way.When the persona comes to the site, how does he or she enter? What decisions does he or she make along the way? How does the persona find what he or she’s looking for? Are there intermediate steps to describe? What challenges does the persona face along the way that the site helps with? Does the action all take place on your site, or does the persona use other sites, email, IM, phone calls, meetings with others, store visits, and so on? Even though this is an idealized story about how your site could satisfy this persona’s needs perfectly, be realistic about what he or she would actually do. How does the persona feel about the experience while going through it?Achieve resolution.How does the persona ultimately achieve his or her goal? What are the persona’s attitudes at the climax of his or her story? What are the most critical factors in helping the persona achieve his or her goal?Reach denouement.What does the persona do after succeeding? How does the persona leave the site? How does this story affect his or her work or life? What’s his or her perception afterward? How does the persona’s success impact your business?
  • Now you can add in the businGlucksman Library NO COPYRIGHT RESTRICTIONSess needs. Discuss what het business wants and the user wants, and if there is a middle ground. Still don’t’ add in design …If you write “he submits the form” you are too detailed.
  • Not everyone has the “no design” philosophy (as you can see) but it helps in this world of many different kinds of solutions.
  • Users looking up a train schedule or tickets at amtrak… they don’t expect to have to deal with a tutorial, they just want in and out
  • Which is this? How do you know? What is a good scenario for dealing with this?
  • SDASM ArchivesSan Diego Air & Space
  • People may not read your scenarios
  • Simpel wireframe+ text
  • Comics for emotionhttp://kevnull.com/2011/09/see-what-i-mean-short-talk-at-wordcamp-sf.htmlhttp://boxesandarrows.com/comics-not-just-for-laughs/
  • Parts of comic
  • http://boxesandarrows.com/comics-not-just-for-laughs/http://www.almostexact.com/2011/08/how-to-test-a-new-website-or-concept/http://philgreg.tv/courses/comiclife/
  • Regardless of how you present them, what you want to leave with is a clear idea of what requirements and features you have.User Stories – are just another way to phrase requirements – talk about them a little bit.
  • This is a good 40 minute exercise.
  • Notes: you need to have the scenarios out. Images in this presentation: http://www.flickr.com/photos/ul_digital_library/with/8978093756/
  • Wallace "Whitey" Wolf, a Mechanic for the City Sweeps Out the Repair Garage ..., 10/1974US National Archive
  • The U.S. National ArchivesMember since 2009Taken on August 12, 1942
  • Mcdonalds uses task analysis to optimize for speed and accurate reproduction.
  • Get out a scenarios
  • Look for verbs, they indicate action.
  • Pull the tasks out of the scenarios“Here we try to get the basic unique tasks. This sequence isn’t necessarily written instone. For example, in our design, we hope to make “Save work” available at any stage.However, we know that “Save work” is really, really important later in the process. So, fornow, we’ll leave it in the sequence of the scenario.”
  • Pull the tasks out of the scenarios“Here we try to get the basic unique tasks. This sequence isn’t necessarily written instone. For example, in our design, we hope to make “Save work” available at any stage.However, we know that “Save work” is really, really important later in the process. So, fornow, we’ll leave it in the sequence of the scenario.”
  • Diagram, rather than text. Same end result.
  • Discuss: is design happening here? Who knows the users best? Who should write this?
  • You may end up with a mashup of approaches.
  • Limiting the number of menu tabs or the number of items in a dropdown list to the George Miller’s magic number 7 is a false constraint. Miller’s original theory argues that people can keep no more than 7 (plus or minus 2) items in their short-term memory. On a webpage, however, the information is visually present, people don’t have to memorize anything and therefore can easily manage broader choices.For example, research shows that broad and shallow menu structures may even work better than deeper menus. Also, link-rich e-commerce homepages, like that of Amazon with 90+ product category links, are found to be more usable than homepages with only a few links.http://uxmyths.com/post/931925744/myth-23-choices-should-always-be-limited-to-seven
  • So bloody true. And mostly we move the complexity from the user to the designer.
  • ExerciseHave a student write their name on a white board. Now tape the marker to a long stick (like a broom handle) and try again.
  • Compare the keyboard buttons you can feel and push, to the hyper-flat keyboad. What is nicer to use? Is the ipad keyboard enough?
  • On twitter, when you post you get feedback so you know your tweet went out. on Facebook, they show the link preview as soon as you add it, so you know all is workign (and can preview0Your new status is always posted on top, to let you know its there. Discuss: do you need a message? Is it enough it always shows? What if technology doesn’t allow it to be on top (more recent, etc) Should you force it there to make sure user knows its posted?
  • On twitter, when you post you get feedback so you know your tweet went out. on Facebook, they show the link preview as soon as you add it, so you know all is workign (and can preview0Your new status is always posted on top, to let you know its there. Discuss: do you need a message? Is it enough it always shows? What if technology doesn’t allow it to be on top (more recent, etc) Should you force it there to make sure user knows its posted?
  • On twitter, when you post you get feedback so you know your tweet went out. on Facebook, they show the link preview as soon as you add it, so you know all is workign (and can preview0Your new status is always posted on top, to let you know its there. Discuss: do you need a message? Is it enough it always shows? What if technology doesn’t allow it to be on top (more recent, etc) Should you force it there to make sure user knows its posted?
  • USB can only be put in one place.
  • Does your software reflect how users think about the space? (we have covered this before)
  • i.e. I don’t care if it’s stupid, use it.
  • Can you think up some rules for your space, from what you’ve seen in user research?
  • Transcript of "Interaction Design with Personas and Scenarios"

    1. 1. INTERACTION DESIGN (IXD)
    2. 2. INTERACTION DESIGN IS THE CREATION OF A DIALOGUE BETWEEN A PERSON AND A DESIGNED ARTIFACT - A PRODUCT, SERVICE, OR SYSTEM.
    3. 3. TODAY’S CLASS Goaldirected Design 4
    4. 4. User Research Personas Scenarios Task Analysis Use Cases Feature Design
    5. 5. Advanced Barbies for Design Excellence PERSONAS & SCENARIOS
    6. 6. “A persona is a user archetype you can use to help guide decisions about product features, navigation, interactions, and even visual design.” - Kim Goodwin, Cooper
    7. 7. Personas bring users into focus
    8. 8. WHY DO WE HAVE THEM?
    9. 9. The average user doesn’t exist. We can‟t design for everyone But maybe we can get it right for the right people
    10. 10. But you can play one on TV YOU ARE NOT THE USER
    11. 11. Empathy & Insight
    12. 12. To remember all that research MNEMONIC
    13. 13. Personas are a representative behavior and activity profile for a customer base.
    14. 14. Personas From CarbonIQ , circa 2000
    15. 15. FOR EXAMPLE
    16. 16. Grace (62/ female/ widowed/ Little Rock, AR.) “I like playing my favorite games online, but if I can play with friends, well that‟s even better!” Personal Background: Her husband has passed on. She has two grown kids, both of whom live far away. She misses the kids, but has a fairly large circle of friends that she spends time with. Technical Proficiency Profile: Limited. Can use her browser and her email. MS Word confuses her, and she doesn‟t like using it. Doesn‟t know what an OS is. Tends to click yes if the browser prompts her to do anything, and will click wildly until things work. History with Shockwave and/or AtomFilms: Plays crossword puzzles daily and saves them. Plays card games, PhotoJam, but is offended by South Park cartoons Shockwave‟s opportunity: If Grace can be convinced to participate in community activities, she will become a loyal user of the site. She needs to be sheltered from the sick and twisted content, however.
    17. 17. Sarah (22/ female/ single/ Washington, DC.) “I like AtomFilms because it‟s just about the films” Personal Background: Liberal arts education at college in the Midwest Just graduated and moved to DC. Has a dog Likes music and art. Went to Lilith Fair. Sends out mass emails about causes she cares about, or jokes. Profession: Editor for non-profit organization ($35K/yr) History with Shockwave and/or AtomFilms: First came to AtomFilms because she did a search on Sundance content. She‟s heard about the merger with AtomFilms, and is very worried about AtomFilms losing its edge, or begin buried in the Shockwave.com site. She thinks some controversial material might be hidden if AtomFilm gets merged with Shockwave. Shockwave‟s opportunity: If Shockwave can prove they are trustworthy enough to coax her into signing up, she will become a loyal visitor and shortlist subscriber. If she feels clicking through ads will help Shockwave support independent film, she will.
    18. 18. Scott (17/ male/ single/ Shaumburg, IL.) “I want something cool and really on the edge. Something you can‟t get on TV” #2 most common user Profession: Full time student (studies exercise and sport science) Personal Background: Youngest kid in family of five. Likes to be seen as a little rebellious. Excited to be in college, but not really brave enough yet to actually do anything rebellious, so uses Internet to express his self-image. History with Shockwave and/or AtomFilms: he‟s been to Shockwave a few times, and usually clicks games as soon as the navigation bar loads. He likes playing arcade games, and “shoot „em up‟s.” Spend two hours playing “King of the Hill paintball” recently. Shockwave‟s opportunity: he is already hanging out in the games section regularly. If shockwave can introduce him to it‟s sick and twisted material, it can keep him on the website longer, and use his tendency to send out links to spread the word.
    19. 19. Persona development ‣ How to create: • Summarize findings, distribute to stakeholders. • Hold a work session with stakeholders & development team to brainstorm personas. • Prioritize and cull lesser personas to develop primary and supporting personas.
    20. 20. Sort your findings Specific: Each piece of information should be as precise as possible. Throw out information like, “Users like it to be easy,” and keep information like, “Users need to be able to complete a process in half an hour.” Relevant: Relevant to your product, not to every site on the Web. Don‟t report, “Users like free stuff,” but include, “Many users request free evaluation periods for software to know if paying will be worth it.” Universal: Find things that are true for the entire site, not for a single item on a single page. Weed out things like, “Users couldn‟t find the Submit button on the checkout page,” but leave in, “We have a type of user who knows what he wants already and needs a way to speed through finding and buying.”
    21. 21. Specific: Each piece of information should be as precise as possible. Throw out information like, “Users like it to be easy,” and keep information like, “Users need to be able to complete a process in half an hour.” Relevant: Relevant to your product, not to every site on the Web. Don‟t report, “Users like free stuff,” but include, “Many users request free evaluation periods for software to know if paying will be worth it.” Universal: Find things that are true for the entire site, not for a single item on a single page. Weed out things like, “Users couldn‟t find the Submit button on the checkout page,” but leave in, “We have a type of user who knows what he wants already and needs a way to speed through finding and buying.” Write out everything you can think of that you observed on post its 5 MINUTES
    22. 22. Write out age(s), genders, ethnicities and other demographics 1 MINUTE
    23. 23. Make pseudo-people 10 MINUTES GROUP TOGETHER LIKE
    24. 24. SHARE
    25. 25. Start adding depth to the personas ENRICH
    26. 26. Frequency of Use Weekly ? Daily All the time?
    27. 27. Capability Computer and IT experience Novice Expert
    28. 28. Examples Eats lunch at desk each day Eats out with clients Eats lunch with team
    29. 29. Examples New dad, shares photos daily Family archivist Avoids grandparents
    30. 30. Examples Can find browser if pressed Excel whiz Writes own SQL queries
    31. 31. From Todd Warfel‟s Persona Talk http://www.slideshare.net/toddwarfel/data-driven-personas
    32. 32. CREATE DETAILS
    33. 33. [Persona’s name] [A tag line for the persona] About [Name] • Who are they? • What is their background? • What is their context? • What’s important to them? • What are their pain points and frustrations? A picture or photo of the persona “A quote the persona might say” Key goals & needs • Goals • Motivations • Drivers • Needs From An introduction to personas for technical authors by Neil Turner http://www.slideshare.net/neiljamesturner/an-introduction-to-personas-for-technical-authors
    34. 34. They can be simple
    35. 35. You can make them very fancy From Todd Warfel‟s Persona Talk http://www.slideshare.net/toddwarfel/data-driven-personas
    36. 36. SANITY CHECK
    37. 37. Do I know people like this? ARE THEY REAL?
    38. 38. Is it worth targeting them? Do I have information I can use to make decisions? ARE THEY USEFUL?
    39. 39. Have a made a dream user that isn’t common? ARE THEY TOO USEFUL?
    40. 40. ROLE PLAY
    41. 41. REFINE FURTHER
    42. 42. Prioritize personas
    43. 43. Prioritization of Personas is essential To assure that design decisions don't become generic in the face of too many audiences ‣ To allow for prioritization of research efforts ‣ to Create another filter by which feature level prioritization can occur ‣
    44. 44. secondary primary special
    45. 45. secondary primary special
    46. 46. Names Matter Think of your persona as a brand ‣ People are more likely to remember a memorable name e.g. ‣ Phoebe the photographer ‣ Stuart the student ‣ Enrique the engineer ‣ Think memorable, but believable! ‣
    47. 47. Photos of real people Toby The Cambridge new comer About Toby (28) • • • • • Currently lives in Cambridge with his girlfriend Moved to Cambridge from London 6 months ago Is an English & drama teacher at a Cambridge high school Is keen on making some new friends in Cambridge Uses the Internet most days and will use email and Facebook to keep in touch with friends “I use the Internet for everything” Key goals & needs • To know where places are • To find out what is going on locally • To make new fiends From An introduction to personas for technical authors by Neil Turner http://www.slideshare.net/neiljamesturner/an-introduction-to-personas-for-technical-authors
    48. 48. Choose thoughtfully ‣ A person photo should be: ‣ ‣ A head shot ‣ Natural, not too staged ‣ ‣ A good size Royalty free Some good websites for finding photos are: ‣ Flickr ‣ Stock.xchng ‣ Fotolia ‣ Bad: watermark, staged, and he’s kinda slimey Google images Good: real person, and easy to like and want to help
    49. 49. EXERCISE: ADD DETAIL
    50. 50. TIPS AND TRICKS
    51. 51. Keep Alive I’m worried about Sandy. Can she use the profile?
    52. 52. Omit needless words Only include information that is important when it comes to designing for that person ‣ Throw away any superfluous information (unless of course it impacts the design) e.g. ‣ Their favourite film ‣ What car they drive ‣ Who their best friend is ‣
    53. 53. Don‟t reinvent for every project
    54. 54. Use personas ‣ Keep them near • • • • Hang them on your wall Make poster, placemats, puppets Role-play personas Evaluate with them
    55. 55. From Steve Mulder‟s The User is Always right http://www.slideshare.net/MulderMedia/the-user-is-always-right-making-personas-work-for-your-site
    56. 56. From Todd Warfel‟s Persona Talk http://www.slideshare.net/toddwarfel/data-driven-personas
    57. 57. THE PROBLEM WITH PERSONAS
    58. 58. I‟ve never been a big believer in personas. They‟re artificial, abstract, and fictitious. I don‟t think you can build a great product for a person that doesn‟t exist. And I definitely don‟t think you can build a great product based on a composite sketch of 10 different people all rolled into one (or two or three)
    59. 59. Personas Don‟t “ Personas don’t talk back. Personas can’t answer questions. Personas don’t have opinions. Personas can’t tell you when something just doesn’t feel right. Personas can’t tell you when a sentence doesn’t make sense. Personas don’t get frustrated. Personas aren’t pressed for time. Personas aren’t moody. Personas can’t click things. Personas can’t make mistakes. Personas can’t make value judgments. Personas don’t use products. Personas aren’t real.
    60. 60. SCENAROS
    61. 61. User Research Segments Personas Scenarios Task Analysis Use Cases Feature Design
    62. 62. Pick a persona What is that’s personas GOAL for using your product? Tell their story. The most perfect, magical story of them using your software and everything is good. All of life’s hurdles are overcome with your product. No buttons, no errors. No design yet. A software that works.
    63. 63. Steve Mulder’s Advice 65 Set the scene. ‣ Where are they? What is the situation? ‣ Establish the goal or conflict. ‣ What worries them? What is the dream? ‣ Overcome crises along the way. ‣ What are the kind of hurdles on usually run into? ‣ Achieve resolution. ‣ How will your software save the day? ‣ Reach denouement. ‣ Then what? How do they leave? ‣
    64. 64. 66 Add business constraints in Keep the story as positive as possible Add in log in/registration Add in check out Bring business and the user goals together Resolve tensions
    65. 65. From Steve Mulder‟s The User is Always right http://www.slideshare.net/MulderMedia/the-user-is-always-right-making-personas-work-for-your-site
    66. 66. 68 ADJUST FOR FREQUENCY
    67. 67. 69 Daily-Use Scenarios Usually only 2-3 of these Clear training, quickly removed Shortcuts & power tools Customization Tell the story of the 300th use as well as the 1st NOT ALL APPS HAVE DAILY USE
    68. 68. 70 Infrequent, Common Scenarios Users do it only once in a while Many users do it – core to business Expected to “just work” Users unlikely to pay close attention Needs excellent unobtrusive help Will be taught each use
    69. 69. 71 Necessary-Use Scenarios Must be done, but aren’t done often User needs to get right, be comfortable it works Changing printer cartridges, clearing memory, fighting a virus, visiting a potentially infected website, deleting a lot of files Must have good help/pedagogy Must have excellent error handling No need for customization or shortcuts
    70. 70. 72 Edge-Case Scenario Unusual situations Programmers must handle, or code will not work Design can largely ignore beyond quick fixes. Work on last (or not at all)
    71. 71. 73
    72. 72. 74
    73. 73. Exercise: Revise your scenarios. Add new ones. 75 Daily? Common Infrequent?
    74. 74. 76 COMMUNICATING SCENARIOS
    75. 75. When Stan is out of the office and working at a client’s location, the last thing he feels like doing at the end of a long day is entering his hours into his company’s time tracking tool. So he usually puts this off until Friday and 77 then grimaces to himself at 6:00 as he launches the VPN tool, logs in, and then points his Web browser to the intranet home page. Fortunately, there’s a link to the time tracking tool right on the home page, along with other commonly used tools. Once in the time tracking tool, he’s happy to see that it remembers his activities from the previous week, so all he has to do is enter new hours for this week for the same activities. He started a new project this week, so he clicks New Project and selects his client from the list that appears, then easily enters his hours. Soon he’s finished, and what used to take a half hour now takes ten minutes. He glances at the total to make sure all the hours are there, then clicks Submit. After the confirmation message appears, the Web browser redirects Stan to the intranet home page, where he immediately notices that yesterday’s company presentation is now available. He missed the meeting, so he quickly downloads the presentation to look at while he’s on the flight home tomorrow. While it’s downloading, he sees from a dashboard on the home page that the company message board has come to life with a discussion about what Web 2.0 means to the business. He can’t resist clicking to see what Riccardo has to say on this topic, and before he knows it spends 15 minutes reading various posts. He even posts a quick URL of a Google Maps mashup he just found.
    76. 76. Storyboards 78 ‣ Kim Goodwin, Designing for the digital age
    77. 77. Comics 79 Kevin Change, See What I Mean
    78. 78. 81
    79. 79. 82 Emotion matters, but it isn’t hard to communicate! (from Kevin Cheng’s See What I Mean)
    80. 80. 83 You can show time passing…. (from Kevin Cheng’s See What I Mean)
    81. 81. Can’t draw? 84 Stick figures! Photos! Clipart!  Philgreg.tv  Boxesandarrows.com t Kevin Change, See What I Mean
    82. 82. Regardless of how you present them, what you want to leave with is a clear idea of what requirements and features you have. 85
    83. 83. TASK ANALYSIS & USE CASES
    84. 84. User Research Segments Personas Scenarios Task Analysis Use Cases Feature Design
    85. 85. Task analysis Can be used to ‣ Understand current behavior ‣ Optimize current behavior ‣ Design for new behavior In Designing you ‣ Break down a story into discrete tasks ‣ Identify branching decision points
    86. 86. Why the user is performing the task (that is, the underlying Task Analysis during Research goal) Frequency and importance of the task Cues — what initiates or prompts the execution of the task Dependencies — what must be in place to perform the task, as well as what is dependent on the completion of the task People who are involved and their roles and responsibilities Specific actions that are performed Decisions that are made Information that is used to support decisions What goes wrong — errors and exception cases How errors and exceptions are corrected
    87. 87. From a McDonald‟s patent application on sandwich making
    88. 88. 9 3 How to Design TASK ANALYSIS
    89. 89. Scenario: Picking films to see Persona: Michael From Information Architecture: Blueprints for the Web by Christina Wodtke Festival Planner asks Michael if he’s interested in any particular directors or actors. Michael indicates people he thinks have promise. He notices some names he doesn’t know and reads short bios of them. He adds a couple to watch. He notices he can save this information by simply adding his email address and a password. He decides he really ought to because he’s put in a bit of effort at this point. He’s pleased it didn’t ask him for any more personal information; he gets so tired of typing in this and that for registration on every site he comes across. Festival Planner next asks him if he’s interested in any particular genre of film and if he’s traveling for business, pleasure, or both. The Planner asks him if he’s interested only in films that haven’t been signed to a distributor, or if he’s interested in all films. He indicates that he’s interested only in unsigned films. Finally, Festival Planner asks him if he’s willing to see overlapping films, or if he wants the planner to make sure his films dovetail. Michael would rather see complete films, but this is a business trip. He sighs and picks overlap. Festival Planner now gives him a schedule to review, with three films to pick from and an option to “see all for this time slot.” One film for each time slot is indicated as his “best pick.” Each shows how well it meets his taste and needs. Or he can choose to “rest” and not select a film for that time period. Michael goes through the schedule. His wristwatch beeps, and he absent-mindedly shuts it off. He continues to select his films. As he chooses films, he notices an option to get a report on any film when it’s available—he’s very excited by that. If he can’t see them all, at least he can get a sense of what he’s missing!
    90. 90. 9 5 HIGHLIGHT YOUR VERBS
    91. 91. Goal: Michael wants to quickly set up 1. Understand how it works. a schedule for Sundance. 2. Choose films of interest. 9 3. Select film state of availability (signed, unsigned). 6 4. Select film scheduling (dovetail or overlap). 5. View recommendation. 6. Select films of choice. 7. Sign up for reports. 8. Save work (available in previous steps). 9. Email schedule. From Information Architecture: Blueprints for the Web by Christina Wodtke
    92. 92. 9 7 PULL OUT THE STEPS
    93. 93. Goal: Michael wants to quickly set up a schedule for Sundance. From Information Architecture: Blueprints for the Web by Christina Wodtke Next: Break down into subtasks 2. Choose films of interest. a. Select directors of interest. b. Select actors of interest. c. Select genres of interest. 9 8
    94. 94. 9 9 FIND SUBTASKS
    95. 95. Goal: Michael wants to quickly set up a schedule for Sundance. From Information Architecture: Blueprints for the Web by Christina Wodtke 1 0 0
    96. 96. 1 0 1 TRY A SKETCH
    97. 97. Visual Vocabulary A simple, useful set of shapes to communicate interaction and hierarchy, used for both flows and sitemaps. 1 0 2
    98. 98. From Jesse James Garrett’s Reverse engineered Yahoo Mail 1 0 3
    99. 99. 1 0 4
    100. 100. Exercise REVERSE ENGINEER A COMPETITOR
    101. 101. User Research Segments Personas Scenarios Task Analysis Use Cases Feature Design
    102. 102. A use case from our task analysis Use cases This is just more formal and careful documented task analysis, useful to programmers. It covers both the dream scenario, but also any issues inherent in the actual system. Both user AND system behavior is outlined. Used in specifications documents. Often written by product managers… but is that a good idea? From Information Architecture: Blueprints for the Web by Christina Wodtke
    103. 103. First, name all your use cases (or user stories, or scenarios) (you can get these from your sitepath/system diagram or AOF)
    104. 104. Example: Log in Use Case Login Brief Description This use case describes how a user logs into the Course Registration System. Basic Flow This use case starts when an actor wishes to log into the Course Registration System.The system requests that the actor enter his/her name and password. The actor enters his/her name and password. The system validates the entered name and password and logs the actor into the system. Alternative Flows Invalid Name / Password If in the Basic Flow the actor enters an invalid name and/or password, the system displays an error message. The actor can choose to either return to the beginning of the Basic Flow or cancel the login, at which point the use case ends. Pre-Conditions None Post-Conditions If the use case was successful, the actor is now logged into the system. If not the system state is unchanged. Next, break it into its component tasks. List expected series of task first, then list all the scenarios for when things go wrong under “alternate.”
    105. 105. I prefer the two column approach, with user on one side, system on the other. Note: I do not say “pushes button.” or the like anywhere: save interface design for late, just focus on interaction User User inserts card Requests PIN User enters Pin Break it down System Displays choices 1. Get balance 2. Withdraw money 3. Make deposit (1) User selects Get Balance Displays current balance (2)User selects withdraw money System ask the user for an amount User enters an amount Systems checks balance. If < balance, asks for confirmation
    106. 106. Example user stories. And User Stories? Agile, Short, can be tested, no design indicated Stakeholders write user stories. Use the simplest tool. Remember non-functional requirements. Indicate the estimated size. Indicate the priority. Optionally include a unique identifier. • Students can purchase monthly parking passes online. • Parking passes can be paid via credit cards. • Parking passes can be paid via PayPal ™. • Professors can input student marks. • Students can obtain their current seminar schedule. • Students can order official transcripts. • Students can only enroll in seminars for which they have prerequisites. • Transcripts will be available online via a standard browser.
    107. 107. Can task analysis and use cases limit? If I ask you to make a vase you might come up with a vast number of variations of form, but it would mostly look like one of these
    108. 108. Design a way to enjoy flowers But if I ask you to think of a way to enjoy plants and flowers?
    109. 109. And laws and guidelines PRINCIPLES
    110. 110. SOME LAWS
    111. 111. Fitts‟s Law Fitts‟s Law simply states that the time it takes to move from a starting position to a final target is determined by two things: the distance to the target and the size of the target.
    112. 112. The Magical Number Seven +- 1 Is a myth
    113. 113. Law of the Conservation of Complexity states that some complexity is inherent in every process. There is a point beyond which you can‟t simplify the process any further; you can only move the inherent complexity from one place to another. Larry Tesler
    114. 114. Universal Principles Direct Manipulation Affordances Feedback Mental Model Standards Poka-yoke
    115. 115. Direct Manipulation
    116. 116. Affordances
    117. 117. Feedback
    118. 118. Feedback
    119. 119. Feedback
    120. 120. Discuss Do you need a message? Is it enough it always shows? What if technology doesn‟t allow it to be on top (more recent, etc) Should you force it there to make sure user knows its posted?
    121. 121. Inline feedback vs validation: Luke Wrobowski http://alistapart.com/article/inline-validation-in-web-forms Traditional Inline
    122. 122. Feedback Matters Inline feedback gave: • • • • • a 22% increase in success rates, a 22% decrease in errors made, a 31% increase in satisfaction rating, a 42% decrease in completion times, and a 47% decrease in the number of eye fixations. Inline Validation in Web Forms by LUKE WROBLEWSKI September 01, 2009 “You‟d rather know about your mistakes as you go along.” “It‟s much better than getting all the way down and hitting „submit,‟ only to find out that it doesn‟t like your username. It‟s much better when it tells you as you go along.”
    123. 123. The Poka-Yoke Principle Poka-Yoke roughly translates in English to mistake proofing: avoiding (yokeru) inadvertent errors (poka). Designers use Poka-Yoke when they put constraints on products to prevent errors, forcing users to adjust their behavior and correctly execute an operation.
    124. 124. Errors Prevent Allow fixes COMPASSION Avoid learned Dismissal
    125. 125. Standards "Obey standards unless there is a truly superior alternative" - Alan Cooper
    126. 126. Contextual Principles What you know about the context/users/activity. E.g. ‣ Recipes must be scannable ‣ User should know where they are in a recipe ‣ Recipes allow users to find ingredients for shopping and mise en place by listing them apart from instructions You make them up
    127. 127. Tivo Tennants It‟s entertainment, stupid. It‟s TV, stupid. It‟s video, dammit. Everything is smooth and gentle. No modality or deep hierarchy. Respect the viewer‟s privacy. It‟s a robust appliance, like a TV.
    128. 128. WHAT ARE YOUR LAWS?
    129. 129. HEADER Q&A 1 3 7
    1. A particular slide catching your eye?

      Clipping is a handy way to collect important slides you want to go back to later.

    ×