SlideShare a Scribd company logo
1 of 48
Download to read offline
ux patterns & practices
Jeff Wisniewski & Darlene Fichter
Computers in Libraries March 8, 2016
Outline
What’s emerging
Research findings show us what to do,
what not to do
Changes for UX
& UX Designers ● Ubiquitous
● UX /usability is a line in many job
descriptions
● Spending hours on pixel gazing is
passee
For the price of
pizza you can
Get a better quality, responsive website
design and framework than most in-
house designers & developers can
provide
The machines
are coming
Squarespace:
Just add content and push a button
Why now?
Emotional
design
● Usable is a baseline to work from
● Emotional design seeks to create
human to machine interactions that
feel more like human to human ones
● “Conversational” flow
● Empathy is key
● While we usually seek to elicit
positive emotions, acknowledging
negative ones is also valid
Emotional user
experience:
Traits, events,
and states
● Individual differences in emotional
responses in human–technology
interaction were investigated
● Self-confidence of the user affects
emotional user experience
By Jussi P.P. Jokinen,International Journal of Human-
Computer Studies Volume 76, April 2015, Pages 67–77
I don’t feel so
good
● starting a research paper
● looking for a job
● tax help
Relentless optimism is annoying
UX Methods &
Tools
● Task based testing
● Eye - tracking
● Informal testing
○ “pop up” study
○ signage
○ paper prototyping
● Ethnographic methods
Microfeedback
Dublin Airport - emojis
Sarah Doody. Everyday UX. http://www.sarahdoody.
com/everyday-ux-example-microfeedback-
dublin-airport/#.Vt7zfPkrKxl
But I my
assumptions
I love them so much,
I think they're facts
Beware of your assumptions.
Prototyping is all about testing
assumptions with real people
Research
Caveats
● Keep in the mind the study
participants may not be like your
audience
● More often than not the results will
be true for your target audience
Logo placement Top left or top right. Does it matter?
Logo placement
Users are 89% more likely to remember
logos shown in the traditional top-left
position than logos placed on the right
https://www.nngroup.com/articles/logo-placement-
brand-recall/
Is “Home”
option on the
menu really
necessary?
Or does “clicking the logo” to go to the
home page suffice?
The Home Link is Dead. Long Live the Home Link! Danielle Cooley & Nikki Bristo
http://dgcooley.com/storage/uxpa_poster_ol.pdf
Logo only = 17% can’t find home
Logo + home = 2% can’t find home
User knows that
clicking the logo
goes to the
home page
So, the clicking the logo is just as good
as having a menu option, right?
Logo alone= 6.5 seconds
Logo + home= 3.2 seconds
Significantly quicker
Page weight Pages are getting?
Page weight Heavier
http://httparchive.org/trends.php?
s=All&minlabel=Feb+1+2013&maxlabel=Feb+1+2016#bytesTotal&reqTotal
Page weight
Heavy pages= bad UX
Be kind, optimize
https://developers.google.
com/web/fundamentals/performance/?
hl=en
Search result
layout List vs. grid
Search result
layout
“There was little consensus as to how
the results were ordered in the grid,
unlike the list layout.”
http://usabilitynews.org/how-do-users-view-search-
results-presented-in-a-grid-layout/
Implications for
card-based
design?
Mobile
menu options
Hamburger
Hamburger: It’s
everywhere so,
it’s good?
Mike Ryan took a comprehensive
look at the evidence for and against
using a hamburger menu on devices and
concluded that it needs to disappear
Mike Ryan presented at UXPA slideshare.
net/ryaninteractive/hamburger-wars-5-2015
Hamburger: the
evidence
● Ryan looked at results of six
usability tests in 2013-2014
● 71 out of 76 participants failed
tasks when it required the use of
the hamburger menu icon
● Users don’t know what to expect
under the icon and, once they do
look at its contents, they need to
memorize it
Hamburger:
often to bloated
menus
● As computer screens became
bloated, more menu items were
added
● "The hamburger icon, used most
egregiously, allows you to put 500
options into a mobile app without
doing the hard work of actually
figuring out what belongs there," -
Luke Wroblewski
Hamburger:
more evidence
● For the big online players this is a
bottom line issue
● Apps are removing it—
○ iPad in May 2015,
○ NBC News in July 2014, and
○ Amazon in May 2015
● Most of the top iPhone apps other
than Google ones use a tabbed
menu
Hamburger: I
already ordered
Well that was 2014 … people “get it”
now. But DO they?
● Researcher in New Zealand
continues to test and things are
improving gradually
Some things can help:
● Add the word "menu" under the icon
increases use by 7.2%
● Make the icon into a button by
adding a box, use is up by 22.4%.
● Replace the lines with the word
"menu" 20% more people click it
“Slippy” vs
“sticky”
Jake Zukowski from Frog Design, coined
the term “slippy UX” to describe
designing interactions that are very
brief, have a low focus of attention, and
require minimal copy
“Slippy” vs
“sticky”
“Sticky” website design’s goal was
focused on keeping visitors on your site
longer leading to sales, return visits and
greater loyalty
“Slippy” is low attention, glanceable,
graphic, lightweight interactivity
“Slippy” vs
“sticky”
● Beacon pushed notifications
● Wayfinding apps on smartphones
● Account dash boards on web or
online “states”
● Infographic of free study carrels or
computers
● Open libraries ... lights
Slippy UX techniques can help create a
harmonious experience that not only
works but also does so with finesse
UX of time
based
interactions
● Beacons: “Slippy” + time-based +
geography
● Pushed information:
Going to rain in 15 minutes
Uber arriving in 4 minutes
● “Advanced excel class starting in
30 minutes. Seats still available”
An emerging
framework for
understanding
user behaviors
Digital natives:
● “Digital natives possess inferior
social skills or are more likely to
avoid personal interaction in favor
of digital interac
● “Digital natives are much better at
multitasking than digital
immigrants.”
● “Digital natives have natural
instincts about how to use or fix
computers and other digital
products.”
An emerging
framework for
understanding
user behaviors
FALSE
An emerging
framework for
understanding
user behaviors
Visitor/resident model based on
research from OCLC and JISC
An emerging
framework for
understanding
user behaviors
Everyone’s digital life a combination of
being “resident” in some places,
personal or institutional, and a “visitor”
in others, personal or institutional
Visitor vs.
resident and UX
A tool to help inform where/how to
● Design your products & services
■ Residency vs. ephemerality to
inform design
● For maximum engagement with
your constituent groups
Questions?
Thank you

