Monthly Archives: November 2014

Log In – A recipe

In a previous post I was talking about the log out experience, and the contents and functionality that I think should be included on the Logged Out page. Today I will tackle the Log In page (if you really must have one).

If you must enforce the use of an account then this should happen as painlessly as possible. Both you and the user are probably in agreement that this step is required only because we haven’t yet come up with a simpler way to establish this trust relationship. Further down, you can find a few suggestions on what may become, one day, a more seamless authentication pattern.

The authentication & authorisation topic is large. In a nutshell, identity verification takes into account three factors:

  1. Something you know (username, password, secret question, etc)
  2. Something you have (physical token, card, dongle, phone, etc)
  3. Something you are (fingerprint, retina scan, voice recognition, etc)

In this post I will only discuss the first point above. Even when I include items from points 2 and 3, I will do so with the intention of making point 1 simpler, rather than to increase the security of the authentication mechanism. In this post I’d like to stick to making things easier, rather than more secure.


The Log In page must have a few basic ingredients:

  • Credentials form. The focus should already be given to the first field (i.e. user id). Avoid captchas at all costs.
  • Password recovery link. Usually the “Forgot your password” prompt will also follow a predefined number of failed log in attempts. Care must be taken around “leaking” valid email addresses.
  • Sign Up option.

On top of the the above items, there are a few more ingredients that can help make the log in experience more painless:

  • Language switcher. If you’re site is localised, then this is a must have. Always include the current UI language in the list of available languages (so that the user always knows that they can switch back to it).
  • Password privacy toggle. Some passwords can be quite complex. If the user is in the privacy of their own home they may prefer to see what they’re typing.
  • Remember me. I’m not a huge fan of this option. I feel like this toggle is better placed in a global settings area of your site.


Twitter's Log In page is minimalistic

Twitter’s Log In page is minimalistic

Mix all the must have ingredients above, add your preferred nice to have items and you should get a pretty decent log in form. Rather than me drawing up a log in form, I chose to complete the picture and include the log in forms for the sites I mentioned in the Log Out post.

Facebook's Log In page

Facebook is not confused; it’s on a mission

Notice how Facebook almost gives more priority to the Sign Up process. That is probably tied into their drive to get more users onto the platform (warning: pure speculation). The other very interesting thing about Facebook’s Log In page is just how similar it is to their Logged Out page. Can you spot the difference?

For some inspiration, have a look at this set of Mobile Log In pages.

One day

Here are a few suggestions on how authentication could, one day, be simpler.

Trust my location

If I Log In from the a certain location (IP / WiFi / etc), there are no other people using the site, I always use the same browser, etc then maybe you can “assume” it’s me. Maybe you can prompt me to allow you to make that assumption?

Delegate the identity check

To my phone. If my mobile device has just started using the same public IP, or is in the proximity of the device that I am trying to Log In from, you can probably “assume” it’s me. If you want to be sure, maybe you can build support for Handoff / Continuity in your site and trust my mobile device to do the authentication.

Voice sign in

What if there was an app on my computer that I could start and I could say: “log me in to Facebook”? This app could check my voice, unlock my keychain, extract the credentials, start a browser/tab and fill in the form for me.

Log Out – Please take me with you

Your user has logged out (Signed Off, Logged Off, Signed Out, etc). What happens next?

Many online experiences end there. I believe that to be a missed opportunity. The page that gets displayed to the user as a result of logging out is an integral part of the online experience that your site provides.

Why has the user logged out?
A few reasons spring to mind:
1. they want to switch accounts
2. they’ve been inactive for too long and the system logged them out
3. they have finished using the site and they use a shared computer

These are just three possible reasons, but they are probably enough to draw some quick conclusions about what a good log out page may contain.

What should the logged out page be?
Regardless of the reason why the log out took place, the user should be shown a confirmation message. They need to know that their wish was granted, or that they have been logged out for some other reasons (such as their inactivity).

Facebook's logged out page

Facebook invites the user to “stay connected”

Twitter's logged out page

Twitter asks the user to get the apps

Reasons 1 and 2 above virtually require that a log in form be present on the page.

Reasons 2 and 3 can be regarded as an opportunity for reaching out to the user with an invitation to continue their interaction with your site through a more personal channel, a channel that is secure and omnipresent: the user’s mobile device!

Why not remind the user about your mobile app, or your mobile website. Tell them to take you with them by installing your app. Better still: make the most of features such as Continuity to allow the user to continue their session on their mobile device.

The rest of the content that should go on this logged out page is not so obvious. It’s not just a matter of taste, it’s also a matter of personality. You can consider the user disengaged and show them an ad. Or you may take this opportunity to strengthen your brand. You may even go all melodramatic and put a “sorry to see you go; please come back soon” message.

Whatever you decide to do, just try and think of this page as an integral part of your product. Don’t think of it as the end of the line and you may end up building an avenue for increasing engagement and retention.

Apps vs. Websites – The ownership perspective

This topic has been covered time and time again. Typically, these articles cover a mix of technology, performance, ROI, look and feel, and other such metrics.

Today I’m going to suggest that the end user’s ownership of an app (as opposed to a website) is one criteria that businesses should consider when making the decision to build a Native App. I’m also proposing that building a Responsive Website is no longer an option, but an expectation.

In 2014, even the cheapest smartphones come with HTML5 capable browsers! End users do not and should not have to understand why a website is different, and sometimes even feels alien, when viewed on a mobile device. The time when we had to compromise on mobile because of technical reasons is long gone. Let’s leave this here.

If the mobile browsing experience is in the same class as the browser experience then why should you even consider an app?

Unless you’re planning to build an amazing app that you plan to support long term, keep up to date with the fast evolving mobile UI/UX, in which you utilise the mobile platform paradigms to the point that the user feels like it was built in collaboration with the designers of the first party apps, then you probably shouldn’t build an app.

The subtlety here is that it all boils down to the fact that you own your website, but the end user owns your app.

If the user has a bad experience on your site, they can’t get rid of your mobile optimised (hopefully responsive) website. Your links will always work, even if they remove all shortcuts or bookmarks. A short url, a web search result or an ad will always be able to bring them back. When they’re back you’ll have a chance to make them change their mind and convince them to return in the future.

On the other hand, if the user has a bad experience with your app, they can simply forget the app ever existed on their device. They will delete it and they’ll do that almost as a punishment for your failure to delight them. Deleting the app will close all the communication channels once provided by that medium: all extensions and widgets will be gone, all URL schemes will seize to function. The reality is your app is competing with potential photos of their friends and family, or with another app that is more in fashion than yours.

The end user owns your app because they install it, they dedicate disk space to it, and they can get rid of it if they choose to. They are in complete control of this lifecycle and, you may not realise this, this lifecycle has financial and psychological implications.

Unlike accessing your website, when installing your app the user is likely to be asked for their password (or fingerprint for Touch ID). Even if your app is free, the psychological connection is made: they acquired your app. They are now using disk space just to have your app around.

Your app must be delightful, it must add value every time it’s used, otherwise the user will eventually run out of patience and delete it. Once they do, you will face a big uphill battle to convince them to give your app another try.

There is no such psychological attachment to your website because the user is not involved in the site’s lifecycle. They usually just “ask” a search engine for it. When they run out of space for their next photo they won’t think which sites they can remove…

If you can’t build a delightful mobile app, then you’d better have an amazing responsive website. The reality is though, that if you don’t have both, then it’s likely that you’ll never be the first port of call for a mobile user.