Design Thinking

Some thoughts on Design, Design Research, Interaction Design and Process

Daniel Stillman@dastillman

If I had 20 days to solve a problem, I would take 19 days to define it.

Albert Einstein

Product

Design

What I do: Design Products

Product

Design

Intent

What I (really) do: Drive Intent.

Product

Design

Research and

StrategyIntent

The core of what I do: Find and Create Strategies.

Product

Design

Research and

StrategyIntent

Product with a Brain

Those strategies impact a wide variety of products.

Product


Design

Interaction Design

Research and

StrategyIntent

Another Hat: Interaction Designer, thinking about people.

Product


Service

Design

Interaction Design

Research and

StrategyIntent

Research and Strategy is the heart of Total Product Design.


Service

Total Product Design: Products with Brains are everywhere, wrapped up in Services. Google strove to design the software and hardware for the N1, from the ground up.


Service

Fewer and fewer products stand alone without an interactive component, driving their usage.

What I do: use lots of tools

In-field Observations

Home Interviews

Exec. Strategy Session

Lead User Workshops

Online Surveys

Expert Interview Consumer Focus Groups

Visit to Product Purchase Site

Industry Trend Projections

Expert Panel Workshop

Competitive Benchmarking

Qualitative Tools

Quantitative Tools

Analyze & Revisit

Exploratory Tools

Lifestyle Mode Mapping

What I do: Run workshops with designers and stakeholders

What I do: Run workshops (where we play with stickers)

What I do: Go places and watch people

Me people

What I do: learn about a process

Sometimes you see something crazy.

MeGuy testing suction

with his face

What I do: Think about Process and Flow

from swiss misshttp://ow.ly/11WJW/

What I do: Find Key User Values (and make word clouds)

What I do: Tell stories about Products and Users(we forget facts and remember stories)

Up at 6:45

GetReady

7:30am – 4:20pm Kids all at school4:20 – 7:00pm

Snack and Homework

Entertainment& Family Time

(TV / Computer)

Bed 9:00

AMPM

Up at7:30

Get Readyfor School

8:30 – 3:15 School4:30 – 7

HomeworkDinner

Bed at 10

8:30 getto school

Dance ClassOr Relax

8-10 Homework

TV

AMPM

Mode-mapping of printer usage over time

What I do: Think about products, interfaces and the future

Simple InterfaceSimple Menus

Simple InterfaceComplex and Deep Menus

20092001

Why the clickwheel must die: stolen from http://ow.ly/1z29N

What I do: Collect and Organize ideas and patterns

Stolen from Dan Roam: Back of the Napkin

What I do: Think with pictures and diagrams


What I do: Iterate


What I do: analyze and synthesize, lather, rinse, repeat

Stolen from Patrick Whitney and IIT

What I do: Come up with options and test them

Data Information Knowledge Wisdom

What I do: Create meaningful knowledge out of data

Marketing and Design are 90% the same entity but that 10% is so, so critical… Design Researchers and Designers try to understand culture where as a marketer will try and predict behavior.

Jon Kolko

Online Streaming TV and Movie Service Usage Q: Do you watch TV shows or movies over the internet?

Generation X is almost 14 times more likely to watch streaming TV and movies everyday than older people. Older people are more than 2 times more likely to never watch streaming TV and movies than Generation Xers.

Sometimes I do a big online study

SUBURBANAFFLUENT INCOMETECH SAVVY

3

SUBURBANAFFLUENT INCOMEENTERTAINMENT SEEKER

MIXED-SUBURBANMODERATE INCOMEENTERTAINMENT SEEKER

URBANMODERATE INCOMEENTERTAINMENT SEEKER andTECH SAVVY

URBANMODERATE INCOMETECH SAVVY

21

654SUBURBANMODERATE INCOMEENTERTAINMENT SEEKER andTECH SAVVY

Sometimes I talk to a handful of interesting people

There are two types of people in this world:

Those who think there are two types of people…

And those who don’t.

Daniel Stillman

happysad

There are two types of people…

happysad

me

happysad

fat

thin

happysad

fat

thin

me

What I do: map things that you shouldn’t map

happysad

fat

Why? To better understand my target and why I’m designing

Why go to all this trouble?