More Related Content

What's hot

UX Bootcamp Fall 2015 General Assembly
UX Bootcamp Fall 2015 General AssemblyUX Bootcamp Fall 2015 General Assembly
UX Bootcamp Fall 2015 General AssemblyJacklyn Burgan
 
Learning to Be Lean (LDS.org Homepage Redesign Case Study)
Learning to Be Lean (LDS.org Homepage Redesign Case Study)Learning to Be Lean (LDS.org Homepage Redesign Case Study)
Learning to Be Lean (LDS.org Homepage Redesign Case Study)James Valentine, MSC
 
#1NLab14: Responsive Design
#1NLab14: Responsive Design#1NLab14: Responsive Design
#1NLab14: Responsive DesignOne North
 
UX-led Content Strategy (UXPA webinar)
UX-led Content Strategy (UXPA webinar)UX-led Content Strategy (UXPA webinar)
UX-led Content Strategy (UXPA webinar)Mike Donahue
 
Agile + Lean Startup principles + Lean UX -> How to make it all work together!
Agile + Lean Startup principles + Lean UX -> How to make it all work together!Agile + Lean Startup principles + Lean UX -> How to make it all work together!
Agile + Lean Startup principles + Lean UX -> How to make it all work together!Amrita Aviyente
 
Developing Library Staff Skills for Mobile Technology
Developing Library Staff Skills for Mobile TechnologyDeveloping Library Staff Skills for Mobile Technology
Developing Library Staff Skills for Mobile TechnologyChad Mairn
 
Practical UX Methods - as presented at FOWD 2014
Practical UX Methods - as presented at FOWD 2014Practical UX Methods - as presented at FOWD 2014
Practical UX Methods - as presented at FOWD 2014Patrick McNeil
 
NoVA UX Responsive Design
NoVA UX Responsive DesignNoVA UX Responsive Design
NoVA UX Responsive DesignUXMattFiore
 
Great American Teach In - What is UX
Great American Teach In - What is UXGreat American Teach In - What is UX
Great American Teach In - What is UXMike Gallers
 
Devmento발표100525
Devmento발표100525Devmento발표100525
Devmento발표100525jinwook shin
 
3 Methods to Master Agile UX Testing | UserZoom Webinar
3 Methods to Master Agile UX Testing | UserZoom Webinar3 Methods to Master Agile UX Testing | UserZoom Webinar
3 Methods to Master Agile UX Testing | UserZoom WebinarUserZoom
 
"Empathy Behind the Algorithms" by Chris Corak - Now What? Conference 2017
"Empathy Behind the Algorithms" by Chris Corak - Now What? Conference 2017"Empathy Behind the Algorithms" by Chris Corak - Now What? Conference 2017
"Empathy Behind the Algorithms" by Chris Corak - Now What? Conference 2017Blend Interactive
 
14 timeless rules for creating intuitive web apps
14 timeless rules for creating intuitive web apps14 timeless rules for creating intuitive web apps
14 timeless rules for creating intuitive web appsDev Technosys
 
The photo app knack pack oap
The photo app knack pack oapThe photo app knack pack oap
The photo app knack pack oapengaging
 
The perfect ux designer toolkit
The perfect ux designer toolkitThe perfect ux designer toolkit
The perfect ux designer toolkitcxpartners
 

What's hot (20)

UX Bootcamp Fall 2015 General Assembly
UX Bootcamp Fall 2015 General AssemblyUX Bootcamp Fall 2015 General Assembly
UX Bootcamp Fall 2015 General Assembly
 
Learning to Be Lean (LDS.org Homepage Redesign Case Study)
Learning to Be Lean (LDS.org Homepage Redesign Case Study)Learning to Be Lean (LDS.org Homepage Redesign Case Study)
Learning to Be Lean (LDS.org Homepage Redesign Case Study)
 
#1NLab14: Responsive Design
#1NLab14: Responsive Design#1NLab14: Responsive Design
#1NLab14: Responsive Design
 
Uxperts mobi 2013 soa & challenges
Uxperts mobi 2013   soa & challengesUxperts mobi 2013   soa & challenges
Uxperts mobi 2013 soa & challenges
 
UX-led Content Strategy (UXPA webinar)
UX-led Content Strategy (UXPA webinar)UX-led Content Strategy (UXPA webinar)
UX-led Content Strategy (UXPA webinar)
 
Agile + Lean Startup principles + Lean UX -> How to make it all work together!
Agile + Lean Startup principles + Lean UX -> How to make it all work together!Agile + Lean Startup principles + Lean UX -> How to make it all work together!
Agile + Lean Startup principles + Lean UX -> How to make it all work together!
 
So much UX data! Now what?
So much UX data! Now what?So much UX data! Now what?
So much UX data! Now what?
 
Developing Library Staff Skills for Mobile Technology
Developing Library Staff Skills for Mobile TechnologyDeveloping Library Staff Skills for Mobile Technology
Developing Library Staff Skills for Mobile Technology
 
Practical UX Methods - as presented at FOWD 2014
Practical UX Methods - as presented at FOWD 2014Practical UX Methods - as presented at FOWD 2014
Practical UX Methods - as presented at FOWD 2014
 
