In this post, you can learn about the system design and user experience. If you are interested in the full story, you can read our post for the Webmaker blog.
Join – Quick & Easy
We streamlined the process to join Webmaker. Previously, people needed to first sign up for Persona before they could gain access to Webmaker. It was confusing (since both names and platforms might be new and unfamiliar). Now, new users simply enter their email and choose a username. They immediately gain access to Webmaker, without the need to confirm their account. Confirmation happens during the user’s first login or manually if they try to publish. (We will soon enable phone numbers and SMS as an alternative to email.)
Sign In – No Password Required
Things get more interesting with Sign In.
As discussed by a number of people across the interwebs, I have taken the typical lost password experience and revised it to be the primary form of login.
A person can sign in with their username or email address. Webmaker sends an email that only they can access. This email includes a button to sign in and a link to “remember me.” Both options will take them into the site without any further clicks.
Sign In – Across Devices
Some people will use Webmaker on a public computer at a school or a library. They might receive the login email on their phone. For this situation, the email will include a short key they can read and copy across devices (in yellow on the email above). The diagram on the right describes this flow.
The key is temporary. It expires after a single use or after 30 minutes. If abused, it also expires after repeated attempts to guess it. A temporary key is much more secure than a password.
Sign In – Optional Password
Passwords might be useful for someone who works on a public computer at the library. We made them optional and easy to add. In fact, people can add a password while traveling and remove it later when they return home, fluidly switching between the best experience for their situation.
A theory I hope to test: if we allow people to opt-out of passwords at the very moment they struggle to remember their own, we will increase the adoption and understanding of this alternative login method.
A password can be added via a person’s profile page. A link to do this is also in the login email as shown above. This link doubles as a login link, then leads to the set password field.
People will have an experience tailored to their situation, allowing them to login by link, key, or password. The server manages this experience fluidly, even for returning users who forgot they set up an account in the past.
Feedback & Discussion
A big thanks to Chris DeCairos for his code prowess and Ricardo Vazquez for his careful UI crafting. This system could not have been built without their work or the support of Cassie McDaniel, Jon Buckley, Simon Wex, and the entire Webmaker team.