Today’s learning: Strip your registration page to the essential

I read a lot of articles each day, most of them related to entrepreneurship and tech startups. Recently on Hacker News, someone mentioned that instead of reading that much, I should try to write about the articles I read. I’d read less but I’d retain more.

So I asked myself today, what have I learned from what I read today that would be worth sharing? Well, turns out, it is not an article per se. One of the articles was pointing to HipChat, a Campire competitor. Looking at their website, I ended up on the Sign Up page and the way they designed their page reminded me of this simple rule: when you want your user to do something specific, do not distract him.

The HipChat registration page

If you compare the HipChat Sign Up page with any other page, you will notice that there are much less links:

image10image9

So how can I apply this to TaskArmy? This is the current TaskArmy sign up page:

image_thumb2

I could remove the links on the top, remove the sidebar, center the forms and change the headline “You are awesome” which sounds pretty lame now that I think about it.

Let’s do it! It is now 10:14, out of curiosity, how long will it take me to have a new version of this page?

Step 1: Create a new bare layout based on existing one [4min]

image_thumb3

Step 2: Center the content [3min]

image_thumb5

I just need to add some simple CSS:

.center-column /* center forms */
{
  width:700px;
  margin-left:auto;
  margin-right:auto;
}

  .center-column h1 /* center title inside forms box */
  {
    text-align:center;
  }
	
  .center-column .log-in .column /* widen columns */
  {
    width:280px;
  }

Last step: Change crappy copy [5min]

Which title would help conversions better? This is a perfect candidate for A/B testing. I am currently running other experiments so I will split-test this a bit later. Anyway, I went for the “Welcome to the TaskArmy community.” variation out of a gut feeling. It is neutral and still makes you feel you are part of something.

Exercise: Could you come up with other suggestions? Please post them in the comments.

image_thumb7image_thumb6

image_thumb8

Done. Experiment ready and deployed in 12 minutes.

image_thumb9What do you think? Will this new version of the registration page convert better? Do you see improvements I could add? (Should I add testimonials for example?)

EDIT: Based on Alistair’s comment, I have changed how I show the facebook and google login feature: