OpenID: Single User Interface Supporting Both Email/Password and OpenID

Question

I like the idea of OpenID, I really do. But few of my target users have even heard of it - yet. If I want to offer OpenID as an option, my only choice would seem to come down to offering BOTH email/password authentication AND OpenID.

I've seen several sites that use this combination and the idea seems unappealing to put it mildly. Placing both options on the same screen is distracting and pointless if only 10% of users will even care about OpenID.

So I'm wondering, how could I offer a single user interface that supports BOTH OpenID and email/password for authentication and account creation?

One possibility I've been considering is to use a single OpenID/email field that can detect whether an email or OpenID was used and then dynamically adjust the interface accordingly.

For example, an account creation page might start off with a single field labelled "email" with some unobtrusive text along the lines of "we support OpenID". If a user enters a url, then the interface switches to an OpenID account creation page (via JavaScript). If an email address is entered, nothing happens.

What's the best method you've seen for hiding OpenID from the average user, but at the same time letting tech-savvy users know that your site supports it?

Answer 1

I think the way Uservoice combines username+password with OpenID is elegant.

That said, I disagree with the argument of not using OpenID merely because few people have heard of it. If you offer a few login buttons like "Login with Google" and "Login with Yahoo" alongside your "or, create a new username and password for yourself", then you don't even have to mention OpenID, and yet most users will likely pick the more convenient (OpenID) option without even realizing what they're using (and that's good!)

Answer 2

Decided to do some checking around on my own. Turns out there's a much better idea out there. The term seems to be 'OpenID selector'.

There's a free JavaScript library called JavaScript OpenID selector that makes it easy to create this sort of thing:

alt text http://img9.imageshack.us/img9/1940/step1c.png

This article explains the main problem and the solution:

One of the key results of Yahoo's OpenID usability study was that users did not understand OpenID and what its logo stands for. Instead, Yahoo promoted the idea of giving users a sign-in button that simply said "Sign In with a Yahoo! ID" (though Chris Messina argues that this could be detrimental to OpenID in the long run).Google and its partners are taking a similar route and are basically bypassing any mention of OpenID itself in favor of a simple message saying "Sign in with a Google Account."

There's even a sample Rails application that rolls authlogic, openid, and the selector into a single package so you can see how everything fits together.

Answer 3

See how SO here does it. That's a good a example, I like your idea of adapting the system by entered email as well, this is a trick facebook uses to send out facebook invitations to other people in your address book.

Answer 4

Would something like the following work?

Link to Login Page.

Now this site is running DNN and obviously it could be redesigned to be friendlier for the users. But the key here is that the standard way to sign-in is presented as the default sign-in.

I would probably redesign that site's interface to put LiveID and OpenID in a border labeled with Alternative Login Methods (along with a button for more help on how to use them) as well as change the buttons to read Sign In Using LiveID and Sign in Using OpenID.