Effective Pitch and Registration Page Design

Effective Pitch and Registration Page Design

This post is supported by Webdesigner Depot, a popular web design blog covering tutorials, design trends, blogging and inspirational posts. You can visit WDD at webdesignerdepot.com and follow WDD on Twitter @designerdepot.

Getting a user to visit your site is only step one. If you’re interested in maintaining a long-lasting relationship, it’s going to take some commitment.

By now you’ve probably seen showcases of well designed registration forms, but that’s really only half the story. Effective forms are actually the result of a tag team effort. This will be a look at the big picture relationship between the pitch and registration form.

For any potential new user, a site will need to do two things:

  1. Pitch: Show how an account would be useful to the user
  2. Register: Show how to get started

Simple on paper, harder in execution. Fortunately for us, there are plenty of good examples out on the internet. Let’s start by answering the question on any new user’s mind:

What Am I Getting Into?

Users will generally sign up for useful services, especially when there is a free account. Helping them realize a site’s usefulness is your job. They are less likely to sign up for an account simply to see what a site is. Even though these kinds of internet explorers do exist, they do not represent the majority of the web population. Before a user commits, they must see a tangible example of what the site is about.

MailChimp Version 5

The recently redesigned MailChimp overview is a prime example of how a service can effectively show its usefulness. In the MailChimp pitch above, new features are shown as groundbreaking advances even for existing users. Functionality is broken down using catchy titles and links for further explanation. This page is a buzz machine for a whole slew of features that make the service worthwhile. Once a visitor reaches the bottom, registered users are invited to log in while new users are given a chance to join the bandwagon.

Another common practice is the “Take a Tour” option before registering. This is a simple way of breaking down key features, and answering any questions the visitor may have.

Make the Pitch Relevant to Me

Tumblr is a great example of an important piece to pitching user registration. They provide one of the best testimonial and features page on the internet. What makes their pitch so great? It can be tailored to specific types of people.

They start by asking a good question: Why will I love Tumblr? Not everyone will have the same answer, and because of this, they’ve added a filter. A dropdown box at the top allows potential users to flip from “Why everyone loves Tumblr” to “Why a specific group loves Tumblr”. Doing so will bring up features and statistics relevant to the selected user type.

Tailored to Musicians

This is an awesome approach to users. It embraces that selling points for photographers will not be the same for musicians. One pitch does not have to fit all. Putting everyone into the same general category may actually do more harm than good.

Fix Last Minute Doubts

An overly-complex registration form can be scary. Even if it would only take a minute to complete, some users won’t even give that time if it seems too long.

Create Mailchimp Account

With MailChimp’s account registration, the decision to register is made easier by a positive review in the left column. The words “Completely Free Account” and “No Credit Card Required” are made bold to send the point across.

Take notice of what this screen doesn’t do. This screen doesn’t sell the features; it only communicates the zero-risk to get started. MailChimp makes the assumption that if you’ve reach this screen, you’re already interested and just need the final push to commitment.

Only Include What You Need To Start

Simplicity in form design is beautiful. If the only information a user needs to get started is an email and password, the registration form should only include an email and password. Let’s take a moment to admire the minimalism of Tumblr’s sign up page:

Tumblr's Registration Form

Once a user registers, there’s plenty of time to come back and fill in the rest. Assume everyone is busy. Making these fields part of the initial process does not value the user’s time. Something like a Twitter username is (in most cases) not critical to the registration process.

Gowalla registration form

Gowalla’s user registration follows the same trends. Oversized text boxes make the form seem simpler. New users have to fill out a minimal amount of information to get started, and none of it involves thinking. Personally, I don’t consider adding name fields to a registration form as an extra step. It’s usually the first setting I update after registering, and having it up initially saves searching later.

Remember the Context

Required fields should be determined by the type of account being created. Sweet is a Twitter application that has been in private beta for what seems like a very long time. Even so, they have a well designed form for interested visitors. Since this is a Twitter application, it makes sense to include a field for the visitor’s handle.

Sweet Beta Sign Up

Integrated Accounts