NoVA UX Responsive Design
NoVA UX Responsive DesignNoVA UX Responsive Design
NoVA UX Responsive Design
 
Great American Teach In - What is UX
Great American Teach In - What is UXGreat American Teach In - What is UX
Great American Teach In - What is UX
 
Devmento발표100525
Devmento발표100525Devmento발표100525
Devmento발표100525
 
3 Methods to Master Agile UX Testing | UserZoom Webinar
3 Methods to Master Agile UX Testing | UserZoom Webinar3 Methods to Master Agile UX Testing | UserZoom Webinar
3 Methods to Master Agile UX Testing | UserZoom Webinar
 
OLPC 2.0
OLPC 2.0OLPC 2.0
OLPC 2.0
 
"Empathy Behind the Algorithms" by Chris Corak - Now What? Conference 2017
"Empathy Behind the Algorithms" by Chris Corak - Now What? Conference 2017"Empathy Behind the Algorithms" by Chris Corak - Now What? Conference 2017
"Empathy Behind the Algorithms" by Chris Corak - Now What? Conference 2017
 
14 timeless rules for creating intuitive web apps
14 timeless rules for creating intuitive web apps14 timeless rules for creating intuitive web apps
14 timeless rules for creating intuitive web apps
 
Why responsive web design matters
Why responsive web design mattersWhy responsive web design matters
Why responsive web design matters
 
The photo app knack pack oap
The photo app knack pack oapThe photo app knack pack oap
The photo app knack pack oap
 
Popup Doomsday crash course
Popup Doomsday crash coursePopup Doomsday crash course
Popup Doomsday crash course
 
The perfect ux designer toolkit
The perfect ux designer toolkitThe perfect ux designer toolkit
The perfect ux designer toolkit
 

Viewers also liked

Opened 2015 presentation
Opened 2015 presentationOpened 2015 presentation
Opened 2015 presentationphb256
 
Panel on Digital Literacy - Day of Digital Humanities
Panel on Digital Literacy - Day of Digital HumanitiesPanel on Digital Literacy - Day of Digital Humanities
Panel on Digital Literacy - Day of Digital Humanitiesphb256
 
An inquiry driven classroom: letting students lead the way
An inquiry driven classroom: letting students lead the way An inquiry driven classroom: letting students lead the way
An inquiry driven classroom: letting students lead the way phb256
 
MOOCs and Libraries: What is our role?
MOOCs and Libraries: What is our role?MOOCs and Libraries: What is our role?
MOOCs and Libraries: What is our role?phb256
 
Building the plane in the air (and letting the students chart the course)
Building the plane in the air (and letting the students chart the course)Building the plane in the air (and letting the students chart the course)
Building the plane in the air (and letting the students chart the course)phb256
 
From OER to IL and back again
From OER to IL and back againFrom OER to IL and back again
From OER to IL and back againphb256
 
Bibliometric measures to demonstrate impact
Bibliometric measures to demonstrate impactBibliometric measures to demonstrate impact
Bibliometric measures to demonstrate impactBerenika Webster
 
Increase visibility of your research
Increase visibility of your researchIncrease visibility of your research
Increase visibility of your researchBerenika Webster
 
Library Assessment: principles and practice
Library Assessment: principles and practiceLibrary Assessment: principles and practice
Library Assessment: principles and practiceBerenika Webster
 
What are oer2
What are oer2What are oer2
What are oer2phb256
 
Criss Cross: One hand washes the other
Criss Cross: One hand washes the otherCriss Cross: One hand washes the other
Criss Cross: One hand washes the otherphb256
 
Adaptive Navigation Support and Open Social Learner Modeling for PAL
Adaptive Navigation Support and Open Social Learner Modeling for PALAdaptive Navigation Support and Open Social Learner Modeling for PAL
Adaptive Navigation Support and Open Social Learner Modeling for PALPeter Brusilovsky
 

Viewers also liked (15)

Opened 2015 presentation
Opened 2015 presentationOpened 2015 presentation
Opened 2015 presentation
 
Panel on Digital Literacy - Day of Digital Humanities
Panel on Digital Literacy - Day of Digital HumanitiesPanel on Digital Literacy - Day of Digital Humanities
Panel on Digital Literacy - Day of Digital Humanities
 
An inquiry driven classroom: letting students lead the way
An inquiry driven classroom: letting students lead the way An inquiry driven classroom: letting students lead the way
An inquiry driven classroom: letting students lead the way
 
MOOCs and Libraries: What is our role?
MOOCs and Libraries: What is our role?MOOCs and Libraries: What is our role?
MOOCs and Libraries: What is our role?
 
Twitter Wake Up Call
Twitter Wake Up CallTwitter Wake Up Call
Twitter Wake Up Call
 
Building the plane in the air (and letting the students chart the course)
Building the plane in the air (and letting the students chart the course)Building the plane in the air (and letting the students chart the course)
Building the plane in the air (and letting the students chart the course)
 
From OER to IL and back again
From OER to IL and back againFrom OER to IL and back again
From OER to IL and back again
 
Bibliometric measures to demonstrate impact
Bibliometric measures to demonstrate impactBibliometric measures to demonstrate impact
Bibliometric measures to demonstrate impact
 
Evidence based practice
Evidence based practiceEvidence based practice
Evidence based practice
 
Increase visibility of your research
Increase visibility of your researchIncrease visibility of your research
Increase visibility of your research
 
Library Assessment: principles and practice
Library Assessment: principles and practiceLibrary Assessment: principles and practice
Library Assessment: principles and practice
 
What are oer2
What are oer2What are oer2
What are oer2
 
Criss Cross: One hand washes the other
Criss Cross: One hand washes the otherCriss Cross: One hand washes the other
Criss Cross: One hand washes the other
 
Adaptive Navigation Support and Open Social Learner Modeling for PAL
Adaptive Navigation Support and Open Social Learner Modeling for PALAdaptive Navigation Support and Open Social Learner Modeling for PAL
Adaptive Navigation Support and Open Social Learner Modeling for PAL
 
