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.

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.

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.

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:

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’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.

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.

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.

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.

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

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.