You are on page 1of 25

JEANNIE KINNETT

USER RESEARCHER + EXPERIENCE DESIGNER

OVERVIEW
CASE STUDY #1
CASE STUDY #2
ABOUT ME

WE ADORE CHAOS BECAUSE WE LOVE


TO PRODUCE ORDER.
- M. C. ESCHER

CONTACT INFO

OVERVIEW

HOW I LIKE TO WORK:

CASE STUDY #1

(1) LEARN from & about the Users. (2) CREATE something for the Users. (3) TEST with the Users. ITERATE based on testing data.
Throughout my process, I alternate Divergent Thinking (thinking big) with Convergent Thinking (thinking practically).
Creating these different spaces lets my team and me get great work out-the-door on time, every time.

T
EN
RG
DI
VE
NT
GE
NV
ER
CO

T
EN
RG
DI
VE
NT
GE
NV
ER
CO

T
EN
RG
DI
VE
NT
GE
NV
ER
CO

EN
RG

NT

GE

T
EN

RG

-11-12Wireframe Test
& Prototype

* This is the specific process I used in Case Study #1, Twitch.tv. Tools and steps vary with each projects goals.

ER
NV

-10Discuss
Sketches/
Design
Studio

VE
DI

-8Prioritize
Features
(Feature
Mapping)

CO

-9Sketch/
Design
Studio

NT

T
EN

RG

-7Ideate
Features

GE

VE
DI

-6Affinity
Map
&
Create
Personas

ER
NV

NT

GE

T
EN

RG

VE
DI

CONTACT INFO

-4-5Select
User
Users
Interviews
for
Interviews

TEST & ITERATE


CO

ER
NV

NT

ABOUT ME

-3Gather
Survey
Responses

CO

-2Pare Down
(Questions
for
Screener
Survey)

GE

ER
NV

-1Topic Map
(Questions
for
Users)

DI
VE

CREATE

CO

CASE STUDY #2

LEARN

-13Iterate

-14Deliver

OVERVIEW

TWITCH.TV

CASE STUDY #1

Design and Integrate a video upload feature for Americas 4th largest source of peak Internet traffic.

CASE STUDY #2
ABOUT ME
CONTACT INFO

OVERVIEW

PROJECT OVERVIEW

CASE STUDY #1

BRIEF: Design a new way to upload and view content that lets gamers share their tips and tricks with each other.
TIMELINE: 2 weeks

CASE STUDY #2

TEAM SIZE: 3 designers

ABOUT ME
CONTACT INFO

WHAT I DID:
Led the Research Phase including:
Led topic mapping
Wrote screener survey questions
Helped organize interviews
Led Affinity Mapping.
Developed the 3 Personas.
Wireframed the new upload feature flow.
Comparative Research.

WHAT WE SPLIT:
User Interviews.
Usability Testing.

WHAT MY TEAMMATES DID:


Created Supplementary Wireframes,
integrating video content into Twitch.
Finished hi-fi Mock Ups & Prototype.
DELIVERABLES

Personas
Competitive User Flow Analysis
Annotated wireframes

Clickable prototype
Sitemap

OVERVIEW

RESEARCH

CASE STUDY #1

201 SCREENER SURVEY RESPONSES

Men 57%

43%

Women

CASE STUDY #2

From 15 different countries.

48% had used Twitch before.

48%

52%

To ensure we interviewed Users who could help us answer our


research questions, we selected survey respondents who:
(1) seemed serious about gaming
AND
(2) had at least some knowledge of Twitch.
I dont want a spoiler.
I just want a hint.

ABOUT ME

Why would I stream?


Its a social thing.

34%
CONTACT INFO

3%

15 IN-DEPTH USER INTERVIEWS

63%

63% had watched a walkthrough on Youtube.

But only 3% had watched a walkthrough on Twitch.

I love watching people play games as much as


I like playing them myself.

(Thats me!)

OVERVIEW

RESEARCH ANALYSIS

CASE STUDY #1

PROMPT: A few users said they


gamed specifically for social reasons.

CASE STUDY #2

MY QUESTION: Are there trends


associated with the level of sociability
in gamer behavior?

ABOUT ME

MY ROLE: I suggested we try


mapping our findings on a Pain-toPleasure continuum (horizontal axis)
bisected with a Social-to-Alone
continuum (vertical axis).
FINDING: We discovered our users
clearly fell within three strata, based
on their chief reason for watching
others play video games.

CONTACT INFO

RESULT: This delineation served as the


basis for our three personas.

OVERVIEW

RESEARCH ANALYSIS

CASE STUDY #1

PROMPT: A few users said they