Survey design basics
Survey design basicsSurvey design basics
Survey design basics
 

Similar to UX patterns & practices for libraries

UX and UI Workshops - User Journey
UX and UI Workshops - User JourneyUX and UI Workshops - User Journey
UX and UI Workshops - User JourneyInwedo
 
User Research on a Shoestring
User Research on a ShoestringUser Research on a Shoestring
User Research on a Shoestringteaguese
 
UX Masterclass at muru-D
UX Masterclass at muru-DUX Masterclass at muru-D
UX Masterclass at muru-DDoralin Kelly
 
Do’s and don’ts for a successful UX design
Do’s and don’ts for a successful UX designDo’s and don’ts for a successful UX design
Do’s and don’ts for a successful UX designSiva Prasadh G
 
"Open" includes users - Leverage their input
"Open" includes users - Leverage their input"Open" includes users - Leverage their input
"Open" includes users - Leverage their inputRandy Earl
 
Case study OOPS .pptx
Case study OOPS .pptxCase study OOPS .pptx
Case study OOPS .pptxssuserc6f5161
 
Technologies: Expert in the Room Webinar: Optimizing your Website for Mobile
Technologies: Expert in the Room Webinar: Optimizing your Website for MobileTechnologies: Expert in the Room Webinar: Optimizing your Website for Mobile
Technologies: Expert in the Room Webinar: Optimizing your Website for MobileRandstad USA
 
User Experience Masterclass 101 with Mark Swaine
User Experience Masterclass 101 with Mark SwaineUser Experience Masterclass 101 with Mark Swaine
User Experience Masterclass 101 with Mark SwaineMark N Swaine
 
Building a wow product by @RuthlessUx
Building a wow product by @RuthlessUxBuilding a wow product by @RuthlessUx
Building a wow product by @RuthlessUxSHAHEENA ATTARWALA
 
How Do You Know if Your Project Is Any Good?
How Do You Know if Your Project Is Any Good?How Do You Know if Your Project Is Any Good?
How Do You Know if Your Project Is Any Good?All Things Open
 
Principles of Interactive Design
Principles of Interactive DesignPrinciples of Interactive Design
Principles of Interactive DesignKaren Krull
 
Como os usuários estão interagindo com a Oppa?
Como os usuários estão interagindo com a Oppa?Como os usuários estão interagindo com a Oppa?
Como os usuários estão interagindo com a Oppa?Vitor Amorim
 
Usability: whats the use? Presented by We are Sigma and PRWD
Usability: whats the use? Presented by We are Sigma and PRWDUsability: whats the use? Presented by We are Sigma and PRWD
Usability: whats the use? Presented by We are Sigma and PRWDNexer Digital
 
UX: Interaction Design
UX: Interaction DesignUX: Interaction Design
UX: Interaction DesignAngela Duggan
 
Mobile first - one key important aspect in digitalisation
Mobile first - one key important aspect in digitalisationMobile first - one key important aspect in digitalisation
Mobile first - one key important aspect in digitalisationHelmi Hasan
 

Similar to UX patterns & practices for libraries (20)

UX and UI Workshops - User Journey
UX and UI Workshops - User JourneyUX and UI Workshops - User Journey
UX and UI Workshops - User Journey
 
User Research on a Shoestring
User Research on a ShoestringUser Research on a Shoestring
User Research on a Shoestring
 
UX Masterclass at muru-D
UX Masterclass at muru-DUX Masterclass at muru-D
UX Masterclass at muru-D
 
Do’s and don’ts for a successful UX design
Do’s and don’ts for a successful UX designDo’s and don’ts for a successful UX design
Do’s and don’ts for a successful UX design
 
"Open" includes users - Leverage their input
"Open" includes users - Leverage their input"Open" includes users - Leverage their input
"Open" includes users - Leverage their input
 
Case study OOPS .pptx
Case study OOPS .pptxCase study OOPS .pptx
Case study OOPS .pptx
 
Technologies: Expert in the Room Webinar: Optimizing your Website for Mobile
Technologies: Expert in the Room Webinar: Optimizing your Website for MobileTechnologies: Expert in the Room Webinar: Optimizing your Website for Mobile
Technologies: Expert in the Room Webinar: Optimizing your Website for Mobile
 
User Experience Masterclass 101 with Mark Swaine
User Experience Masterclass 101 with Mark SwaineUser Experience Masterclass 101 with Mark Swaine
User Experience Masterclass 101 with Mark Swaine
 
Biz Product Learnings
Biz Product LearningsBiz Product Learnings
Biz Product Learnings
 
Building a wow product by @RuthlessUx
Building a wow product by @RuthlessUxBuilding a wow product by @RuthlessUx
Building a wow product by @RuthlessUx
 
Week 4 - tablet app design
Week 4 - tablet app designWeek 4 - tablet app design
Week 4 - tablet app design
 
How Do You Know if Your Project Is Any Good?
How Do You Know if Your Project Is Any Good?How Do You Know if Your Project Is Any Good?
How Do You Know if Your Project Is Any Good?
 
Principles of Interactive Design
Principles of Interactive DesignPrinciples of Interactive Design
Principles of Interactive Design
 
Como os usuários estão interagindo com a Oppa?
Como os usuários estão interagindo com a Oppa?Como os usuários estão interagindo com a Oppa?
Como os usuários estão interagindo com a Oppa?
 
Usability: whats the use? Presented by We are Sigma and PRWD
Usability: whats the use? Presented by We are Sigma and PRWDUsability: whats the use? Presented by We are Sigma and PRWD
Usability: whats the use? Presented by We are Sigma and PRWD
 
UX: Interaction Design
UX: Interaction DesignUX: Interaction Design
UX: Interaction Design
 
What ux is
What ux isWhat ux is
What ux is
 
