Measuring UX + Getting Into UX
Session 5 - May 1, 2014
School of Visual Concepts - UX1
http://svc-ux1.leannagingras.com
Week 1: Introduction, process and interviewing
what is UX? what does “doing UX” look like?
Week 2: Analysis and storyboards
how do we make sense of the bigger picture?
Week 3: User-centered design techniques + sketching
how do we go from good concepts to good designs?
Week 4: Prototyping + guerrilla testing
how do we work through, communicate and test designs?
Week 5: Measuring UX + getting into UX
how do we measure UX impact? how do we spread the UX way of thinking?
** tentative schedule. adjusted to taste
Agenda
● Student presentations
● Getting into UX
● Success metrics
● User research
● Studio: Project next steps
● Q&A
STUDENT PRESENTATIONS
STUDENT PRESENTATIONS
Marina & Chuong:
https://www.evernote.com/shard/s42/sh/8ed31736-e92a-4545-84a5-
cfe911b2cb91/16b3b34bf28a960a981a8d89a1853958
Selena: Saved locally
GETTING INTO UX
LEE’S PATH
1994: Start playing with HTML
2001: Side contracting as a front-end dev
2007: Get BA in philosophy
2008: Start masters in Human-Computer Interaction
2008: Internship #1, student job
2009: Internship #2, CHI student design competition
2009: Completed master’s degree in HCI
2010: Start at ITHAKA as ⅔ UX,, ⅓ front-end dev
2010, later: UX Research Coordinator
OTHER PATHS, IN MY EXPERIENCE
project management, product
management,
startups
support,
anthropology
development, IT
NETWORKING
Meetups and groups
● Information Architecture meetup
● UX Happy Hour
● SIGCHI
● http://ischool.uw.edu/current/student-groups
Conferences
● Convey UX
● IA Summit
LinkedIn connections
● https://www.linkedin.com/in/leannagingras
WHAT ABOUT PORTFOLIOS?
Let’s walk through mine: https://leanna-gingras.squarespace.com/
WHAT ARE PEOPLE LOOKING AT?
WHERE ARE THEY COMING FROM?
GETTING UX ADOPTED
Look for opportunities at your day job!
Pick high-value battles
● Give value where your stakeholders need it now
● Start small and go for small wins first. Build trust.
● Stakeholders are users too, design for them
Make the value of UX explicit
● Be specific what you are trying to learn
● Make it about the results, not about the activity
● Make UX issues visible and relatable (example:
colleague and the 7-foot-long printed-out form)
● Don’t just toss the problem in their lap - everything
should have an actionable next site
● Tie it back to numbers - “we could save $XXX,
XXX in support calls” or “we will increase traffic by
XX%”
GETTING UX
ADOPTED
You’re all on the same team
● Collaborate, collaborate, collaborate
● Don’t wait to share data
● Don’t wait to share ideas
● Put up information radiators
● Brown bags, lunch ‘n learn
Shown: This is an “information radiator”. I put
together this poster summarizing a recent user
test and then posted it up all over the company:
all 300 people, whether they were UX people or
not, learned about this and got a chance to
participate in the dialogue around these features.
MEASURING SUCCESS
DISCUSSION: How do you like the SPL? Is it good design?
Criticism points:
● The huge overhead space ... works against readers, who mostly crave
private spaces for curling up with a book.
● If you're spending the day studying or reading on the 10th level, the
nearest restroom is on the seventh.
● One of the library's most touted innovations was the spiral stacks
spanning the sixth through ninth levels … but in practice the organic
ribbon is no easier for the user to negotiate than discrete floors, and in
some cases it may be harder.
● It's relentlessly monotonous and there are few attractive study niches.
Something to consider: it’s gotten over 2x the foot traffic than was anticipated,
and surrounding businesses have made $16 million...
http://www.seattlepi.com/ae/article/On-Architecture-How-the-new-Central-Library-
1232303.php?source=mypi#photo-674846
This pays with my expectations & delights
MEASURING SUCCESS EXAMPLES
From Daria:
I'm a fan of the Fun Theory and gamification in real-life so that is my examples of how to measure success:
Piano Stairs https://www.youtube.com/watch?v=2lXh2n0aPyw
The World’s Deepest Bin https://www.youtube.com/watch?v=cbEKAwCoCKw
The Camera Speed Lottery https://www.youtube.com/watch?v=iynzHWwJXaA
MEASURING SUCCESS EXAMPLES
From Marina:
www.socialblade.com They track data from youtube and other social media platforms (number of views,
subscribers).
Here’s an example of their second-ranked you tube channel: http://www.socialblade.
com/youtube/user/DisneyCollectorBR
Or this one: https://www.charitywater.org/blog/google-impact-award/ This organization is going to use remote
sensor technology to see how much water is flowing through the water pipe systems that they set up in different
areas of the world in real time. That way, they can see if it needs to be fixed.
MEASURING SUCCESS EXAMPLES
From Bryan:
My example of measured success using UX principles is the iPad app Cook. Here is the link that showcases the
app: http://www.thecookapp.com/
The team that developed the app selected a targeted audience, having a persona in mind, and actually visited
people in their kitchens. Their goal was to create a way for people to save and share family recipes. To measure
their success, they look past the number of downloads, and instead focus on engagement. To them, it is more
important that people are spending time with the app (15-20 minutes) than that they are downloading it.
http://www.startupsmart.com.au/growth/start-up-profiles/how-this-app-creator-used-user-experience-design-to-
cook-up-a-top-selling-app/2014040112013.html
Set success metrics at the
beginning of a project.
Decide what “success” looks like
for the project - e.g. “selling stuff”
And then decide how to measure
that.
Google Analytics
Placeholder - Lee will open up Google Analytics and walk us through some stuff!
Including but not limited to:
● Behavior > Top pages
● Behavior > Top pages > Individual page > change over time
● Audience > Behavior > Engagement
CrazyEgg
http://blog.asmartbear.com/heatmaps-from-clicks-how-crazyegg-improved-
our-website-overnight.html
THIS IS WHY YOU CAN’T
ONLY USE ANALYTICS
AND METRICS.
SHOWN: WHAT
NOT SHOWN: WHY
USER RESEARCH
“UX design is the process of understanding user behavior in
order to create the best possible experience for the user.”
-- Joseph Dickerson
CASE STUDY: USER RESEARCH IN THE WILD
User research worksbest when it’s iterative and triangulated with other data.
Circa early 2010. Analytics showed high bounce rates for unauthenticated users. At the same time,
Support reported high #s of calls from academics who didn’t know why the whole article wasn’t showing.
In-person usability test
helped us zoom in on the
“Why” of the problem. People
didn’t understand that they
could get access through
their university.
Usability test guide and excerpted test notes for a post-launch test of this page
their reaction “I don’t have an account so I don’t have to log in”
hard to get them to the login page the way the test was
designed.
it wasn’t intuitive to go to the login page to try to get access to
something.
actual institution finder form seemed pretty straightforward, they
didn’t have any trouble using that. getting to it was more of an
issue.
when (m) student was prompted to login, he kept looking for
another way to get in.
Redesigned page: Better performance in testing! But now another problem surfaces: people aren’t
picking the “correct” next step (here, “access options”)
We continued testing and iteratively tweaking the page: heatmap analytics, Google analytics, paper
prototype testing with users, live A/B testing. Shown: How the unauthenticated article page looks
today
We launched a project to improve the “next step” for the user by making high-level changes to how
the login workflow was put together. We created an “institution finder” among other things.
Wireframe for a proposed re-design of the Login page. This launched pretty much as shown.
How the login page looks today
http://voiceandgesture.com/post/81405010752/ford-engineers-wear-virtual-reality-headsets-to
FIRST AND FOREMOST: DO WHAT ANSWERS YOUR QUESTION
User input reduces the cost of course
correction and improvement.
It saves cold hard cash.
When you find UX problems at this stage:
Revisit your problem statement and / or revisit your concept.
When you find UX problems at this stage:
Figure out if it’s your concept or your design.
Either way, redesign it
When you find UX problems at this stage:
Figure out what the problem is: concept? design? bug?
Re-design it
Re-build all affected portions
When you find UX problems at this stage:
Unhappy users and possible loss of revenue, traffic, users, etc
The problem could be anywhere in the pipe
Will have fix problems, re-build, and re-launch the whole damn thing
http://www.nngroup.com/articles/which-ux-research-methods/
http://www.nngroup.com/articles/which-ux-research-methods/
GUERILLA USER RESEARCH
ETHNOGRAPHIC / FIELD STUDIES
LAB USABILITY STUDIES
STUDY GOAL: To observe how users interpret/explain the DRM associated with e-books
PARTICIPANTS: 7 students (3 freshmen/sophomores, 4 grad/doctoral)
METHODOLOGY: Lab study performed with an e-book checked out from the library and opened on Adobe Digital Editions
EXAMPLE TASKS: please print this page. // you think your friend would really enjoy this book. how do you share it with him?
SYNTHESIZING: You can synthesize
usability studies the same way we
learned to synthesize interview data:
create summaries of each user
session (shown below) and perform
some sort of affinity diagramming or
other grouping technique to find
patterns.
Shown at right: An affinity diagram in
disguise. I compiled the notes into a
spreadsheet, grouped them by task,
and taped them up to a white-board
wall.
http://www.userfocus.co.uk/articles/usability_test_plan_dashboard.html
Getting users to sort cards into categories can help you learn what categories and groupings their target users would use.
(Caveat: Leanna personally isn’t super fond of card sorting as a methodology. Ask her why!)
CARD SORT STUDIES
REMOTE RESEARCH OPTIONS
Ethnio
Skype/Google Hangouts
GoToMeeting
Chalkmarks
Treejack
FiveSecondTests
Usabilla
There are dozens out there
http://uxdesign.cc/ux-tools/
This form triggers an appropriate next step based on what you’ve chosen.
But it’s also a very effective way of getting information about why users are deleting their site!
CAUTION: Self-report data is still what people say, not what they do.
SURVEYS
Studio: Next steps
We saw some student presentations today.
Let’s get into groups and help them figure out their next steps!
Q&A WITH LEE
A WEEK IN THE LIFE

