Scenario-based DesignIrene Rae

Computer Sciences

CS-570 Introduction to Human-computer Interaction

Why Use Scenarios?

Descriptions of people using technology are essential for discussing and analyzing how the technology is (or could be) used to reshape their activities.

Scenarios can be created before a system is built.

Scenarios are rapid-rapid-prototypes of the whole experience.

Common Uses of SBD

Interface design

Software engineering

Also called “Requirements Elicitation”

Marketing and advertising

Architecture

Increasingly in many other areas

Scenarios & The Design Process

Problem Scenarios

Design Scenarios

Usability Specifications

Activity Scenarios

Personas + Scenarios

Scenario-Based Design

Personas

What is a Persona?

An archetypal character meant to represent a group of users who share common goals, attitudes, and behaviors when interacting with a particular product or service.

DemographicsEducationIncomeTechnological experienceJob descriptionGoalsNeeds

DesiresTypical workdayCurrent solutions and frustrationsCommon activitiesLikes and dislikesHobbies and interests

Answers the question:

“Who are our users?”

Goals, Attitudes, and Behaviors

Personas should be driven by a goal or a cluster of goals.

Explicitly stated goals:

What is a good or bad day?

What are the most important things you do?

If it were magic, what would it help you to do?

Inferred goals:

How are people behaving currently?

What are they trying to accomplish?Cooper et al., 2007

Persona Goals

Each persona should capture user goals at varying levels:

Life goals – personal aspirations

E.g., “Would like to retire before the age of 50”

Experience goals – how the user wants to feel while using the product

E.g., “Would like to feel organized and know what to do next”

End goals* – tangible outcomes of using the product

E.g., “I want to see e-mail and Facebook messages in one display”

* Most helpful to designers

Creating Personas

Step 1. Collect data about users

Step 2. Segment the users

Step 3. Develop archetypal characters

Step 1. Collect Data

Personas should come from real data from users

Data should be collected to answer the question: “Who are our users?”

Should help us identify range of behavioral patterns, environmental factors, constraints

Step 1. Collect Data

Data can be of any type:

Qualitative data from ethnographies, observations, and interviews with real users-- Cooper et al. 2007

Quantitative data from large scale surveys, pre-existing studies, marketing & customer support reports-- Mulder & Yaar, 2007

Logical categorizations based on the target audience, expert users, opportunity users

Step 2: Segment Users

Analyze data to identify emerging categories of users

Focus particularly on groupings based on user goals or motivations for technology

Multiple methods are available:

Exploratory statistics

Qualitative data analysis (e.g., affinity diagramming)

Why Buy a Mobile Device?

Step 3: Create CharactersRepresent each segment with an archetypal character

1. Find an archetypal image (picture/abstract character)

2. Give the persona a name (first name starting with the first letter of the segment)

3. Describe user goals related to the product (presented as a quote)

4. Describe user end goals

5. Create a bio and describe personal information that affects usage

Warnings!

Personas are not stereotypes!

Stereotypes may be formed by prejudices, cultural, and historical factors

Personas are not the same as roles!

Roles, e.g., parent, doctor, programmer; form very broad categories

People with the same roles may have very different goals and needs

Persona Examples*

* Todd Zaki Warfel

Questions?

Scenarios

What are Scenarios?

A story that describes an activity that a user or group of users may perform.

“A narrative description of what people do and experience as they try to make use of computer systems and applications.” – Carroll

Answers the question:

“What is the product experience?”

Scenario Characteristics

Described from the user’s point of view and captures aspects of the user’s goals and needs.

Concrete descriptions of a user interacting with a system in a work-driven manner, focusing on a particular path that the user takes.

Does not include implementation details, but may include details of the workplace environment, socio-cultural situation, and constraints.

Personas in Scenarios

Personas are the actors in each scenario and provide the motivation, constraints, knowledge, and other details about the users performing the actions in the scenarios.

Scenarios describe a persona’s goal-driven behavior when interacting with the system.

What Do We Do With Them?

Use to communicate ideas to other designers

Describe design specifications to clients

Evaluate ideas with users

Other creative uses

Kinds of Scenarios

Problem (or “as is”) scenarios

Activity scenarios

Design scenarios

Visionary scenarios

Evaluation scenarios

Training scenarios

Problem Scenarios

Tell stories of current practice.

Carefully developed to reveal aspects of the stakeholders and their activities that have implications for design.

Activity Scenarios

Introduce concrete ideas about new functionality, new ways of thinking about users’ needs and how to meet them.

Design Scenarios