UXPA 2023: F@#$ User Personas
UXPA 2023: F@#$ User PersonasUXPA 2023: F@#$ User Personas
UXPA 2023: F@#$ User Personas
 
VIGC Academy
VIGC AcademyVIGC Academy
VIGC Academy
 
Mobile first - one key important aspect in digitalisation
Mobile first - one key important aspect in digitalisationMobile first - one key important aspect in digitalisation
Mobile first - one key important aspect in digitalisation
 

More from Jeff Wisniewski

Gathering & Presenting User Input
Gathering & Presenting User InputGathering & Presenting User Input
Gathering & Presenting User InputJeff Wisniewski
 
Advanced Google Analytics
Advanced Google AnalyticsAdvanced Google Analytics
Advanced Google AnalyticsJeff Wisniewski
 
Responsive Web Design from the Trenches
Responsive Web Design from the TrenchesResponsive Web Design from the Trenches
Responsive Web Design from the TrenchesJeff Wisniewski
 
Beyond Task Based Testing: Interviews and Personas
Beyond Task Based Testing: Interviews and PersonasBeyond Task Based Testing: Interviews and Personas
Beyond Task Based Testing: Interviews and PersonasJeff Wisniewski
 
Data: Digging Deeper and Displaying
Data: Digging Deeper and DisplayingData: Digging Deeper and Displaying
Data: Digging Deeper and DisplayingJeff Wisniewski
 
Reinventing Spaces and Places
Reinventing Spaces and PlacesReinventing Spaces and Places
Reinventing Spaces and PlacesJeff Wisniewski
 
Web Scale Discovery Reality Check
Web Scale Discovery Reality CheckWeb Scale Discovery Reality Check
Web Scale Discovery Reality CheckJeff Wisniewski
 
Introduction to google analytics
Introduction to google analyticsIntroduction to google analytics
Introduction to google analyticsJeff Wisniewski
 
Advanced Google Analytics
Advanced Google AnalyticsAdvanced Google Analytics
Advanced Google AnalyticsJeff Wisniewski
 
Mobile First and Tablet-Centric Design
Mobile First and Tablet-Centric DesignMobile First and Tablet-Centric Design
Mobile First and Tablet-Centric DesignJeff Wisniewski
 
Google Analytics Goals and Funnels
Google Analytics Goals and FunnelsGoogle Analytics Goals and Funnels
Google Analytics Goals and FunnelsJeff Wisniewski
 
Sharepoint tips and tricks
Sharepoint tips and tricksSharepoint tips and tricks
Sharepoint tips and tricksJeff Wisniewski
 
Tools for Social Media Monitoring
Tools for Social Media MonitoringTools for Social Media Monitoring
Tools for Social Media MonitoringJeff Wisniewski
 
Mobile that works for your library
Mobile that works for your libraryMobile that works for your library
Mobile that works for your libraryJeff Wisniewski
 

More from Jeff Wisniewski (20)

Gathering & Presenting User Input
Gathering & Presenting User InputGathering & Presenting User Input
Gathering & Presenting User Input
 
Advanced Google Analytics
Advanced Google AnalyticsAdvanced Google Analytics
Advanced Google Analytics
 
Responsive Web Design from the Trenches
Responsive Web Design from the TrenchesResponsive Web Design from the Trenches
Responsive Web Design from the Trenches
 
Beyond Task Based Testing: Interviews and Personas
Beyond Task Based Testing: Interviews and PersonasBeyond Task Based Testing: Interviews and Personas
Beyond Task Based Testing: Interviews and Personas
 
Data: Digging Deeper and Displaying
Data: Digging Deeper and DisplayingData: Digging Deeper and Displaying
Data: Digging Deeper and Displaying
 
Reinventing Spaces and Places
Reinventing Spaces and PlacesReinventing Spaces and Places
Reinventing Spaces and Places
 
Web Scale Discovery Reality Check
Web Scale Discovery Reality CheckWeb Scale Discovery Reality Check
Web Scale Discovery Reality Check
 
Introduction to google analytics
Introduction to google analyticsIntroduction to google analytics
Introduction to google analytics
 
Advanced Google Analytics
Advanced Google AnalyticsAdvanced Google Analytics
Advanced Google Analytics
 
Mobile First and Tablet-Centric Design
Mobile First and Tablet-Centric DesignMobile First and Tablet-Centric Design
Mobile First and Tablet-Centric Design
 
Mobile Tools and Trends
Mobile Tools and TrendsMobile Tools and Trends
Mobile Tools and Trends
 
Google Analytics Goals and Funnels
Google Analytics Goals and FunnelsGoogle Analytics Goals and Funnels
Google Analytics Goals and Funnels
 
Writing for the Web
Writing for the WebWriting for the Web
Writing for the Web
 
Sharepoint tips and tricks
Sharepoint tips and tricksSharepoint tips and tricks
Sharepoint tips and tricks
 
Mobile Usability
Mobile UsabilityMobile Usability
Mobile Usability
 
Google A
Google AGoogle A
Google A
 
Tools for Social Media Monitoring
Tools for Social Media MonitoringTools for Social Media Monitoring
Tools for Social Media Monitoring
 
Mobile usability
Mobile usabilityMobile usability
Mobile usability
 
Discovering Discovery
Discovering DiscoveryDiscovering Discovery
Discovering Discovery
 
Mobile that works for your library
Mobile that works for your libraryMobile that works for your library
Mobile that works for your library
 

Recently uploaded

Packaging the Monolith - PHP Tek 2024 (Breaking it down one bite at a time)
Packaging the Monolith - PHP Tek 2024 (Breaking it down one bite at a time)Packaging the Monolith - PHP Tek 2024 (Breaking it down one bite at a time)
Packaging the Monolith - PHP Tek 2024 (Breaking it down one bite at a time)Dana Luther
 