Another registration option that has surfaced in the past couple years is creating accounts through existing social media accounts. API’s like Facebook Connect and Twitter enable websites to create new users with the credentials of existing accounts.

Facebook Connect on Digg

One of the main benefits to this method is that a user only has to link the account to a site in order to have full user priviledges. Registration is cut down to a two or three click operation. Your user’s time is valuable, and those extra seconds count.

What Comes Next?

Web designers and internet enthusiasts have a hard time remembering the “average user”. Contrary to expectation, the average user does not enjoy exploring options and intricacies of new websites. In fact, often times a “regular user” will need some sort of direction in order to get involved.

Assuming the registration process goes well, what happens next? Provide a path for users to follow once they have completed the form. Don’t stop once they have activated an email account. Suggest something new! A simple “Thanks for registering, now you should try one of the following actions…” will make sure that users get engaged quickly, rather than leaving their new account to gather dust.

When Email is All You Need

Account registration is not the only way visitors sign up for something. Newsletter notifications are a great example of low committment registration. In the case of newsletter registration, the pitch incentive has a different focus. The user has to be interested in what you’re doing, rather than what you are selling.

An iPhone user, for example, may subscribe to the newsletter of their favorite developer to keep up to date with recent releases and news. Companies like TapBots have made signing up for their mailing list as simple as providing a valid email address.

Newsletter Sign Up

Coming Soon

“Coming Soon” pages have some of the most direct email sign ups, mainly because it is the only action available. The pitch for these types of pages is often in the mystery, and not actually functionality. For more examples, read through Smashing Magazine’s coming soon showcase from a few months back.

Private Betas

For email sign ups that pitch functionality, the best examples come from private beta sign ups. Postmark is an upcoming email delivery system made by the folks at Wildbit. Recently the site launched a private beta and is in the process of accepting applicants. The splash page offers visitors a chance to put their name on the list and read more about the service.

Postmark Beta Sign Up

Thanks for Registering

That just about covers the fundamentals of effective pitch and registration design. Don’t count on users signing up without proper incentive. Try to anticipate selling points and display them as part of the registration process. Until the user presses submit, they haven’t committed. Improving completion rates is essential to creating a selling product.

We’ve mentioned Tumblr a lot because they understand simplicity better than most user-driven sites, but they certainly aren’t the only ones. Do you know of any other sites that do a good job of keeping the registration process simple? How about sites that present the product well? Share your links and thoughts in the comments below.

Further Reading

Interested in continuing your reading on effective form design? The articles and showcases below have plenty more resources and designs to browse through.

  1. Web Form Design Patterns: Sign-Up Forms
  2. Superb Examples of Form Design
  3. 40 Eye-Catching Registration Pages
  4. Sign Up Forms Must Die
  5. CSS-Based Forms: Modern Solutions

Post Supported by Web Designer Depot

Web Designer Depot

Webdesigner Depot is one of the most popular web design blogs in the world. It covers tutorials, design trends, blogging as well as inspirational posts. It’s run by Walter Apai, a web designer from Vancouver, Canada. The blog is a great resource for both beginners and advanced designers looking to expand and improve their knowledge. The site is visited by Fortune 500 companies and is used as a reference by many design schools. Visited by almost 2 million readers per month, WDD is a prime resource for both graphic and web designers. Visit WDD at webdesignerdepot.com. Follow on Twitter: twitter.com/designerdepot. Subscribe to RSS feed: webdesignerdepot.com/rss.htm.

Posted Monday, March 15th, 2010 · Back to Top

SPONSOR

Add Comment

