Captchas, confirmation emails, account activation, and credit card details — let’s face it, user registration can be a headache. When your goal is to convert visitors to users and get as many sign-ups as possible, the last thing you want is for your registration page to act as a barrier.
Unfortunately, there’s no one-size-fits-all solution. Different markets and different services all require different treatments when it comes to signing up.
We’ve rounded up 9 samples of great user registration pages, some simple, some complex. We’ll take a look at each one and give you some ideas about what they did right to help you streamline your process or find some inspiration.
Convore doesn’t waste any time getting down to business. As soon as you hit the landing page of this communications and messaging platform you’re presented with a registration for the Convore service. Simple, fast and to the point. Convore only collects the most essential information — name, email and password — entered once with no confirmation. Not only is the sign-up process dead simple and easy to find, the registration form flows well with the rest of the content on the page.
Project estimation web app, Ballpark, has a nice approach to user registration. While they collect a little more information than Convore, it’s still kept to the essentials. The structure of the form here is great. Everything is presented in a very neat and tidy manner with some nice iconography to denote the different types of data being collected. Though it looks simple, a lot of attention has been paid to the details like the soft colors, subtle gradients, light borders and 3D elements that give the signup form a polished, elegant feel.
Time tracking app Fourteen Dayz takes a similar approach to user registration, using a soft color palette with boxes for each step of the registration process. However, the form is minimal and flatter, lacking gradients and drop shadows. Nonetheless, the overall effect is still that of a clean, easy to read, logically organized registration form. The text and font treatment on this form is quite nice, with large headings, plenty of descriptive text and clear, organized labels. Instructions are clear and readily available without having to hunt for them.
Sometimes less is more. Spreedly’s signup page is dead simple, both in terms of its visual appearance and the information it collects. Pick a username, enter your email and choose a password. That’s it. You’re done. There’s no activation process and upon submitting the form, you can start using the service immediately. This is a great example of making registration easy. Spreedly signup only takes a few seconds and instant access to test accounts means you can start exploring the service right away. It’s not until after you’ve had a chance to fully test the app and have decided to subscribe that you are presented with a screen to begin your subscription and enter payment details.
Culinary Colture, a social site for foodies, doesn’t even bother to move their registration onto a separate page. Like Convore, the signup is right on the landing page. It’s a little further down the page, just below the fold, and beside the activity feed, but the treatment on the form here is really nice. The site saves space by eliminating labels for form elements and placing the prompt directly inside the form field itself. Simple, stylish icons inside each input box also help to illustrate what types of data belong in the fields. Finally, the subtle details on the borders and button gradient gives the form a finished look.
6. Launch List
Launch List’s registration page starts out with a pricing table at the top and a FAQ below. Select a plan and the FAQ fades away to load a user registration form complete with instructions. The whole visual identity for Launch List is vintage cool. On the pricing table, the teal background, fat icons and the Buck Rogers style rocket of the Launch List logo give everything a clean sort of retro feeling. We like the use of subtle changes in value in this form, from the contrast of light grey text verses white headings to the subtle boxes behind sections of the registration form.
Time tracking app Freckle asks for a little more information on its registration page. The app’s designers have done their best to make the process as painless as possible. There’s not a lot of clutter on the page, which is composed almost entirely of just the signup form. Each section is cordoned off into its own box with slightly larger text for lables and inputs. The soft colors and the instructions in the margins give the whole form a friendly, less intimidating feeling, which is helpful for a form that collects personal and payment information right off the bat.
Email marketing service, Litmus, is another example of a web app that collects a fairly large amount of data upon signup. Like Freckle, Litmus keeps it organized by breaking the form up into logical chunks and providing helpful information where needed. We find the mix of top-aligned labels in the beginning of the form versues left-aligned labels in the payment section to be an unusual choice but overall the form is visually simple enough that this doesn’t cause too much confusion.
Ember is a web app for sharing design ideas and inspiration with other designers. The signup process itself is simple but there’s a lot more to this registration page than just a couple of form fields. All the form’s instructions are clearly listed down the right-hand side of the page while the top left contains fields for personal details like name, email and password. We find the layout interesting in that the pricing table is below where the actual registration details are entered. It’s not something you see often but with only two plans to choose from, it works well: Enter your information, pick a plan, and you’re done.
For more Dev & Design coverage:
- Follow Mashable Dev & Design on Twitter
- Become a Fan on Facebook
- Subscribe to the Dev & Design channel
- Download our free apps for Android, Mac, iPhone and iPad