Many sites are designed to convert visitors into users by getting them to create an account. The sign-up form is the last hurdle a soon-to-be user needs to jump over, and it’s crucial that you make that hurdle as low and non-threatening as possible. In this post I will provide design suggestions for solid sign-up forms for web services and applications. Many forms can be improved by making them more targeted, more persuasive, or by keeping them as brief as possible. I will use examples from my list of sign-up forms on Usabilla Discover that shine in these areas.
1. Stay persuasive to the very end
All too often, web professionals take the concept of the funnel a bit too far. They think a site visitor goes through several steps until they are totally convinced and then makes a sprint for the sign-up form. Reality is often much more chaotic. People will have multiple tabs open with homepages of competitors, are inquiring about your service on Twitter and Facebook, and are reading old reviews by bloggers that might have looked at a much older version of your product. Most of your interested visitors are not looking for the cheapest deal, either. They care about how well your support is, if that one odd feature is there, and if your app feels right.
This means that in most cases the benefits your visitors get from signing up at your site need to be in full view. They can be persuaded at the last minute.
Lovely
Lovely keeps reminding me of the benefits I get by signing up. They explain what results I can expect from their service, and only use their features to back it up. The technical bells and whistles are just an means to an end, which is fitting for a site that deals with apartment searching.
Flow
Flow takes an approach that is much more brief: they just say that I have unlimited everything, and that no credit card is required. Instead of a recap, like Lovely does, they go for the nudge. Depending on your product, both approaches can be very effective.
Citypockets
Citypockets is a service that can automatically remind you of Daily Deal coupons from sites like Groupon, so they don’t expire. The green sign-up form they use tells me exactly what’s in it for me. The green color is also clever: people associate the Daily Deals vouchers with edible things that can go bad, like vegetables or milk.
2. Be as brief as possible
Many sign-up forms can be improved by cutting all unnecessary weight. This is not only important to speed up the process: by only asking the necessary details, you show that you are not out to harvest data for its own sake. Remember that your visitors probably have been scarred by more than one service that promised the world in exchange for full contact details and proceeded to spam the living daylight out of them.
By cutting down on your form fields, you reduce resistance your visitors might feel, whether they are lazy or reluctant to give out much data.
PopSurvey
When enough context can be given around the sign-up area, sometimes a very short form is the perfect solution. PopSurvey only asks for a name, email and password.
Stripe
Stripe has a sign-up form that is even more simple than PopSurvey‘s. Granted, they do ask for your password twice, but they don’t need a username: just your email address will do. But the real speciality is that they allow you to go ahead and play around without creating an account just yet. The ‘skip this step’ link let’s you carry on and sign-up for real later. This lazy registration technique is what we use on the Usabilla site as well.
Gumroad
Gumroad aims at making it easier to sell things. Their sign up form is all about getting you selling stuff in minutes. An email address and password is all that’s necessary. Connecting with Facebook or Twitter is also possible.
Pen.io
Pen.io makes it possible to simply publish a single page. Their sign-up page promises you a beautiful page in seconds. They live up to that promise: you fill in the URL you want, provide a password so you can edit the page later, and start typing.
Gojee
Gojee asks for an email and password only, and is persuasive by telling you they swear on their best bottle of scotch they won’t spam you.
3. Make sure you get the right audience
The sign-up form can also function as a filtering mechanism. Getting a lot of new sign-ups is great, but a service that is not for everyone might need to do some checking at the gate. As the following examples show, you can either do this in a way that’s not too obvious, or make it into a badge of honor.
Yammer
Yammer is a social network for colleagues. They ask for people’s work mail when signing up. This is a simple but powerful trick: only people with an actual work address sign up, filtering out people who where just riding by.
Podio
Podio is comparable to Yammer. They also ask for a work address to make sure they get the right people to sign up.
Mashape
Mashape, a place to hack around with API’s, only lets you request an invitation if you can declare an ‘X’ variable in JavaScript. Awesome.
4. Be original and let your brand stand strong
The sign-up form is a great opportunity to let the personality of the website shine through. This goes for both the visual design and the tone of voice. By having an original and smart sign-up form, websites can show they know their audience and that they can think with them.
Ducksboard
Ducksboard provides a real time dashboard for metrics. Their sign-up form is bold and easy to fill in. They want to know your country and timezone, but prefill these fields by looking at your IP address. They ‘stuff our lawyer insists on’ as a disclaimer for the terms of service agreement check box makes them human. Another nice touch is the fact that you only have to choose a pricing plan after the trial period.
Barleys’s Greenville
Barleys’s Greenville lets you rate your favorite pints by using pictograms of beer glasses. They also ask for your twitter name to make Tweeting easier later.
Howcode
Howcode is very honest about what you can expect: a new place to share bits of extreme web nerdery.
One Billion Minds
Although not very pretty, One Billion Minds invites visitors to tell more about themselves by using two steps, that are accessed through tabs and the ‘Next Step’/’Prev Step’ button below. One Billion Minds focuses on solving problems that can help people in need. When people want to volunteer, good knowledge about their talents can make a big difference in how One Billion Minds can ask them for help.
