My Take on the Basecamp Redesign

So last night I did something I’ve always think about doing but have never actually done. It’s not my place, but last night I said “what the hell?”

I read about the facelift of the Basecamp homepage on SVN and several small but important things jumped out at me when I broke down the layout of the page. So I’m doing my OWN critique and presenting MY thoughts on how I would improve the design.

There were of course several comments on the post, most either in favor of the design or discussing the ramifications of the A/B test 37s conducted to decide on the final design.

The things about the redesign I noticed immediately were:

1. the header: in my opinion, lots of wasted space. Though the tagline was very effective and grabs attention immediately, the icons and visual didn’t seem to clearly communicate the message. For an existing user, the icons make sense, but for a new user, they may seem a little more ambiguous. Finally, the initial CTA [See Plans and Pricing] is asking me to take action too soon.

2. The videos act as credibility builders but here, I’m invited view these videos before I have a real idea of what Basecamp is, and why I want to see how others are using it. Good asset and information, not the right placement on the page.

3. These are the assets I feel best illustrate the key messaging at the top of the page. The user sees these important bits only if they hang in after deciding whether or not to view the videos and then continuing to scroll down the page.

3a. I can see clicks coming from this point, but with an effective action point at top and bottom I would think there’d be no need for an action here. It also seems to break from the look, feel and style of the rest of the page with the watercolor brush texture behind the link.

Original Basecamp Homepage (Full Screen)

My Humble Solution

1. Simplify the header; focus on the key message; Grab their attention and give the user an immediate pitch and a quick leadin to credibility.

2. Move the screenshots up on the page; immediately present the user with the key benefits of the product

3. Now maybe the user has a good sense of what Basecamp is, give them a large obvious call to action option followed by a secondary option [Take a tour of Basecamp] to get more information before committing.

4. Now, if they still need more convincing at this point, the last half of the page groups together more credibility builders, supporting info and benefits.

Basecamp Homepage Revised (Full Screen)

Obviously this a rough, thrown together composition. I’m also of course not privy to any of 37s marketing goals or objectives but what I think this layout would accomplish is better focusing on the selling points of the product at the top of the page, presenting the primary benefits that support the key message and clearly presenting users with a primary and secondary call to action.

One of my main goals was to condense the header, which is one spot where I think I failed in my solution. My primary CTA button may be a little larger than necessary too but hey, it’s meant to grab attention.

As I said, this is simply my own personal opinion on what I would do to improve this page. Obviously 37s has done something right over the years so who’s to say their formula won’t work perfectly fine as is. It’s an exploration and an exercise in critique and discussion is welcome. I’d love to hear thoughts!