Design Thinking Synthesize and combine new ideas to

create the design SWEN-444

Selected material from The UX Book, Hartson & Pyla

“HCI Design”

•  Three design paradigms (patterns of thinking) •  Engineering – focus on design for HCI usability performance

achieved through evaluation and iteration •  Human Information Processing (HIP) – cognitive science based

design model of human mind as information processor •  Design-Thinking – consider emotional and phenomenological,

social and cultural aspects for the UX

Example – Car Design •  Engineering view – features (cruise control),

performance (fuel economy), human factors (airbags) •  HIP view – optimal use of human senses (position of

instruments, use of no look tactile cues) •  Design thinking view – cool factor, joy of driving, life style

considerations, pride of ownership

Phenomenology •  Philosophical study of experience and consciousness

about things that happen and can be observed (phenomenon) •  Not logical deduction or reflection … •  rather individual intuitive understanding

•  For HCI – the emotional impact of an interactive relationship with a product as part of our lives

•  Technology ubiquity shifts the UX emphasis from efficiency to presence •  Meaning in life

iPhone Android

Design Thinking •  Creative and innovative UX design concept first

•  Combination of art, craft, science, invention •  Followed by functional and interactive design •  Long term emotional impact •  Aesthetics •  Social and value oriented interaction •  About situated interaction – the importance of place •  How technology takes on “presence” in user’s life •  May be market driven (think Apple)

Design Perspectives •  Filters to guide design thinking •  Ecological perspective

•  How the system interacts with its external environment •  How work gets done in context of system infrastructure

•  Interaction perspective •  How users operate the system – task orientation

•  Emotional perspective •  Emotional impact •  Social, cultural implications •  Aesthetics and joy of use

Plutchik's Wheel of Emotions

Basic Emotions

Personas - a Pretend User •  A specific (but imaginary) person in a specific work role;

a personification •  Make design thinking more concrete

•  User roles are too broad – can’t satisfy everyone •  Focus and satisfy one “person”

•  Minimize designer bias to design for their own needs; engage designer empathy

Personas – a Pretend User •  Represent a class of users

•  Composite user archetypes based on behavioral data gathered from many actual users

•  Aggregate patterns of behavior •  Specific work or lifestyle related roles

•  Using personas in design … •  Select a small number of personas from the user class •  Pick one as primary and design for that one •  Adjust as necessary to accommodate the others

Persona Characteristics •  Domain and system specific – not reusable •  Characterize ranges of behavior, not averages •  A cast of personas representing different clusters of behaviors •  Personas have goals •  They engage the empathy of stakeholders and designers toward the

target user •  Make decisions based on the cognitive and emotional dimensions of the

persona •  Note the power of fictional characters in television programs, movies,

and novels

Personas are Based on Research •  Personas are typically based on synthesizing the

qualitative results of ethnographic interviews and observations

•  Market segmentation models and research data (personas are a common marketing research tool)

•  Plus other sources of elicited information – interviews, surveys, literature research

•  Requires both detailed analysis and creative synthesis

Constructing Personas •  Establish a persona hypothesis •  Segment use across a set of observed behavioral variables (also

called axes or ranges) •  E.g., computer literacy, annual income

•  Identify significant behavior patterns •  Clusters of users with shared behavior across multiple behavioral variables (6-8) •  Valid patterns demonstrate logical or causative relationships between clustered

behaviors •  Combine one of more patterns into a persona role •  Synthesize persona characteristics and relevant goals •  Review for completeness and distinctiveness

Map Interview Subjects to Behavioral Variables

•  Map users against each variable range that applies

•  Relative placement is more important than precision •  Looking for clustering of multiple subjects on each variable axis

[Cooper and Reimann]

15-30 Variables per role is typical

Service-oriented Price-oriented

User 3 User 2 User 1,4,5

Necessity Only Entertainment

User 1,4 User 5 User 3 User 2

Patterns: •  User 1 & 4 •  User 3

Let’s Go Shopping! Behavioral variable

Synthesize Characteristics •  Give each major pattern a brief description, such as "the bargain-

hunter" or "the impulse-buyer" •  Synthesize details from the data

•  Describe use environment, typical workday (or other relevant time period), current solutions and frustrations, relevant relationships, etc.

•  Stick to observed behaviors •  Avoid too much fictional, idiosyncratic biography •  A persona is a design tool, not a character sketch for a novel

•  Carefully select a first [and last] name for the persona •  Evocative of the type of person the persona is

•  Add some demographic information: age, geographic location, relative income (if appropriate), job title

Example Persona •  Digital Camera users:

•  Alice “Conservative Sharer” •  Female, married, children, ages 25-54 •  Takes 250-500 snapshot photos a year •  Image quality is not a high motivator •  Subjects include family, schools events, and vacations •  Computer literate •  Occasional user of social networking sites for photo sharing •  Prints 10% of all photos

Ideation •  Collaborative group process for forming conceptual

design ideas; i.e., “applied design thinking” •  Idea creation •  Idea critiquing – review and judgment

•  Brainstorming •  Team activity •  Stream-of-consciousness •  Generate as many ideas as possible •  Don’t be critical of or constrain creativity

•  Brainstorming sessions generate a lot of material that must be filtered and organized •  Categorize, sort, vote

Dissent •  An alternative to brainstorming •  Participants encouraged to criticize ideas •  Criticism surfaces problems that forces new thinking to

respond •  Produces more productive and innovative ideas

BLACK BOX THINKING: Why Most People Never Learn From Their Mistakes—But Some Do by Matthew Syed

Semantic Networks •  Represent information the way your brain stores it:

•  Concepts •  Associations

•  Visually organize your thoughts through a combination of drawing and text

•  Sketch diagrams to replace words and trigger easier memory recall

•  Useful for grouping related items, building menu structures •  Use for note taking, planning, summarizing, exploring

ideas

Examples of Semantic Networks •  Mind maps

•  Words, ideas, tasks, or other items linked to and arranged around a central key word or idea

•  Used to generate, visualize, structure, and classify ideas •  See http://www.mindjet.com

•  Fishbone diagrams •  Cause and effect diagrams •  Categorize causes contributing to an effect or problem •  Primary and secondary causes

Mind Map Example

Fishbone Diagram Categories

Sketching •  Rapid creation of freehand drawings

•  Expressing preliminary design ideas •  Focusing on concepts rather than details

•  Reinforces design thinking, augments communication •  Explore and expand design ideas •  Sketches are not prototypes •  They are abstract, incomplete, not artistic, disposable,

fast, annotated

“Overfitting” •  In computer science, pursuing complex models not

supported by detailed data •  By analogy, in UX design, to start keep it simple, avoid

complexity •  Don’t over design in the beginning, iterate