Companies have personas and frameworks already

We can get stakeholders on the same page

We can create a shared language

We can drive features, inspire innovation

after Tamara Adlinhttp://www.uie.com/events/virtual_seminars/ad_hoc_personas/

CONTENTS:

Case Study: Internet TV Project

SUBURBANAFFLUENT INCOMETECH SAVVY

3

SUBURBANAFFLUENT INCOMEENTERTAINMENT SEEKER

SUBURBANMODERATE INCOMEENTERTAINMENT SEEKER andTECH SAVVY

MIXED-SUBURBANMODERATE INCOMEENTERTAINMENT SEEKER

URBANMODERATE INCOMEENTERTAINMENT SEEKER andTECH SAVVY

URBANMODERATE INCOMETECH SAVVY

Based on regional cost of living, families were chosen to illustrate a range of lifestyles, from well-off or affluent (150K or more) to a more moderate lifestyle (under 150K).

We visited six families across the New York City metropolitan area. The families ranged in income and living conditions.

21

654

User insights

Consumers are going to PCs to supplement or enhance their TV entertainment

They Maintain their relationship with the TV through a variety of attention shifting patterns.

User deep dives

Key Internet BehaviorsUS Consumers are keeping up with their Internet Gardens everyday by:

– Checking Blogs and News of interest– Updating their Social Networks– Email checking – Seeking Information

These are mainly casual point-and-click activities

User deep dives

Update Blogs/Email on Commercial BreaksPeople with People

Who is that Actor?

Pay-Per-View Gatherings

Browsing Friend’s Photo Albums

Sports Info Lookup

Late-Night Rich Meal

Phase Shifting

Digital Meal

On Facebook:Approving/Browsing/Commenting

On Facebook:Approving/ Browsing/ Commenting

Sports Info Lookup

Browsing Friend’s Photo Albums

Family YouTube Time

Educational Content for Kids

Cooking Shows and Recipes

Mapping Key Behaviors

子供の教育

料理のレセピ

家族でのユーチューブ

あの役者はだれだ？

デジタルミール

豪華な夜食

一緒にペーパービュー

フェイスブック

人と人のやり取り

スポーツ情報

広告間のブログ、メールのチェック

フェイスブック

スポーツ情報

Checking Internet on commercial breaks

Digital Activity Map

Mapping behaviors over time

Diagramming intersections of digital behaviors

Digital Focus Map

Mapping shared attention: • People with multiple devices or

tasks• multiple people with a single

device• Multiple people with multiple

devices

For Sam, TV attention is loose, Computer attention is tight.

Net

TV

Net

TV

ATTENTION SHAREAND OVERLAP

Analysis Tools: Mapping behaviors over space and Time

デジタル　アクティビティー　マップ時間軸上でのテレビとネットの記録

デジタル　フォーカス　マップ人とデバイスの関係の記録

Michael will sit with his 2-year old son and watch TV with him, playing and sometimes dancing to TV musicThe laptop will show up for work purposes

The extended family gathers around the laptop to look at pictures together

Rich’s iPhone and Laptop compete for his attention, even when the TV is on

For Sam, TV attention is loose, Computer attention is tight.

Susan moves around the house while she cleans, and keeps her link to the TV peripheral.

For Natalie, TV and computer attention are closely affiliated.

The content is related, and her relationship to TV maintained by sound only.

Josh is less engaged with TV, but watches with his wife

For Aaron, TV and computer attention are closely mapped.

Content is related, relationship maintained by sight

Aaron moves between two TVs and the computer in the morning, avoiding commercials and checking his email.

Rich’s attention is dedicated during group watching

When Jane watches with her kids, her attention to TV is diffuse and she is drawn to her own

digital distractions. Her kids sometimes have a laptop in use,

as well

When Jane watches by herself, her

attention is less divided

J1

J2

S1

S2

R1

R2

M1

M2

N1

N2

A1

A2

Digital Focus Map Summary

|

FOCUSED ON INTERNETNOT ENGAGED WITH INTERNET

FO

CU

SE

D O

N T

VN

OT

EN

GA

GE

D W

ITH

TV

Mapping Behaviors


FO

CU

SE

D O

N T

VN

OT

EN

GA

GE

D W

ITH

TV