Session 5 - Measuring UX + Getting Into UX

  • 1.
    Measuring UX +Getting Into UX Session 5 - May 1, 2014 School of Visual Concepts - UX1 http://svc-ux1.leannagingras.com
  • 2.
    Week 1: Introduction,process and interviewing what is UX? what does “doing UX” look like? Week 2: Analysis and storyboards how do we make sense of the bigger picture? Week 3: User-centered design techniques + sketching how do we go from good concepts to good designs? Week 4: Prototyping + guerrilla testing how do we work through, communicate and test designs? Week 5: Measuring UX + getting into UX how do we measure UX impact? how do we spread the UX way of thinking? ** tentative schedule. adjusted to taste
  • 3.
    Agenda ● Student presentations ●Getting into UX ● Success metrics ● User research ● Studio: Project next steps ● Q&A
  • 4.
  • 5.
    STUDENT PRESENTATIONS Marina &Chuong: https://www.evernote.com/shard/s42/sh/8ed31736-e92a-4545-84a5- cfe911b2cb91/16b3b34bf28a960a981a8d89a1853958 Selena: Saved locally
  • 6.
  • 7.
    LEE’S PATH 1994: Startplaying with HTML 2001: Side contracting as a front-end dev 2007: Get BA in philosophy 2008: Start masters in Human-Computer Interaction 2008: Internship #1, student job 2009: Internship #2, CHI student design competition 2009: Completed master’s degree in HCI 2010: Start at ITHAKA as ⅔ UX,, ⅓ front-end dev 2010, later: UX Research Coordinator
  • 8.
    OTHER PATHS, INMY EXPERIENCE project management, product management, startups support, anthropology development, IT
  • 9.
    NETWORKING Meetups and groups ●Information Architecture meetup ● UX Happy Hour ● SIGCHI ● http://ischool.uw.edu/current/student-groups Conferences ● Convey UX ● IA Summit LinkedIn connections ● https://www.linkedin.com/in/leannagingras
  • 10.
    WHAT ABOUT PORTFOLIOS? Let’swalk through mine: https://leanna-gingras.squarespace.com/
  • 11.
    WHAT ARE PEOPLELOOKING AT?
  • 12.
    WHERE ARE THEYCOMING FROM?
  • 13.
    GETTING UX ADOPTED Lookfor opportunities at your day job! Pick high-value battles ● Give value where your stakeholders need it now ● Start small and go for small wins first. Build trust. ● Stakeholders are users too, design for them Make the value of UX explicit ● Be specific what you are trying to learn ● Make it about the results, not about the activity ● Make UX issues visible and relatable (example: colleague and the 7-foot-long printed-out form) ● Don’t just toss the problem in their lap - everything should have an actionable next site ● Tie it back to numbers - “we could save $XXX, XXX in support calls” or “we will increase traffic by XX%”
  • 14.
    GETTING UX ADOPTED You’re allon the same team ● Collaborate, collaborate, collaborate ● Don’t wait to share data ● Don’t wait to share ideas ● Put up information radiators ● Brown bags, lunch ‘n learn Shown: This is an “information radiator”. I put together this poster summarizing a recent user test and then posted it up all over the company: all 300 people, whether they were UX people or not, learned about this and got a chance to participate in the dialogue around these features.
  • 15.
  • 16.
    DISCUSSION: How doyou like the SPL? Is it good design? Criticism points: ● The huge overhead space ... works against readers, who mostly crave private spaces for curling up with a book. ● If you're spending the day studying or reading on the 10th level, the nearest restroom is on the seventh. ● One of the library's most touted innovations was the spiral stacks spanning the sixth through ninth levels … but in practice the organic ribbon is no easier for the user to negotiate than discrete floors, and in some cases it may be harder. ● It's relentlessly monotonous and there are few attractive study niches. Something to consider: it’s gotten over 2x the foot traffic than was anticipated, and surrounding businesses have made $16 million... http://www.seattlepi.com/ae/article/On-Architecture-How-the-new-Central-Library- 1232303.php?source=mypi#photo-674846
  • 17.
    This pays withmy expectations & delights
  • 18.
    MEASURING SUCCESS EXAMPLES FromDaria: I'm a fan of the Fun Theory and gamification in real-life so that is my examples of how to measure success: Piano Stairs https://www.youtube.com/watch?v=2lXh2n0aPyw The World’s Deepest Bin https://www.youtube.com/watch?v=cbEKAwCoCKw The Camera Speed Lottery https://www.youtube.com/watch?v=iynzHWwJXaA
  • 19.
    MEASURING SUCCESS EXAMPLES FromMarina: www.socialblade.com They track data from youtube and other social media platforms (number of views, subscribers). Here’s an example of their second-ranked you tube channel: http://www.socialblade. com/youtube/user/DisneyCollectorBR Or this one: https://www.charitywater.org/blog/google-impact-award/ This organization is going to use remote sensor technology to see how much water is flowing through the water pipe systems that they set up in different areas of the world in real time. That way, they can see if it needs to be fixed.
  • 20.
    MEASURING SUCCESS EXAMPLES FromBryan: My example of measured success using UX principles is the iPad app Cook. Here is the link that showcases the app: http://www.thecookapp.com/ The team that developed the app selected a targeted audience, having a persona in mind, and actually visited people in their kitchens. Their goal was to create a way for people to save and share family recipes. To measure their success, they look past the number of downloads, and instead focus on engagement. To them, it is more important that people are spending time with the app (15-20 minutes) than that they are downloading it. http://www.startupsmart.com.au/growth/start-up-profiles/how-this-app-creator-used-user-experience-design-to- cook-up-a-top-selling-app/2014040112013.html
  • 21.
    Set success metricsat the beginning of a project. Decide what “success” looks like for the project - e.g. “selling stuff” And then decide how to measure that.
  • 22.
    Google Analytics Placeholder -Lee will open up Google Analytics and walk us through some stuff! Including but not limited to: ● Behavior > Top pages ● Behavior > Top pages > Individual page > change over time ● Audience > Behavior > Engagement
  • 23.
  • 24.
    THIS IS WHYYOU CAN’T ONLY USE ANALYTICS AND METRICS. SHOWN: WHAT NOT SHOWN: WHY
  • 25.
  • 26.
    “UX design isthe process of understanding user behavior in order to create the best possible experience for the user.” -- Joseph Dickerson
  • 27.
    CASE STUDY: USERRESEARCH IN THE WILD User research worksbest when it’s iterative and triangulated with other data.
  • 28.
    Circa early 2010.Analytics showed high bounce rates for unauthenticated users. At the same time, Support reported high #s of calls from academics who didn’t know why the whole article wasn’t showing.
  • 29.
    In-person usability test helpedus zoom in on the “Why” of the problem. People didn’t understand that they could get access through their university.
  • 30.
    Usability test guideand excerpted test notes for a post-launch test of this page their reaction “I don’t have an account so I don’t have to log in” hard to get them to the login page the way the test was designed. it wasn’t intuitive to go to the login page to try to get access to something. actual institution finder form seemed pretty straightforward, they didn’t have any trouble using that. getting to it was more of an issue. when (m) student was prompted to login, he kept looking for another way to get in.
  • 31.
    Redesigned page: Betterperformance in testing! But now another problem surfaces: people aren’t picking the “correct” next step (here, “access options”)
  • 32.
    We continued testingand iteratively tweaking the page: heatmap analytics, Google analytics, paper prototype testing with users, live A/B testing. Shown: How the unauthenticated article page looks today
  • 33.
    We launched aproject to improve the “next step” for the user by making high-level changes to how the login workflow was put together. We created an “institution finder” among other things.
  • 34.
    Wireframe for aproposed re-design of the Login page. This launched pretty much as shown.
  • 35.
    How the loginpage looks today
  • 36.
  • 37.
    User input reducesthe cost of course correction and improvement. It saves cold hard cash.
  • 38.
    When you findUX problems at this stage: Revisit your problem statement and / or revisit your concept.
  • 39.
    When you findUX problems at this stage: Figure out if it’s your concept or your design. Either way, redesign it
  • 40.
    When you findUX problems at this stage: Figure out what the problem is: concept? design? bug? Re-design it Re-build all affected portions
  • 41.
    When you findUX problems at this stage: Unhappy users and possible loss of revenue, traffic, users, etc The problem could be anywhere in the pipe Will have fix problems, re-build, and re-launch the whole damn thing
  • 42.
  • 43.
  • 44.
  • 45.
  • 46.
    LAB USABILITY STUDIES STUDYGOAL: To observe how users interpret/explain the DRM associated with e-books PARTICIPANTS: 7 students (3 freshmen/sophomores, 4 grad/doctoral) METHODOLOGY: Lab study performed with an e-book checked out from the library and opened on Adobe Digital Editions EXAMPLE TASKS: please print this page. // you think your friend would really enjoy this book. how do you share it with him?
  • 47.
    SYNTHESIZING: You cansynthesize usability studies the same way we learned to synthesize interview data: create summaries of each user session (shown below) and perform some sort of affinity diagramming or other grouping technique to find patterns. Shown at right: An affinity diagram in disguise. I compiled the notes into a spreadsheet, grouped them by task, and taped them up to a white-board wall.
  • 49.
  • 50.
    Getting users tosort cards into categories can help you learn what categories and groupings their target users would use. (Caveat: Leanna personally isn’t super fond of card sorting as a methodology. Ask her why!) CARD SORT STUDIES
  • 51.
    REMOTE RESEARCH OPTIONS Ethnio Skype/GoogleHangouts GoToMeeting Chalkmarks Treejack FiveSecondTests Usabilla There are dozens out there http://uxdesign.cc/ux-tools/
  • 52.
    This form triggersan appropriate next step based on what you’ve chosen. But it’s also a very effective way of getting information about why users are deleting their site! CAUTION: Self-report data is still what people say, not what they do. SURVEYS
  • 53.
    Studio: Next steps Wesaw some student presentations today. Let’s get into groups and help them figure out their next steps!
  • 54.
  • 55.
    A WEEK INTHE LIFE