gamed specifically for social reasons.

Watching for SOCIAL

CASE STUDY #2

MY QUESTION: Are there trends


associated with the level of sociability
in gamer behavior?

ABOUT ME

MY ROLE: I suggested we try


mapping our findings on a Pain-toPleasure continuum (horizontal axis)
bisected with a Social-to-Alone
continuum (vertical axis).

Watching for ENTERTAINMENT

FINDING: We discovered our users


clearly fell within three strata, based
on their chief reason for watching
others play video games.

CONTACT INFO

RESULT: This delineation served as the


basis for our three personas.

Watching for ANSWERS

OVERVIEW

RESEARCH ANALYSIS

CASE STUDY #1

RESULT: This delineation served as the


basis for our three personas.

Watching for SOCIAL

AMANDA

24 YEARS OLD // I.T. SPECIALIST


Why do I stream? Its a social thing.

CASE STUDY #2

Watching for ENTERTAINMENT


ABOUT ME
CONTACT INFO

Watching for ANSWERS

Since moving to New York, Amanda has


BEHAVIOR
struggled to find friends seriously interested in
video games. She keeps up with her old gamer
Broadcasts/uploads once a week
pals via Twitch and Steam; the group broadcasts
and streams each others gameplay at least once
Searches for her friends videos
a week. Amanda also
to meetOLD
new people
19likes
YEARS
// GRAPHIC DESIGN
STUDENT
Chats with
old and new friends
online. When not working with computers or
Listens to EDM while gaming
gaming, Amanda is taking
care
of her dog,
Atari.
I prefer
watching
other
people play video games.

BENji

FAVORITE GAMES
PAIN POINTS
Battlefield Hardline, Counter-Strike, League of Legends
Benjis favorite TV show is video games. He
BEHAVIOR
watches
gamers
videos
between
classeswith
FAVORITE PLATFORMS
Lag on live broadcasts
friends or by himself. He even sometimes
PC, PS4
Broadcast
set up is
a hassle
Unwinds
watching
Lets
Plays
watches Lets Plays when falling asleep. Benji
Problems
with
bandwidth
follows funny gamers on YouTube, Twitter, and
Learns
about
new
videos from
TIME
SPENT
PLAYING/WATCHING
MANAGER
Need
to log
in from his friends
Facebook.
Hell
watch
aYEARS
livestreamOLD
ifGAMES
its //
starring
social
media
and
31
MARKETING
Everyday,
2-3
hours or if one of his friends
one of his about
favorite
gamers
Watches walkthroughs to check
tells him to check it out.
Im not here to make friends. Im hereout
to game.
a new game

thomas

FAVORITE GAMES
Super Smash Bros., Minecraft, Clash of Clans
If Thomas takes his job seriously, he takes his

PAIN POINTS

OVERVIEW

PERSONAS

CASE STUDY #1

I developed each user type into an in-depth persona like the one below. Personas influenced our entire iterative design process.

AMANDA

24 YEARS OLD // I.T. SPECIALIST


Why do I stream? Its a social thing.

CASE STUDY #2
ABOUT ME

Since moving to New York, Amanda has


struggled to find friends seriously interested in
video games. She keeps up with her old gamer
pals via Twitch and Steam; the group broadcasts
and streams each others gameplay at least once
a week. Amanda also likes to meet new people
online. When not working with computers or
gaming, Amanda is taking care of her dog, Atari.

BEHAVIOR

FAVORITE GAMES
Battlefield Hardline, Counter-Strike, League of Legends

CONTACT INFO

FAVORITE PLATFORMS
PC, PS4
TIME SPENT PLAYING/WATCHING GAMES
Everyday, about 2-3 hours

Broadcasts/uploads once a week


Searches for her friends videos
Chats with old and new friends
Listens to EDM while gaming

NEEDS

PAIN POINTS

Lag on live broadcasts


Broadcast set up is a hassle
Problems with bandwidth
Need to log in

Easy way to upload walkthroughs


Communication between gamers
Ability to meet new people
Ability to find her friends easily

FEATURES

Easy way to upload walkthroughs


Comment on videos
Ability to find her friends videos
Live chat feature

OVERVIEW

COMPARATIVE RESEARCH

CASE STUDY #1

HOME

click your
account
name

CASE STUDY #2

click
VIDEO
MANAGER

VIDEO
MANAGER
PAGE

click
gear icon

click
EXPORT

click
SETTING

SETTINGS
PAGE

click
CONNECTIONS

click
video

UPLOAD
WINDOW
POP UP

link
YouTube &
Twitch
accounts

HOME

click
UPLOAD

UPLOAD
PAGE