Mapping Behaviors

M2

A1


FO

CU

SE

D O

N T

VN

OT

EN

GA

GE

D W

ITH

TV

J1

J2

S1

S2

R1

R2

M1

M2

N1

N2

A1

A2

Mapping Behaviors


FO

CU

SE

D O

N T

VN

OT

EN

GA

GE

D W

ITH

TV

J1

J2

S1

S2

R1

R2

M1

M2

N1

N2

A1

A2

Finding Areas of Focus

MULTI-TASK

ENHANCE

MAINTAIN

Opportunity 2

Opportunity 3

Opportunity 1

Opportunity, Maintain: “Internet Gardening” Wireframes

Allow for QUICK info update(couple line of text)

Allows for larger window view Allows for customizable(drag and drop)

Quick Look-up Constant Checking & Tending

Quick loop-up icons display on bottom

left

Miniature scroll bar on the left side allows for quick browse

Customizable Browser box(drag and expand)

Private space are scrolled from the right

Private space are scrolled from the left

Private space are scrolled from the

bottom

User Validation, feedback for further prototypes

ECCO hosted 8 interviews with participants from the exploratory round of User testing. We covered a range of topics in the hour we had with each participant.

Activities Included:

– Unguided GUI Interaction

– Application use and feedback

– Navigation with Air and 4-Way Remote

– Remote Control Prototype Surveys

Topics included:

– GUI First Impressions

– Feature Values

– Personal Utility Ratings

– User Values

What we learned, what we changed.

CONTENTS:

Case Study: Touch Screen E-reader design and research

Survey questions targeted six specific criteria both to gauge the level of user acceptance for each device

and to make preference comparisons across the different prototype options.

Learning Curve

(Ease of Understanding and

Intuitiveness)

Ease of Use

(During Common Activities)

Level of Fatigue

(Ease of Continued Use Over One

Hour Sessions)

Enjoyment of Interacting

(Interaction Method Preference)

Device Aesthetics

(Appearance of the PUI on the

Device)

Purchase Preference

(Most Desirable Device to Own)

e-ink reader User interface validation study

Digital news reader: User interaction priorities

Overall favorite

Button favorite

Overall Device Rating (out of five)

Physical User Interface Ideation and Testing

Five user interface schemes were built to

test and understand user’s experiences

with them. What would users respond to

immediately and what would be more

difficult for them to understand? Diamond,

Circle, and Trapezoid are Capacitive touch

options. Triangle and Square are both

options that utilize physical buttons.

With no touchscreen (!), how to navigate complex content?

Top Mechanical Device Option:

“Of the two concepts with physical buttons, which did you prefer?”

Top Capacitive Device Option:

“Of the three concepts with touch sensitive areas, which did you prefer?”

Top Overall Device Option:

“Of the five concepts you used, which was your overall favorite?”

Top 10 User Recommendations

1. Improved Navigation: possibly 4 direction, or 2 different methods

“I want to jump across columns, otherwise it takes too long to get to articles”

2. Tactile Feedback

“When you press a button there’s a satisfying response, and you know that an action

has been initiated”

3. Compact and consolidated user interface

“With everything in one place, you don’t have to look up from the screen”

4. Large physical interface area for easier interaction

“On a tiny control space I would have to concentrate on where I’m touching”

5. Labels, graphic or physical indication for sensors on device interface

“I want to be reminded what each control does just by glancing”.

6. Comparable ease scrolling forward and scrolling backward

“If I overshoot an article, I need an easy way to go back”

7. A Home button that is easy to find but out of the way

“I can’t see myself using the home function much, and wouldn’t want to hit it by

mistake”

8. Adapted for secure one-handed use

“I couldn’t use it one handed, I would need it to be lighter or have a grip to hold on to”

9. Limited and intuitive transitions between page turning and scrolling

“The less I have to change my hand position between tasks, the less I have to think

about what I’m doing”

10. Interaction methods that are reliable regardless of skin moisture, fingernail length and

preferred holding position

“If it doesn’t respond to my touch, there’s no way I would keep trying”

35 users and 5 prototypes helped answer our questions.

Physical User Interface Navigation

• Focus on content flow above all else

• Accomplish user’s desired tasks with minimal physical UI