24 Comments 7 Mentions

  1. Ed Baxter Author Editor

    A great post. I agree that sign up pages definitely need to be kept simple in order to prevent users from giving due to the sheer amount of information that you want off them but I don’t think it’s as simple as just giving them three fields and hoping they fill in the other information later on. That would be a nightmare on ecommerce websites but less is more on most sites and if you can get a user to sign up and continue to visit your website then you should be onto a winner.

    ·

  2. Jordan Walker Author Editor

    Thanks for the great write up, I am currently created a registration form and was wondering what the best methods were.

    ·

  3. Johnny Author Editor

    Lovely roundup and article, I love to see different ways people can approach design of things like this.

    ·

  4. Atul Kash Author Editor

    I never thought this way while creating a registration form on my website. First thing now is to show the user what incentives he’ll be getting for signing up.
    One thing I’d like to ask though, you’ve used examples of really popular websites, what are your thoughts on how a startup with very few users should approach this issue?
    Thanks

    ·

  5. OMFG! Web Design Author Editor

    Hi! Found this article through the Smashing Network. Nicely written!!
    Keep going!

    omfgwebculture.blogspot.com

    ·

  6. Beth McLain | Web Designer Author Editor

    Great article…Effective methods for the creation of registration forms ..thanks for sharing

    ·

  7. social networking design Author Editor

    Your are really great.What an amazing and good looking designs for registration pages useful for our site design.

    ·

  8. Rakesh Solanki Author Editor

    Great article…Nice way to show the importance of registration forms. thanks for sharing

    ·

  9. Slobodan Kustrimovic Author Editor

    Awesome article. Thanks Zach. :)

    ·

  10. Justin Moore-Brown Author Editor

    Thanks for the great tips! This is an area that seems like it can be greatly overlooked!

    ·

  11. Dainis Graveris Author Editor

    Here I must say – didn’t see that one coming! I was expecting inspirational article after reading title, but this turned out to be very valuable and enjoyable reading! Thank you for that, didn’t know about mailchimp new version as well, good one :)

    ·

  12. Lukas Author Editor

    Great article :)

    ·

  13. termal jel Author Editor

    Nice way to show the importance of registration forms. Thanks for sharing, weldone. Great article

    ·

  14. Anil Author Editor

    Great article. This article influenced me to modify my registration page. My website is not yet launched so avoided a mistake.

    Thanks.

    ·

  15. Greg Jacobs Author Editor

    I’d perpetually want to be update on new posts on this site, saved to bookmarks ! .

    ·

  16. Sepeda Motor Injeksi Irit Harga Terbaik Cuma Honda Author Editor

    hey there and thank you for your info – I’ve certainly picked up anything new from right here. I did however expertise some technical issues using this website, since I experienced to reload the site many times previous to I could get it to load correctly. I had been wondering if your web host is OK? Not that I am complaining, but sluggish loading instances times will often affect your placement in google and can damage your high quality score if advertising and marketing with Adwords. Anyway I’m adding this RSS to my email and can look out for a lot more of your respective exciting content. Make sure you update this again very soon..

    ·

  17. angry birds free Author Editor

    Hey there! I just wanted to ask if you ever have any trouble with hackers? My last blog (wordpress) was hacked and I ended up losing a few months of hard work due to no data backup. Do you have any methods to prevent hackers?

    ·

  18. Beats by dr dre Author Editor

    Appreciate for assisting to talk over this impression, I feel intensive about idea and would like to learn loads of things on this thing. If possible, as you gain knowledge, would you notice replacing your web site with lots of more info? It’s very benificial for me.

    ·

  19. Inspirational Quotes Author Editor

    Wow, fantastic blog layout! How long have you been blogging for? you make blogging look easy. The overall look of your website is wonderful, let alone the content!. Thanks For Your article about Effective Pitch and Registration Page Design | Build Internet .

    ·

  20. garden furniture Author Editor

    Effective Pitch and Registration Page Design | Build Internet I was suggested this web site by my cousin. I am not sure whether this post is written by him as no one else know such detailed about my trouble. You’re incredible! Thanks! your article about Effective Pitch and Registration Page Design | Build InternetBest Regards Agata

    ·

  21. ccna training chennai Author Editor

    can you please share some source code example ?

    ·

  22. dotnet training chennai Author Editor

    any code example please ?

    ·

  23. java training chennai Author Editor

    Really need the sample one ? do u have ?

    ·

  24. Margarete Show Author Editor

    Hello! Quick question that’s completely off topic. Do you know how to make your site mobile friendly? My blog looks weird when viewing from my iphone 4. I’m
    trying to find a template or plugin that might
    be able to correct this problem. If you have any suggestions, please share.
    With thanks!

    ·

 

Build Internet by One Mighty Roar. Since 2008.