OVERVIEW
CASE STUDY #1
CASE STUDY #2
ABOUT ME
CONTACT INFO
OVERVIEW
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
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
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.
Personas
Competitive User Flow Analysis
Annotated wireframes
Clickable prototype
Sitemap
OVERVIEW
RESEARCH
CASE STUDY #1
Men 57%
43%
Women
CASE STUDY #2
48%
52%
ABOUT ME
34%
CONTACT INFO
3%
63%
(Thats me!)
OVERVIEW
RESEARCH ANALYSIS
CASE STUDY #1
CASE STUDY #2
ABOUT ME
CONTACT INFO
OVERVIEW
RESEARCH ANALYSIS
CASE STUDY #1
CASE STUDY #2
ABOUT ME
CONTACT INFO
OVERVIEW
RESEARCH ANALYSIS
CASE STUDY #1
AMANDA
CASE STUDY #2
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
CASE STUDY #2
ABOUT ME
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
NEEDS
PAIN POINTS
FEATURES
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
DONE
complete
info
click
PUBLISH
DONE
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
CASE STUDY #1
HOME
SCREEN
CASE STUDY #2
Click newly
added
UPLOAD
button.
UPLOAD SCREEN
ABOUT ME
CONTACT INFO
CONFIRMATION SCREEN
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.
Personas
Competitive User Flow Analysis
Annotated wireframes
Clickable prototype
Sitemap
OVERVIEW
RESEARCH
CASE STUDY #1
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
CASE STUDY #2
ABOUT ME
CONTACT INFO
OVERVIEW
PERSONAS
kanduit
CASE STUDY #1
CASE STUDY #2
PLEASURES
ABOUT ME
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
CASE STUDY #1
kanduit
CASE STUDY #2
ABOUT ME
V1 (SKETCH)
V2 (LO-FI WIREFRAME)
CONTACT INFO
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
CASE STUDY #1
May
2015
kanduit
2
Clients
CASE STUDY #2
V1 (SKETCH)
ABOUT ME
CONTACT INFO
V2 (LO-FI WIREFRAME)
V4 (FINAL MOCKUP)
OVERVIEW
kanduit
CASE STUDY #1
CASE STUDY #2
V1 (SKETCH)
ABOUT ME
V2 (LO-FI WIREFRAME)
CONTACT INFO
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
CASE STUDY #1
CASE STUDY #2
1.
2.
3.
4.
5.
6.
ABOUT ME
CONTACT INFO
OVERVIEW
CASE STUDY #1
CASE STUDY #2
LETS TALK.
EMAIL: JEANNIE.KINNETT@GMAIL.COM
ABOUT ME
PHONE: 678.637.2910
INSTAGRAM: @JeannieWasHere
CONTACT INFO