click
SELECT
FILES TO
UPLOAD

VIDEO DETAIL
PAGE

complete
info

click
EXPORT

ABOUT ME

TWITCHS PREVIOUS UPLOAD-TO-YOUTUBE USER FLOW


(minimum 5 clicks, 4 screens, confusing language)

drag & drop


files

DONE
complete
info

click
PUBLISH

DONE

YOUTUBES UPLOAD USER FLOW

(minimum 3 clicks, 3 screens, clear language)

CONTACT INFO

THIS is more complicated than and takes more time than THIS.
I used these flows as benchmarks to ensure I designed a quick, clear new upload flow for Twitch users.

UPLOAD
SCREEN

OVERVIEW

UPLOAD USER FLOW MOCKUPS


(minimum 3 clicks, 3 screens, clear language)

CASE STUDY #1

HOME
SCREEN

CASE STUDY #2

Click newly
added
UPLOAD
button.

UPLOAD SCREEN

Familiar drag-and-drop UI.

UPLOADING + VIDEO DETAILS SCREEN

Upload progress bar. Enter video details during wait.

ABOUT ME
CONTACT INFO

(OPTIONAL) ANNOTATIONS SCREEN

Unlike on Youtube, users can choose to annotate the


video during the upload process.

CONFIRMATION SCREEN

Video summary. Link to view in profile.

OVERVIEW

CLICKABLE PROTOTYPE

CASE STUDY #1
CASE STUDY #2

https://projects.invisionapp.com/share/UR2PUEJ8H#/screens

ABOUT ME
CONTACT INFO

OVERVIEW

KANDUIT

CASE STUDY #1

Design a calendar & scheduling features for an online directory for social workers.

kanduit

CASE STUDY #2
ABOUT ME
CONTACT INFO

kanduit

OVERVIEW

PROJECT OVERVIEW

CASE STUDY #1

BRIEF: Kanduit is a directory of social services for social workers (in beta). Design the second-half of this responsive
web app: a connected calendar/scheduling system that lets social service providers make appointments for their
clients.
TIMELINE: 3 weeks

CASE STUDY #2
ABOUT ME
CONTACT INFO

WHAT I DID:
Served as my teams point of client contact.
Led the Research Phase including:
Organized and led 12 user interviews
All Affinity Mapping and Research Analysis.
Created & presented initial Research Report.
Built and tested clickable prototype with InVision.
Conducted A/B testing.
Designed final mockups for desktop and mobile.

WHAT WE SPLIT:
User Interviews.

WHAT MY TEAMMATES DID:


Created Initial Wireframes.
Assembled the Research Report.
DELIVERABLES

Personas
Competitive User Flow Analysis
Annotated wireframes

Clickable prototype
Sitemap

OVERVIEW

RESEARCH

CASE STUDY #1

What are Kanduits business goals & brand goals?


To find out,
we held three Stakeholder Interviews.

CASE STUDY #2

What are Kanduits prospective Users like? (Scheduling behavior? Motivations? Highs & Lows?)
To find out,
we talked with 12 Users* including:

ABOUT ME

CONTACT INFO

Social Workers
Private Practitioners
Agency Administrators.
Program Managers.

*Some provided by the Client. Some gathered from our own network.

kanduit

OVERVIEW

RESEARCH ANALYSIS

kanduit

CASE STUDY #1

PROMPT: We are tasked with designing a flow.

CASE STUDY #2

MY QUESTION: What are the highs and lows as


a social worker goes through the scheduling
process? Are there trends temporally?
MY ROLE: I did all of the mapping, categorizing,
and analysis. One of my teammates wrote our
interview notes on stickies. I circled key findings.

ABOUT ME

FINDINGS: Kanduits main User Type, social


workers, exclusively uses desktop for
scheduling.

CONTACT INFO

RESULT: I advocated for the Users technical


preferences. I persuaded the client that our
team should focus first-and-foremost on the
Desktop experience, rather than on a mobile app.

OVERVIEW

PERSONAS

kanduit

CASE STUDY #1

Sally the Social Worker


Tech Savviness: Medium
Context: Running around to meet clients or in oce to do paperwork

CASE STUDY #2

Its a stressful job. . . but I think at some


point youve got to be a catalyst for change.

PLEASURES

Heather the Healthcare Provider


Helping others succeed

Getting clients to commit to helping themselves

ABOUT ME

Tech Savviness: High