定制(Lincoln毕业证书)新西兰林肯大学毕业证成绩单原版一比一
定制(Lincoln毕业证书)新西兰林肯大学毕业证成绩单原版一比一定制(Lincoln毕业证书)新西兰林肯大学毕业证成绩单原版一比一
定制(Lincoln毕业证书)新西兰林肯大学毕业证成绩单原版一比一Fs
 
办理(UofR毕业证书)罗切斯特大学毕业证成绩单原版一比一
办理(UofR毕业证书)罗切斯特大学毕业证成绩单原版一比一办理(UofR毕业证书)罗切斯特大学毕业证成绩单原版一比一
办理(UofR毕业证书)罗切斯特大学毕业证成绩单原版一比一z xss
 
Magic exist by Marta Loveguard - presentation.pptx
Magic exist by Marta Loveguard - presentation.pptxMagic exist by Marta Loveguard - presentation.pptx
Magic exist by Marta Loveguard - presentation.pptxMartaLoveguard
 
Font Performance - NYC WebPerf Meetup April '24
Font Performance - NYC WebPerf Meetup April '24Font Performance - NYC WebPerf Meetup April '24
Font Performance - NYC WebPerf Meetup April '24Paul Calvano
 
定制(AUT毕业证书)新西兰奥克兰理工大学毕业证成绩单原版一比一
定制(AUT毕业证书)新西兰奥克兰理工大学毕业证成绩单原版一比一定制(AUT毕业证书)新西兰奥克兰理工大学毕业证成绩单原版一比一
定制(AUT毕业证书)新西兰奥克兰理工大学毕业证成绩单原版一比一Fs
 
Call Girls Near The Suryaa Hotel New Delhi 9873777170
Call Girls Near The Suryaa Hotel New Delhi 9873777170Call Girls Near The Suryaa Hotel New Delhi 9873777170
Call Girls Near The Suryaa Hotel New Delhi 9873777170Sonam Pathan
 
Call Girls South Delhi Delhi reach out to us at ☎ 9711199012
Call Girls South Delhi Delhi reach out to us at ☎ 9711199012Call Girls South Delhi Delhi reach out to us at ☎ 9711199012
Call Girls South Delhi Delhi reach out to us at ☎ 9711199012rehmti665
 
Call Girls Service Adil Nagar 7001305949 Need escorts Service Pooja Vip
Call Girls Service Adil Nagar 7001305949 Need escorts Service Pooja VipCall Girls Service Adil Nagar 7001305949 Need escorts Service Pooja Vip
Call Girls Service Adil Nagar 7001305949 Need escorts Service Pooja VipCall Girls Lucknow
 
Blepharitis inflammation of eyelid symptoms cause everything included along w...
Blepharitis inflammation of eyelid symptoms cause everything included along w...Blepharitis inflammation of eyelid symptoms cause everything included along w...
Blepharitis inflammation of eyelid symptoms cause everything included along w...Excelmac1
 
Call Girls In The Ocean Pearl Retreat Hotel New Delhi 9873777170
Call Girls In The Ocean Pearl Retreat Hotel New Delhi 9873777170Call Girls In The Ocean Pearl Retreat Hotel New Delhi 9873777170
Call Girls In The Ocean Pearl Retreat Hotel New Delhi 9873777170Sonam Pathan
 
Potsdam FH学位证,波茨坦应用技术大学毕业证书1:1制作
Potsdam FH学位证,波茨坦应用技术大学毕业证书1:1制作Potsdam FH学位证,波茨坦应用技术大学毕业证书1:1制作
Potsdam FH学位证,波茨坦应用技术大学毕业证书1:1制作ys8omjxb
 
Contact Rya Baby for Call Girls New Delhi
Contact Rya Baby for Call Girls New DelhiContact Rya Baby for Call Girls New Delhi
Contact Rya Baby for Call Girls New Delhimiss dipika
 
A Good Girl's Guide to Murder (A Good Girl's Guide to Murder, #1)
A Good Girl's Guide to Murder (A Good Girl's Guide to Murder, #1)A Good Girl's Guide to Murder (A Good Girl's Guide to Murder, #1)
A Good Girl's Guide to Murder (A Good Girl's Guide to Murder, #1)Christopher H Felton
 
定制(Management毕业证书)新加坡管理大学毕业证成绩单原版一比一
定制(Management毕业证书)新加坡管理大学毕业证成绩单原版一比一定制(Management毕业证书)新加坡管理大学毕业证成绩单原版一比一
定制(Management毕业证书)新加坡管理大学毕业证成绩单原版一比一Fs
 
Top 10 Interactive Website Design Trends in 2024.pptx
Top 10 Interactive Website Design Trends in 2024.pptxTop 10 Interactive Website Design Trends in 2024.pptx
Top 10 Interactive Website Design Trends in 2024.pptxDyna Gilbert
 
Git and Github workshop GDSC MLRITM
Git and Github  workshop GDSC MLRITMGit and Github  workshop GDSC MLRITM
Git and Github workshop GDSC MLRITMgdsc13
 
PHP-based rendering of TYPO3 Documentation
PHP-based rendering of TYPO3 DocumentationPHP-based rendering of TYPO3 Documentation
PHP-based rendering of TYPO3 DocumentationLinaWolf1
 

Recently uploaded (20)

Packaging the Monolith - PHP Tek 2024 (Breaking it down one bite at a time)
Packaging the Monolith - PHP Tek 2024 (Breaking it down one bite at a time)Packaging the Monolith - PHP Tek 2024 (Breaking it down one bite at a time)
Packaging the Monolith - PHP Tek 2024 (Breaking it down one bite at a time)
 
young call girls in Uttam Nagar🔝 9953056974 🔝 Delhi escort Service
young call girls in Uttam Nagar🔝 9953056974 🔝 Delhi escort Serviceyoung call girls in Uttam Nagar🔝 9953056974 🔝 Delhi escort Service
young call girls in Uttam Nagar🔝 9953056974 🔝 Delhi escort Service
 
