Pragmatic Designer's Guide to Identity on the Web

1. Pragmatic Designer’s Guide to Identity
2. Introductions A fable People (are tricky) Past Present Future
3. Introduction
4. Usable Security Systems
5. YOU?
6. Identity
7. Identiﬁers
8. Logging in to stuff. Being logged in to stuff. Logging out of stuff.
9. Scylla (Security & technical stuff) Charybdis (Social stuff) Odysseus (This talk)
10. Fable
11. “Facebook wants to be your one true login.”
12. So what?
13. Fuzzy logging in (make fuzzy)
14. People are tricky.
15. They share computers. 95% had at least one shared computer 45% of computers were shared (35% single proﬁle / 28% shared proﬁle/ 38% mixed) Public vs. private areas Short tasks vs. long tasks
16. They share accounts.
17. They make up names. “At the Fieldston School in the Bronx, a class on Tolstoy resulted in some students adding Russian patronymics like -ovich and -ovna to their names.” - NY Times
18. They have multiple accounts. 38% of twitter users have 2+ accounts
19. They reuse passwords. Average user has ~25 password accounts Average user types ~8 distinct passwords / day Average password used ~6 different sites Correlation between password strength and reuse
20. They ignore security advice. (Rationally.) Estimated cost of phishing: $90 million. Estimated cost of following anti-phishing advice: $15.9 billion. Opportunity cost of reading all privacy policies: $781 billion / year.
21. The past
22. Login UI Username or email address? How do you navigate to the login? Where is the login in the site? How is it laid out on the page? What UI elements do you need to include? Sign in or log in? (Or login or log on?)
23. Usernames vs. email addresses (vs. real names) What you log in with isn’t necessarily what you display to the user or to other users. Usernames can be pseudonyms, which can be good and bad. Usernames are more easily forgotten, email addresses are more easily lost. Most systems only support one username, but many support multiple email addresses. The bigger you are, the bigger a namespace collision problem. With email addresses, it’s somebody else’s problem. Over time, most systems end up with usernames and email addresses (and real names and pictures).
24. Almost a Security Slide Login on home page vs. login on every page vs. login on special page Sadly, an operations vs. security vs. usability tradeoff Banks pick every page as they’re all https anyway Most other sites pick special page Some have https forms but not pages ...
25. I know what this means. And what this means. But what does this do?
26. No checkbox!
27. 12345$ /0-$0.$ /0-,.$ 67$ 6+$ /0-$,.$ +,-.$,.$ !"!!#$ %!"!!#$ &!"!!#$ '!"!!#$ (!"!!#$ )!"!!#$ *!"!!#$
28. Present
29. An Irreverent History of Authentication Weirdness 1. First, there was OpenID, which was a funny way to log in with URLs. (Almost) no one used it. 2. Then came mashups, and sites started asking for other sites’ passwords. This Was Bad. 3. Then came OAuth ...
30. Authentication Options The old-fashioned way “Logging in” via another service Implicitly being “logged in” via another service Combinations Multiple options
31. Control. Choice (and the paradox of). Communication. Access.
32. Future
33. “Identity” is an intimate and often contentious topic. One common refrain that interviewees mentioned was that people who maintained multiple online “identities” primarily used them for deviant purposes. These initial assumptions of deviance did not match my own ﬁndings... Not only do people have multiple identities for different public and private spheres, but they may also conduct a substantial portion of their interactions, online as well as offline, in different spheres. the combinations of public, private, online, and offline are often intermixed. - Ben Gross, Online Identiﬁers in Everyday Life
34. conclusions
35. questions? James Reffell @jreffell designcult.org james.reffell@gmail.com
36. References Identity in general Online Identiﬁers in Everyday Life (forthcoming), Ben Gross (http://bengross.com/) ReadWriteWeb story Facebook Wants to be Your One True Login, ReadWriteWeb (http://www.readwriteweb.com/archives/facebook_wants_to_be_your_one_true_login.php) People are tricky An Online Alias Keeps Colleges Off Their Trail, NY Times (http://www.nytimes.com/2010/04/25/fashion/25Noticed.html) A Large-Scale Study of Web Password Habits, Dinei Florencio & Cormac Henley (http://research.microsoft.com/apps/pubs/?id=74164) So Long, And No Thanks for all the Externalities: the Rational Rejection of Security Advice by Users, Cormac Henley (http://research.microsoft.com/users/cormac/papers/2009/SoLongAndNoThanks.pdf) The Cost of Reading Privacy Policies, Aleecia M. McDonald & Lorrie Faith Cranor I/S: A Journal of Law and Policy for the Information Society, 2008 Privacy Year in Review (http://www.is-journal.org/) How Many Twitter Accounts Do You Have? Techcrunch (http://techcrunch.com/2008/01/09/how-many-twitter-accounts-do-you-have/) Family Accounts: A new paradigm for user accounts within the home environment Serge Egelman, A.J. Brush, and Kori Inkpen (http://research.microsoft.com/apps/pubs/?id=74234)
37. Past References Web Form Design: Filling in the Blanks, Luke Wroblewski (http://www.rosenfeldmedia.com/books/webforms/) Designing for Social Traction, Joshua Porter (http://bokardo.com/archives/designing-for-social-traction-slide-deck/) Present Data Reveals Trends Among Social Media, JanRain http://blog.janrain.com/2010/04/data-reveals-trends-among-social-media.html Log in or sign uo with OpenID, Leah Culver (http://blog.leahculver.com/2009/11/log-in-or-sign-up-with-openid.html) Future Meebo pushes xAuth.org as solution to social network toolbar clutter problem, Scobleizer (http://www.youtube.com/watch?v=-UjXswWs7xg) Facebook and Radical Transparency (a rant), danah boyd (http://www.zephoria.org/thoughts/archives/2010/05/14/facebook-and-radical-transparency-a-rant.html) Identity in the Browser (Firefox), Aza Raskin (http://www.azarask.in/blog/post/identity-in-the-browser-ﬁrefox/) Account Manager Coming to Firefox, Mozilla (http://hacks.mozilla.org/2010/04/account-manager-coming-to-ﬁrefox/) OpenID Connect (http://openidconnect.com/)
38. Creative Commons Credits phil.d Joe Shlabotnik http://www.flickr.com/photos/phill_dvsn/393952186/ http://www.flickr.com/photos/joeshlabotnik/305410323/ NicksNotToShabby ryancr http://www.flickr.com/photos/nicksnottoshabby/4558725627/ http://www.flickr.com/photos/ryanr/142455033/ Jaume d'Urgell Roger Smith http://www.flickr.com/photos/jaumedurgell/740880616/ http://www.flickr.com/photos/rogersmith/3478145163/ bandita Kansas Sebastian http://www.flickr.com/photos/cosmic_bandita/2218419160/ http://www.flickr.com/photos/kansas_sebastian/4395356552/ jasohill c@rljones http://www.flickr.com/photos/jasohill/3711675312/ http://www.flickr.com/photos/_belial/414619731/

Editor's Notes

*How this talk in gonna work*

This talk will be a series of stories, with some numbers and bold assertions thrown in for later use. I'll start with a simple story, and get to some more complicated ones later.

There will be some time travel involved.

I'm going to leave a lot of room for questions. It'll be up on SlideShare later, with my notes and a lot of links to sources.

BUT FIRST: I'd like a show of hands. Events seem to be busy happening right now. So, audience:

Nitty gritty how to build the perfect login box, or a live Facebook chat?
I'm James, I'm a designer. I live in San Francisco, near the beach.
I worked in e-commerce (eBay) and search (Yahoo). I've done a lot of design pattern work.

Now I work at a little startup called Usable Security Systems, where I&#x2019;ve spent the past year or so thinking a lot about authentication and making user accounts and passwords nicer, which relates to this talk.

I'm a designer and I tend to emphasize the user experience and de-emphasize the technology, although there are some technical aspects to this talk which I'll atempt not to screw up.
That's me. Who are you?

I wrote this assuming you care about identity because it matters for something you're building, right now or very soon. I think you're also interested in the user experience aspects of identity on the web right now, but maybe a little wary of all the changes that have been happening.
There&#x2019;s a lot of definitions of identity, even limiting it to online. It covers a lot of ground.

Let's narrow down a little, maybe.
Ben Gross: &#x201C;alphanumeric strings that people and systems employ to differentiate users, objects, devices, and data from one another.&#x201D;

But we can be even more concrete for this talk.
The word &#x201C;authentication&#x201D; comes up a lot here. These actions are one of the classic places where users tell websites or applications &#x201C;who they are&#x201D; and then the websites say back to them &#x201C;here&#x2019;s what you can do&#x201D;.
Scylla and Charibdis. This talk is Odysseus.

It&#x2019;s really hard to talk about this topic without turning it into a technical or security talk. I value security too much to be doing the talking -- I work with real security folks, and that&#x2019;s some tricky stuff.

On the other side, the social implications of identity are huge. We&#x2019;ll get into some of them, but I wanted to talk about things that are critical even for applications that aren&#x2019;t primarily social.
You might know part of this story already. But it&#x2019;s worth teasing out some of what happened before we start getting into the advice part.
So there&#x2019;s this blog called ReadWriteWeb.
In February, they wrote an article about some of the stuff we&#x2019;re going to talk about today. It became very popular!
So popular it became the top result for the search query &#x201C;facebook login&#x201D;.

Which as it turns out, a lot of people were using as a way to navigate to Facebook. (This is pretty normal, btw. Lot&#x2019;s of people use search for navigation. )
So folks looking for this ...
... instead saw this, and freaked out. Many of those people probably exited and did something else. But some people were convinced this was Facebook -- remember that this was around the time FB was doing some major redesigns and people were feeling a little disoriented anyway. So the dedicated looked for some way to log in.
Which led to this. This is the part you might have seen before.

[Read silly comment]

Silly users, right?
... RRW had to post this in the middle of their article ...

... and then it became and internet meme, and other folks started adding parody comments and a bunch of blog posts got writen and it became a Thing, briefly.
Lesson that users are stupid? NO. NO. NO.

Better lesson: many people out there have a much less good grasp of the concepts we take for granted: URLs, search, websites, browsers, etc. than we expect. This is hard to keep in mind.

But there&#x2019;s something else, too.
Let&#x2019;s look at those comments again. Notice something.

Those are Facebook pictures. And full names (which I&#x2019;ve blurred).

Those users ARE logged into Facebook. They succeeded! Just not in the way they expected. Nor do they realize it. But they are, just the same. (Even better, some of them probably already were.)
And this is why. They saw the words &#x201C;sign in&#x201D; and &#x201C;facebook&#x201D; and a facebook logo. And they clicked sign in.
Then, assuming they really weren&#x2019;t logged in in to Facebook from the start, they saw something like this. This is a Facebook Connect dialog. It&#x2019;s asking for facebook credentials to a. log the person in to FB, and b. allow a limited set of communication between FB and Readwriteweb. Enough that RWW can allow a comment, for instance.

Now, the fine print has some things to say about connecting and sharing, but really, it looks like a login page. So they log in.
And voila, they can comment! (This is a comment I posted to the thread. Just to feel included.)

Now, behind they scenes, they really are logged into Facebook. So, in some sense, they succeeded. If they went to Facebook, they wouldn&#x2019;t have to re-enter their information.
But they didn&#x2019;t REALLY succeed, because they probably don&#x2019;t know that. And, of course, they&#x2019;ve just tied their Facebook identity, with what is probably their real name, to a comment on a blog they&#x2019;d never heard of today. And that blog is now an authorized app for their Facebook account. Luckily it&#x2019;s the nice folks at RWW and not someone sketchy, right?
So what&#x2019;s going on here? In the words of a wise man, &#x201C;Strange things are afoot at the circle K.&#x201D;
Another way of saying it is, identity -- specifically, authenication -- logging into stuff and being logged into stuff and logging out of stuff -- is getting to be a fuzzy concept.
Now, before we talk about that fuzziness, let's talk about he fuzziness which has always been with us. And that's people.

People are tricky. So before we get to the time travel, let's talk about how tricky they are.

I'm going to throw some numbers and stories at you.
People share computers. We don't always allow for this when we design software, but they do.

These numbers come from a Microsoft study of [[X number] of homes. They showed that sharing is common, but not universal, and that context of place (where the computer is) and task (long vs short tasks) both effect sharing.

Most OS's now have profiles that help a little with this, but not everyone uses them and those that do don't use them every time. It's all very fluid.
People share accounts. That is, multiple people use a single account name or email address and password pair, and do stuff.

eBay history -- eBay, of course, has some very large businesses selling on it, and has for some time. But for YEARS, we'd get complaints from account owners, who might have a dozen employees using a single account, and were worried that one disgruntled employee could take down their entire business. I think even now you have to use 3rd party tools to deal with this.

Twitter has a similar situation with its corporate accounts.

But even outside of business this happens. A friend of mine died recently, but his Facebook profile is still active. Two of his friends share his account and post things in his honor.
NY Times article. A bunch of kids all change their names in Facebook. Why?

To be cute, but also to avoid college recruiters, who they are convinced troll FB for information on them during college application season. No idea if they're right or not.

More generally, while FB periodically cracks down on fake-seeming names (sometimes catching real people with fake-sounding names in the process), anecdotally name-changing on FB is pretty common. I think it usually happens after the "adding lots of people" phase is over, and folks can rely on familiarity + the profile picture to let their contacts know who's really there.

I'd estimate I have about a half-dozen partly or totally masked names on my friends list. And I'm old!
Poll of Techcrunch users (so skewed for audience).

But it makes sense ... how many of you guys have more than one twitter account? More than one Gmail account?
Passwords.

Wonderful Microsoft Research paper by Dinei Florencio and Cormac Herley. They had a HUGE sample of user data to work with, using a widely sintalled toolbar. Here's what they found.

This stuff really maters for security. This isn't a security talk, but this is a pretty big issue for sites. Though not, necessarily, for users ...
Another MSFT Research paper by Cormac Herley did an economic model of the cost of following certain kinds of security advice versus the possible risks associated with NOT following the advice.

He found that in most cases, it is rational for users to ignore many of the most common forms of advice.

E.g.: cost of pishing vs. cost of protection from being phishing by studying URLs.

Similarly, a paper from CMU Aleecia MacDonald and Lorrie Cranor said:
"We estimate that reading privacy policies carries costs in time of approximately 201 hours a year, worth about $3,534 annually per American Internet user. Nationally, if Americans were to
read online privacy policies word-for-word, we estimate the value of time lost as about $781 billion annually."
So, people? Tricky.

It&#x2019;s not so much that they&#x2019;re irrational, it&#x2019;s that their rational behavior is often more complex than the simple boxes our software tries to put them in. So the break out of the boxes, or route around them, or ignore them.
Now, let&#x2019;s go back in time. Just a little. For a couple of reasons -- one, a lot of folks still need to design in the pre-identity-wackiness world. Two, I&#x2019;m a big believer in getting the basics right and logging in and out was sarting to be what I call a MOSTLY solved problem.
Now we're in the past. Norms are important for designing here. Don't shock the natives.

What are norms? The norms I'm talking about are the affordances that people have learned to accept over time. They've formed their expectations around them.

These are kind of like design patterns, except design patterns are on purpose, and these aren't always.

So, norms. Let's take logging into a site. Simple, yes?
Why are norms pwoerful? Beacuse if you put this -- blah blahs and all -- on your site, a decent percentage of people would be able to log in. Not everyone, but a lot.

(If time, relate SAT story.)
This, though, would trip almost everyone up.
When designing your login system, there&#x2019;s a bunch of questions you have to ask. Here are some of them.
Narrate this. Use LinkedIn as an example.
You go to the home page, where do you look to sign in? The top. Almost every time.

The right, often. I don&#x2019;t really get putting it in the middle, but some people do that. Top right is a big deal, only things that should be there are sign in, sign up, maybe search and help. So, do this.
This is almost a security slide. Talk to a security professional before making any decisions.
Selection of common sites, real location of their login boxes (on whatever page they have a login box).
That checkbox that everyone has? I hate it. And this is why. There are two common results.

Sometimes sites use clear language: &#x201C;Remember my email on this computer&#x201D; (which means if you log out or time out, when you log in again the email is filled in -- more common with banks) or &#x201C;Keep me signed in for X amount of time&#x201D;. But often they don&#x2019;t -- they say &#x201C;Remember me.&#x201D;

Making the difference clear takes a lot of words, and still folks will get the wrong impression bc/ of the prevalence of both types. And the most common phrasing isn&#x2019;t clear at all. (And this is before, say, Firefox&#x2019;s password manager asks about remembering in a different way.)
Better to do what LinkedIn does, and have no checkbox. Instead, default to keeping you logged in, and ask again if you do something that needs higher security, like messaging someone. If you&#x2019;re not dealing with financial or health info, this is probably the best path.
Top 100 US sites vs. UK sites, button language.
Finally, norms doesn&#x2019;t have to mean being boring. You can suprise people in good ways which don&#x2019;t detract from the experience, and surprise them in bad ways which do. Norms are more about getting the details right in many cases -- this login screen from Ravelry is an example of a nice big surprise which adds to the user experience (the awesome illustration) and a tiny nasty surprise which detracts from it (norm of text w/in a text field disappearing on click).
Those are some of the UI issues and UI elements in a login box.

Of course, there's more to it -- handling errors, forgotten passwords, and signing in. This book is a good guide to a lot of the nitty gritty issues, if you don't already have a copy, get one.
And signing up? Just check this presentation out. I hope you&#x2019;ve already seen it. Live it.
This is an intentionally simplified and snarky verison of a much more complex reality. No insult intended to the folks who worked hard on various of these technologies. But sometimes, we use snark to cope with complexity.
OAuth, a way of handing over limited stuff from one site to another. When you're in an OAuth flow, it &#xA0;feels like you're using one site to log into another, but it's&#xA0;actually&#xA0;something called "access delegation."
Facebook launches something Facebook Connect. Not OAuth, but similar in effect. Hugely successful. We saw an example of it with the RWW story.

Folks complain that FB connect isn&#x2019;t open, and isn&#x2019;t following the dominant protocol (OAuth).
So Facebook launches their Open Graph API, which freaks everybody out.

It&#x2019;s not really open, but it does use OAuth 2.0. Which can look like this ...
But can also look like this. (Story about how I&#x2019;ve never used Pandora, yet it knows my favorite bands.)

This is called Instant Personalization. And this, along with the &#x201C;Like button everywhere&#x201D; reflects Facebook&#x2019;s newer model.
So how are these doing? Janrain, an authentication platform provider, did a study in April. Here&#x2019;s what they showed.
Also, last fall, Leah Culver showed some numbers for OPenID + Oauth + FB connect signups to Typepad.

(I assume mostly comments, not new Typepad blogs).
The she showed a breakdown over time -- growth by Twitter and HUGE growth by Facebook.
So what are we left with? TOO MANY OPTIONS. Here&#x2019;s what you could provide to your users.

Let&#x2019;s talk about how you decide.
The problem with combinations. Generally, if you have to put that much text under a button, something is wrong. (I learned this at eBay.)
The Nascar problem. Coined by Daniel Burka. Not this problem.
This one.
Talk about these a bunch.

Control - do you control the information? (Do you want to? Control has risks!)

Choice - giving choice (and informed consent) to your users is good -- to a point. Overwhelming them with choices they are not equipped to make (due to lack of knowledge or time) is not good.

Communication. Getting the email vs. other paths.

Access. Sometimes you just want a lot of users, and access to their stuff.
Some of the future is about solving very practical problems.

Explain about XAuth from Meebo. Trying to kill this particular NASCAR problem. Note that some importan stuff happens BEFORE authentication.
Talk about identity - in - browser. Concept stuff coming from Mozilla labs. Targeting Firefox 4.0.

You can get a plugin now, but it only slightly works. (Account Manager from Firefox)
My product! Usable.com

I should be able to talk about this unprompted, I&#x2019;ve been designing it for two years...
OpenID built on top of OAuth 2.0. Announced about 30 seconds ago.

Wish I knew what the user experience would be like.
You have one identity&#x2026; The days of you having a different image for your work friends or co-workers and for the other people you know are probably coming to an end pretty quickly&#x2026; Having two identities for yourself is an example of a lack of integrity&#x201D; &#x2013; Zuckerberg, 2009
This stuff is moving fast.

Know your audience -- and unless you&#x2019;re really sure of them, be conservative and sparing.

In a year, this will all look different. But it&#x2019;s important.

Pragmatic Designer's Guide to Identity on the Web

You are reading a preview.

Check these out next

Pragmatic Designer's Guide to Identity on the Web

More Related Content

Similar to Pragmatic Designer's Guide to Identity on the Web (20)

Recently uploaded (20)

Pragmatic Designer's Guide to Identity on the Web

Editor's Notes