Specify representations of a task’s objects and actions that will help users perceive, interpret, and make sense of what is happening

Visionary Scenarios

Describes a future system

Often used in greenfield or interface engineering projects

Visionary scenarios are often not done by the user or developer alone

Evaluation Scenarios

Description of a user task against which the system is to be evaluated

Training scenario

A description of the step by step instructions that guide a novice user through a system

Example 1

TopHat Question

Example 2

TopHat Question

Questions?

Steps to Creating Scenarios

Start with your persona, generate scenario ideas based on tasks the user would do.

Example tasks types:

Orienting phase

Searching behavior

Opportunistic behavior

Problem solving/error recovery

Customization and personalization

Scenario Tips

Reflect and act at the same time.

Don’t get locked into a premature design.

Don’t get carried away by gizmos/stuck in a rut.

Think about the unintended consequences of your design.

Accept that you’re often working without science.

Reflection

Reflect and act at the same time

Design reflection (reviews/evaluations) often occur after the design action (or in iterative feedback cycles)

Scenarios should:Implicitly evoke reflection by raising questions and evoke planning and redesign action.

Be coordinated with each other and be used during the design action stage, not just prior or after action.

Commitment

Committing to a design early reduces uncertainty in a constantly changing world but strangles innovation.

Scenarios should:Be deliberately sketchy so they’re flexible and allow further innovation.

Allow designers to think concretely and get directive feedback.

Have vivid names.

Consequences

Think about unintended consequences

With scenarios:

Use multiple perspectives on the same scenario to consider consequences to other users/parts of the system.

Make causal relationships between scenarios explicit.

Questions?

Scenario Presentation

Formats

Scenario Presentation

Scenarios

Written accounts & narratives of the user’s experience

Analogy: Books

Storyboards

Visual storytelling with rough sketches/cartoons

Analogy: Comics, picture books

Video Scenarios/Storyboards

Richer visual storytelling

Analogy: Movies/TV

Written ScenariosAllows the user to imagine themselves in a given situation

Similar to books, imagination plays some role

This is good and bad

Good for engagement

Bad for specifics

Use personas as characters to help with empathy

They should be fully developed

Narrative Scenarios

“John wants to take notes while in class. Even though the slides will be posted online later, he wants to make sure that he captures the most important points. Before the professor starts the lecture, he starts the note-taking application on his phone. The application automatically notes the current date, time, and class. During the class, he can press one of two buttons to start recording audio or to take a picture. After recording, the application allows him to tag the recording with keywords. Later, when he is home, he can review his notes, synchronized with the powerpoint slides downloaded from the course website. He can search by keyword, follow the lecture linearly, or fast-forward in time.”

Video Scenarios

Similar to written ones, but acted out and filmed

Advantages

Can be more engaging

Specifics/prototypes are shown more easily

Disadvantages

Requires actors

Much more difficult to create

May be harder for people to relate to

Video

Storyboarding

Very similar in nature to comic art and cartoons

Used in movies, multimedia design, product and software development

How Are Storyboards Done?

Determine the story

A very iterative process through a lot of initial drafts

Includes a lot of brainstorming

Start with a scenario and break into logical segments

Sketch with pen and paper

Generate more polished art for presentation

Storyboarding

ChallengesDetermining what to draw is hard

Drawing is difficult!

How is it presented? (time, length, attention)

UsefulnessIf done right, can help gain quick invaluable user feedback on early ideas

Quicker/easier than building the whole application or a prototype

Elements of a Storyboard

Five visual elements

1. Level of detail

2. Inclusion of text

3. Inclusion of people & emotions

4. Number of frames

5. Portrayal of time

* Truong et al. 2006

Guideline 1: Detail

Too much detail can lose universality

Guideline 1: Detail

Guideline 2: Text Use

Often necessary, but keep it short:

Guideline 3: People & Emotions

Include people experiencing the design and their reactions to it (either good or bad)

Remember — the point of storyboards is to convey the experience of using the system.

Guideline 4: Number of Frames

4-6 frames/panes is ideal

More is not always better.

May lose focus of story

May lose reader’s attention

What this means:

Less work on the designer

Must be able to succinctly tell story

Guideline 4: Number of Frames

Guideline 5: Time

Only use it if necessary to understand the story:

Photo Storyboards

Drawing is hard — it doesn’t have to be drawn!

Photo Storyboards

Use Photoshop “cut outs” or other tools to show screens

Photo Storyboards

Grab images from other sources:

Questions?

Thursday

Hands-on Activity to create storyboards

Can use as a work session to get immediate feedback on scenarios for Assignment 2