定制(Lincoln毕业证书)新西兰林肯大学毕业证成绩单原版一比一
定制(Lincoln毕业证书)新西兰林肯大学毕业证成绩单原版一比一定制(Lincoln毕业证书)新西兰林肯大学毕业证成绩单原版一比一
定制(Lincoln毕业证书)新西兰林肯大学毕业证成绩单原版一比一
 
办理(UofR毕业证书)罗切斯特大学毕业证成绩单原版一比一
办理(UofR毕业证书)罗切斯特大学毕业证成绩单原版一比一办理(UofR毕业证书)罗切斯特大学毕业证成绩单原版一比一
办理(UofR毕业证书)罗切斯特大学毕业证成绩单原版一比一
 
Magic exist by Marta Loveguard - presentation.pptx
Magic exist by Marta Loveguard - presentation.pptxMagic exist by Marta Loveguard - presentation.pptx
Magic exist by Marta Loveguard - presentation.pptx
 
Font Performance - NYC WebPerf Meetup April '24
Font Performance - NYC WebPerf Meetup April '24Font Performance - NYC WebPerf Meetup April '24
Font Performance - NYC WebPerf Meetup April '24
 
定制(AUT毕业证书)新西兰奥克兰理工大学毕业证成绩单原版一比一
定制(AUT毕业证书)新西兰奥克兰理工大学毕业证成绩单原版一比一定制(AUT毕业证书)新西兰奥克兰理工大学毕业证成绩单原版一比一
定制(AUT毕业证书)新西兰奥克兰理工大学毕业证成绩单原版一比一
 
Call Girls Near The Suryaa Hotel New Delhi 9873777170
Call Girls Near The Suryaa Hotel New Delhi 9873777170Call Girls Near The Suryaa Hotel New Delhi 9873777170
Call Girls Near The Suryaa Hotel New Delhi 9873777170
 
Call Girls South Delhi Delhi reach out to us at ☎ 9711199012
Call Girls South Delhi Delhi reach out to us at ☎ 9711199012Call Girls South Delhi Delhi reach out to us at ☎ 9711199012
Call Girls South Delhi Delhi reach out to us at ☎ 9711199012
 
Hot Sexy call girls in Rk Puram 🔝 9953056974 🔝 Delhi escort Service
Hot Sexy call girls in  Rk Puram 🔝 9953056974 🔝 Delhi escort ServiceHot Sexy call girls in  Rk Puram 🔝 9953056974 🔝 Delhi escort Service
Hot Sexy call girls in Rk Puram 🔝 9953056974 🔝 Delhi escort Service
 
Call Girls Service Adil Nagar 7001305949 Need escorts Service Pooja Vip
Call Girls Service Adil Nagar 7001305949 Need escorts Service Pooja VipCall Girls Service Adil Nagar 7001305949 Need escorts Service Pooja Vip
Call Girls Service Adil Nagar 7001305949 Need escorts Service Pooja Vip
 
Blepharitis inflammation of eyelid symptoms cause everything included along w...
Blepharitis inflammation of eyelid symptoms cause everything included along w...Blepharitis inflammation of eyelid symptoms cause everything included along w...
Blepharitis inflammation of eyelid symptoms cause everything included along w...
 
Call Girls In The Ocean Pearl Retreat Hotel New Delhi 9873777170
Call Girls In The Ocean Pearl Retreat Hotel New Delhi 9873777170Call Girls In The Ocean Pearl Retreat Hotel New Delhi 9873777170
Call Girls In The Ocean Pearl Retreat Hotel New Delhi 9873777170
 
Potsdam FH学位证,波茨坦应用技术大学毕业证书1:1制作
Potsdam FH学位证,波茨坦应用技术大学毕业证书1:1制作Potsdam FH学位证,波茨坦应用技术大学毕业证书1:1制作
Potsdam FH学位证,波茨坦应用技术大学毕业证书1:1制作
 
Contact Rya Baby for Call Girls New Delhi
Contact Rya Baby for Call Girls New DelhiContact Rya Baby for Call Girls New Delhi
Contact Rya Baby for Call Girls New Delhi
 
A Good Girl's Guide to Murder (A Good Girl's Guide to Murder, #1)
A Good Girl's Guide to Murder (A Good Girl's Guide to Murder, #1)A Good Girl's Guide to Murder (A Good Girl's Guide to Murder, #1)
A Good Girl's Guide to Murder (A Good Girl's Guide to Murder, #1)
 
定制(Management毕业证书)新加坡管理大学毕业证成绩单原版一比一
定制(Management毕业证书)新加坡管理大学毕业证成绩单原版一比一定制(Management毕业证书)新加坡管理大学毕业证成绩单原版一比一
定制(Management毕业证书)新加坡管理大学毕业证成绩单原版一比一
 
Top 10 Interactive Website Design Trends in 2024.pptx
Top 10 Interactive Website Design Trends in 2024.pptxTop 10 Interactive Website Design Trends in 2024.pptx
Top 10 Interactive Website Design Trends in 2024.pptx
 
Git and Github workshop GDSC MLRITM
Git and Github  workshop GDSC MLRITMGit and Github  workshop GDSC MLRITM
Git and Github workshop GDSC MLRITM
 
PHP-based rendering of TYPO3 Documentation
PHP-based rendering of TYPO3 DocumentationPHP-based rendering of TYPO3 Documentation
PHP-based rendering of TYPO3 Documentation
 

