ux patterns & practices
Post on 21-Jan-2018
308 Views
Preview:
TRANSCRIPT
ux patterns & practices
Jeff Wisniewski & Darlene FichterComputers in Libraries March 8, 2016
OutlineWhat’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
ResearchCaveats
● 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 Bristohttp://dgcooley.com/storage/uxpa_poster_ol.pdf
Logo only = 17% can’t find homeLogo + 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 secondsLogo + 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 weightHeavy 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 comprehensivelook 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
top related