• Don’t force the user to learn a new behavior

Browse a section Read an article Change sections

One-Handed Task List

IA alignment process documents

Basic Information Architecture

Other media

Front Page

Other sources

Newstand/Shop

Section 1 Section 2 Section N

Article 1Pg. 1

Article NPg. N

Article 1Pg. 1

Article NPg. 1

Article 2Pg. 1

Article 1Pg. 2

Select Image

Select Ad


Building-blocks for Navigation


Information Architecture Wireframe


Information Architecture Wireframes


Functional Wireframes

Source Source


no

t se

gm

ente

d e

no

ug

hw

ell

seg

men

ted

too

seg

men

ted

not layered enough well layered too layered

Segmented vs. Layered Interfaces

ON OFFON OFF

LayeredSegmented

Sweet Spot: Balanced Layering and Segmentation

Making sense of user feedback

Sweet Spot: Balanced Layering and Segmentation

no

t se

gm

ente

d e

no

ug

hw

ell

seg

men

ted

too

seg

men

ted


Testing Analysis: Segmented vs. Layered Interfaces

Why did they like what they liked?

ThreeWheel TouchWheel PearlTouch

ClickTouchErgoTouchSurface

Surface

ThreeWheel

PearlTouch

ClickTouch

ErgoTouch

TouchWheel

no

t se

gm

ente

d e

no

ug

hw

ell

seg

men

ted

too

seg

men

ted


Refining and Reinventing the top choices

What more can we do? Driving further ideation.

CONTENTS:

Thankfully, the touch screen option worked out.

Goal: A more modern, universal Gen 2

Case Study: Insignia GPS Redesign

Gen 1 design:

Ray and Jill BarryBuzz

Friendly and Easy

Future Forward and Fun

Slick and Elegant

Process: repurposing our clients segmentation

Making Purchase Segmentations into Interface Strategies

1

43

2Rich

Detailed

Abstract

Simple

Friendly and Easy

Future Forward and

Fun

Slick and Elegant

3

1

4

2

1

Friendly, Emotional, HuggableStrongly female

Simple, accessible, easy

Ladybug

Insignia will be the only 2nd Generation Net-Connected Device in 2009. The Competition will lean to being tech-oriented. Insignia can differentiate by being the only Friendly and Easy Net-Connected Device. Continue to focus very strongly on Jill.

User Strategies: Strong Focus on Jill

2

Cool, Rich, Glossy Strongly male

Gadgety, detailed, layered

Skywalker

Insignia will continue to differentiate based on Tech Features: Haptics, advanced Google features, additional Net connectivity. Buzz was your chief cheerleader, the blue shirts are Buzzes.

User Strategies: Tech Focus for Buzz

3

Trendy, Universal, Charmingnot strongly gendered

Softer, colorful, touchable

Pear

The device interface must also appeal to Ray. He may be the buyer or the receiver of the device as a gift. He will also be a part-time user. A more Universal, Gender-Neutral approach can appeal to Jill and Ray’s shared modern tastes.

User Strategies: Focus on Jill and Reach out to Ray

4

Futuristic, Sophisticated, WorthyMasculine, but relatable

Sleek and exciting, premium

Panther

Barry is an aspirational persona – emphasizing the Worth and Quality of the device through the interface will attract diverse users: Ray, Buzz and Jill. The interface is not optimized for Jill, but will appeal to her.

User Strategies: Focus on Barry and Include Jill

User interface ideation Top Choices

Rich

Detailed

Abstract

Simple

Ratings and Strategies

Friendly and Easy

Future Forward and

Fun

Slick and Elegant

Bubbles Cockpit Thermometer

Logo RegionsCombo Box

Skinned UIs for Top Choices, with User Benefits

Clear on main screen what to click and what is most important

Enhanced number functions on main screen along with a focus on Google

Strong branded message along with clear priorities for top user functions

Easier selection of list items and emphasis on Net partners

Maximize clickable space with most important functions closest to the user

Keep the user oriented by bringing more functions to the main screen

Blending top choices with client management

Information architecture

PersonalityIcon Feel

Gen2 Final Look and Feel

Gen2 Final Look and Feel

Deliverables included full style guide

Thanks!

More at:@dastillman

[email protected]