UX patterns & practices for libraries

  • 1. ux patterns & practices Jeff Wisniewski & Darlene Fichter Computers in Libraries March 8, 2016
  • 2. Outline What’s emerging Research findings show us what to do, what not to do
  • 3. Changes for UX & UX Designers ● Ubiquitous ● UX /usability is a line in many job descriptions ● Spending hours on pixel gazing is passee
  • 4. For the price of pizza you can Get a better quality, responsive website design and framework than most in- house designers & developers can provide
  • 5. The machines are coming Squarespace: Just add content and push a button Why now?
  • 6. Emotional design ● Usable is a baseline to work from ● Emotional design seeks to create human to machine interactions that feel more like human to human ones ● “Conversational” flow ● Empathy is key ● While we usually seek to elicit positive emotions, acknowledging negative ones is also valid
  • 7. Emotional user experience: Traits, events, and states ● Individual differences in emotional responses in human–technology interaction were investigated ● Self-confidence of the user affects emotional user experience By Jussi P.P. Jokinen,International Journal of Human- Computer Studies Volume 76, April 2015, Pages 67–77
  • 8.
  • 9. I don’t feel so good ● starting a research paper ● looking for a job ● tax help Relentless optimism is annoying
  • 10. UX Methods & Tools ● Task based testing ● Eye - tracking ● Informal testing ○ “pop up” study ○ signage ○ paper prototyping ● Ethnographic methods
  • 11. Microfeedback Dublin Airport - emojis Sarah Doody. Everyday UX. http://www.sarahdoody. com/everyday-ux-example-microfeedback- dublin-airport/#.Vt7zfPkrKxl
  • 12. But I my assumptions I love them so much, I think they're facts Beware of your assumptions. Prototyping is all about testing assumptions with real people
  • 13. Research Caveats ● Keep in the mind the study participants may not be like your audience ● More often than not the results will be true for your target audience
  • 14. Logo placement Top left or top right. Does it matter?
  • 15. Logo placement Users are 89% more likely to remember logos shown in the traditional top-left position than logos placed on the right https://www.nngroup.com/articles/logo-placement- brand-recall/
  • 16. Is “Home” option on the menu really necessary? Or does “clicking the logo” to go to the home page suffice?
  • 17. The Home Link is Dead. Long Live the Home Link! Danielle Cooley & Nikki Bristo http://dgcooley.com/storage/uxpa_poster_ol.pdf Logo only = 17% can’t find home Logo + home = 2% can’t find home
  • 18. User knows that clicking the logo goes to the home page So, the clicking the logo is just as good as having a menu option, right?
  • 19. Logo alone= 6.5 seconds Logo + home= 3.2 seconds Significantly quicker
  • 20. Page weight Pages are getting?
  • 23. Page weight Heavy pages= bad UX Be kind, optimize https://developers.google. com/web/fundamentals/performance/? hl=en
  • 25.
  • 26. Search result layout “There was little consensus as to how the results were ordered in the grid, unlike the list layout.” http://usabilitynews.org/how-do-users-view-search- results-presented-in-a-grid-layout/
  • 29.
  • 31. Hamburger: It’s everywhere so, it’s good? Mike Ryan took a comprehensive look at the evidence for and against using a hamburger menu on devices and concluded that it needs to disappear Mike Ryan presented at UXPA slideshare. net/ryaninteractive/hamburger-wars-5-2015
  • 32. Hamburger: the evidence ● Ryan looked at results of six usability tests in 2013-2014 ● 71 out of 76 participants failed tasks when it required the use of the hamburger menu icon ● Users don’t know what to expect under the icon and, once they do look at its contents, they need to memorize it
  • 33. Hamburger: often to bloated menus ● As computer screens became bloated, more menu items were added ● "The hamburger icon, used most egregiously, allows you to put 500 options into a mobile app without doing the hard work of actually figuring out what belongs there," - Luke Wroblewski
  • 34. Hamburger: more evidence ● For the big online players this is a bottom line issue ● Apps are removing it— ○ iPad in May 2015, ○ NBC News in July 2014, and ○ Amazon in May 2015 ● Most of the top iPhone apps other than Google ones use a tabbed menu
  • 35. Hamburger: I already ordered Well that was 2014 … people “get it” now. But DO they? ● Researcher in New Zealand continues to test and things are improving gradually Some things can help: ● Add the word "menu" under the icon increases use by 7.2% ● Make the icon into a button by adding a box, use is up by 22.4%. ● Replace the lines with the word "menu" 20% more people click it
  • 36. “Slippy” vs “sticky” Jake Zukowski from Frog Design, coined the term “slippy UX” to describe designing interactions that are very brief, have a low focus of attention, and require minimal copy
  • 37. “Slippy” vs “sticky” “Sticky” website design’s goal was focused on keeping visitors on your site longer leading to sales, return visits and greater loyalty “Slippy” is low attention, glanceable, graphic, lightweight interactivity
  • 38. “Slippy” vs “sticky” ● Beacon pushed notifications ● Wayfinding apps on smartphones ● Account dash boards on web or online “states” ● Infographic of free study carrels or computers ● Open libraries ... lights Slippy UX techniques can help create a harmonious experience that not only works but also does so with finesse
  • 39. UX of time based interactions ● Beacons: “Slippy” + time-based + geography ● Pushed information: Going to rain in 15 minutes Uber arriving in 4 minutes ● “Advanced excel class starting in 30 minutes. Seats still available”
  • 40. An emerging framework for understanding user behaviors Digital natives: ● “Digital natives possess inferior social skills or are more likely to avoid personal interaction in favor of digital interac ● “Digital natives are much better at multitasking than digital immigrants.” ● “Digital natives have natural instincts about how to use or fix computers and other digital products.”
  • 42. An emerging framework for understanding user behaviors Visitor/resident model based on research from OCLC and JISC
  • 43. An emerging framework for understanding user behaviors Everyone’s digital life a combination of being “resident” in some places, personal or institutional, and a “visitor” in others, personal or institutional
  • 44.
  • 45.
  • 46. Visitor vs. resident and UX A tool to help inform where/how to ● Design your products & services ■ Residency vs. ephemerality to inform design ● For maximum engagement with your constituent groups