Having enough time to get everything done, especially paperwork
Sally works longContext:
hours, but
her
days going
are never
& appointments
In an
oce,
fromthe
appointment
to appointment
same. She drives to meet her clients in their
homes or at their appointments, all the while
PAINS
logging
her
hours
and
juggling
stacks
of
It would be really helpful if thre was [a]
PLEASURES
Paperwork & Having to log hours
paperwork.
Her
biggest
motivation
is
her
desire
to
system that was really painless for referrals.
ZocDoc is super user friendly
Diculty nding the right program
be a force for positive change in the world. And
Making a breakthrough with a client
Diculty getting in touch with clients
shes great at it.Tech
SallySavviness:
could useMedium
a little help getting
Feeling condent in the referrals she makes
Client no shows. And clients attendance impacts Sallys companys
Heather
loves
getting
to
help
people
every
single
all her tasks
done.
Context: Front desk of her programs ocegrant funding
day. Her schedule is always full because she tries
to help as many clients as possible. Healther
PAINS
BEHAVIORS
FEATURES
recognizes her professional limitations, though,

Abby the Administrator

CONTACT INFO

kanduit

OVERVIEW

RESEARCH - PART 2
Patient Info

CASE STUDY #1

click time
slot

Search
Results
Page

click
BOOK
ONLINE

Appt. Times
Modal
Window

click time
slot

Appt Info

specify
patient

click

CONTINUE

Book Your
Appt.
Page 3

Sign Up
Modal
Screen

select
IVE
USED

Login
Modal
Screen

click

Your Appt.
Is Booked
Page

Login Page

CASE STUDY #2
ABOUT ME

Book Your
Appt.
Page 2

select
IM NEW

verify
phone #

BOOK
APPT

Details

click

CONTINUE

Book Your
Appt. Page

Fill in
Basic
Appt.
Info

click

CONTINUE

Finished!?

CONTACT INFO

Kanduit set ZocDoc as its benchmark for scheduling simplicity. Data gathered in our User Interviews validated ZocDocs felt ease-of-use.
I mapped out ZocDocs scheduling flow to see how I could beat it.

OVERVIEW

ITERATIONS: APPT. NOTIFICATIONS STEP

CASE STUDY #1

kanduit

CASE STUDY #2

ABOUT ME

V1 (SKETCH)

V2 (LO-FI WIREFRAME)

CONTACT INFO

1. Language changes based on user


feedback: Changed Client Info to Account
Info & Appt Details to Notifications.

V4 (FINAL MOCKUP)
2. Added option to inform client of new
appt.
3. Added numbers to simplify.
4. Adjusted spacing to fit more onto the
screen at once.

OVERVIEW

ITERATIONS: CALENDAR (MONTH VIEW)

CASE STUDY #1

May
2015

kanduit

2
Clients

CASE STUDY #2

V1 (SKETCH)

ABOUT ME
CONTACT INFO

V2 (LO-FI WIREFRAME)

V4 (FINAL MOCKUP)

1. Changed icons to test (Day, Week, Month,


Clients) to increase clarity.

2. Switched Day & Month view buttons.

OVERVIEW

kanduit

ITERATIONS: NOTIFICATIONS PAGE

CASE STUDY #1

CASE STUDY #2

V1 (SKETCH)
ABOUT ME

V2 (LO-FI WIREFRAME)

CONTACT INFO

1. Added color-coding & icons.


2. Separated notifications & footer.

V3 (FINAL MOCKUP)
3. Separated Future & Past Appointments.
4. Added a Load More button.

OVERVIEW

CLICKABLE PROTOTYPE

CASE STUDY #1
CASE STUDY #2

https://projects.invisionapp.com/share/RE30AMKZT

kanduit

ABOUT ME
CONTACT INFO

OVERVIEW

10 THINGS YOU DIDNT KNOW ABOUT ME

CASE STUDY #1
CASE STUDY #2

1.
2.
3.
4.
5.
6.

ABOUT ME
CONTACT INFO

I am named after my Southern grandmother, Jeannie Martin Puckett.


My favorite book is A Tale of Two Cities.
I played Dorothy in my 1st grades rendition of The Wizard of Oz.
I can identify almost every breed of dog.
This is my favorite color.
In college, I was Co-President of our Outdoor Leadership Training program and led week-long
backpacking and whitewater canoeing trips.
7. I love a good pun.
8. My spirit animal is a Border Collie because theyre curious, enjoy being active, and are good at
herding people.
9. My guilty pleasure is researching personal finance tools.
10. I can imitate the ping pong ball sound eerily well.

OVERVIEW
CASE STUDY #1
CASE STUDY #2

LETS TALK.
EMAIL: JEANNIE.KINNETT@GMAIL.COM

ABOUT ME

PHONE: 678.637.2910
INSTAGRAM: @JeannieWasHere

CONTACT INFO

You might also like