Skip to content

Our new homepage redesign

We updated our homepage with a new design and a new video by Adam Lisagor.

It’s always a big challenge re-designing a homepage, so we thought we’d share some of our thinking, why we made the choices we made.

All things NOT being equal

Any time you approach the design of a homepage you’re opening yourself up to world of conflicting opinions and internal strife. Every department insists on a prominent link on the homepage – as they see it, their link is a big reason people come to our site.

And they’re right. All of them. Sales, support, finance, HR – the people they deal with come to our site to connect with them. Our previous homepage tried to give relatively equal footing to all those different needs and ended up being cluttered and confused. It grew into a barrage of competing links all trying to get your attention at the same time.

We needed the homepage to be more focused. It needed to guide people along, sending them in the right direction at the right time.

Who’s your daddy?

The bottom line is that existing customers are the most important of all.

For existing customers, Login is the most important link on the page. Even though it’s the most important link, it doesn’t need to be the biggest link. It just needs to be easy to spot, then it quickly becomes a habit.

The secondary reason existing customers visit is to find add-ons, find an accountant or get support. Which are all covered in the Do More menu, right next to the Login link.

Getting down to business

With existing customers taken care of, we need to address our other visitors, who fall into these major categories:

  1. Business owners
  2. Accountants & bookkeepers
  3. Software partners
  4. Job candidates
  5. Investors & media

And they rank in that order. Even though they all seem equally important, they’re not. Business owners matter most because without them none of us would be here.

Accountants & bookkeepers follow very closely, so we definitely make sure we address them in a prominent way. For everyone else, relevant links are on the homepage, just not prominently.

What does a first time visitor, who runs a business, want on our homepage? They have a few key questions we need to answer, in a matter of split seconds…

What is Xero?

Xero is beautiful accounting software.

It says so right on the tin. Watching the video gives you a very memorable impression of what Xero is all about. That’s why it gets top billing.

Why should I care?

You should care because it’s beautiful – not just on the surface – it will change the way you do business. Don’t take our word for it, listen to what our customers have to say.

It’s important to remember, people don’t care about our product. People care about what our product can do for them.

That’s why all the content on the homepage explains the benefits of Xero – that it gives them a new way of working together and doing business. That it connects people and data together, in real-time. That it makes it super simple to keep everyone up-to-speed, so you can make smart business decisions when it matters most – right now.

What should I do now?

Try it out. For free.

Realistically most people aren’t quite ready to sign up on their first visit – they probably want to learn more about how it works and what it costs, so there’s a Do More menu to guide people in the right direction.

Also, notice when the video finishes, it asks if you’re a business owner or accountant, then guides you to the appropriate page.

It’s made of…people!

Perhaps you also noticed our homepage isn’t dominated by a giant image of our product, like it used to be.

The product isn’t the reason Xero is important. Connecting people, so they can work better together, is the reason Xero is important. The focus is on people, not the product.

We also realized that people have an emotional attachment to Xero. That’s unusual for software. It’s completely unheard of for accounting software. So we wanted to make sure that new visitors get a sense of that emotional connection, which really sets Xero apart from any other accounting software.

One more thing

Mobile.

If you visit the homepage on a mobile device you’ll see a custom mobile version of the page featuring just the video and links to Xero Touch for iPhone and Android.

We built it as a custom page to keep it light weight and optimized for people on the go.

There’s a lot more thinking and exploration that went into the homepage redesign, but that covers most of the big ideas.

 

Read more about Company News, Design

 

24 comments

Trevor Smith
23 October 2012 #

New site looks fantastic. Kudos to Philip – I greatly enjoyed reading the thinking behind the redesign. Industry leading perspective on product & website design.

I often tell clients, Xero is a design company parading as a software company. Which is of course why we love it so much.

Now time to analyze our own site….

Philip Fierlinger
23 October 2012 #

@Trevor thanks. I actually think your site (http://www.hpccpa.com/) is one of the best in the business so well done to you guys!

Adam Ramage
23 October 2012 #

Thanks for the heads up around the strategy of the re-design. Like Xero itself, It. Just. Works. Great design, and great to be thinking of the user experience right through it!

Gayle Buchanan
23 October 2012 #

Just gorgeous, easy and warm … love how it shows the ‘plumbing’ and the added video keeps it human, very nice work team

Mike Scott
23 October 2012 #

Great redesign! Will the rest of the pages be updated to match the home page? Namely the blue background – is it going??

Mark
23 October 2012 #

Should we be expecting a re-fresh on the product design as well? I love the new clean website interface and excited to see what you come up with in the future. I’m hoping you’re the Mint.com for business.

Philip Fierlinger
23 October 2012 #

@mike & @mark – the site and the app will definitely continue to evolve.

Charles Klvana
23 October 2012 #

Personally, I don’t think the previous version was “cluttered”. “Do More”? It’s not very clear what that button does if you’re on the site to find yourself an accountant/bookkeeper to help you with your Xero. If we run with that thinking, let’s get rid of Accounts Payable/Receivable inside Xero, and put all the menus under a “Do more” dropdown box. That way the title bar won’t be so cluttered. You’d see just the dashboard, and a DO MORE button.
Further to that, if there’s a custom mobile device version of the page, why does it seem to be formatted for a tablet? I don’t know about you, but the majority of PCs now have a widescreen, with a resolution of about 1920×1080, but instead the site is VERY narrow, and just scrolls down for about 6 pages?? Why not format for a widescreen PC, and leave the custom mobile page for tablets?

Julie Russell
23 October 2012 #

There’s always one, isn’t there….well, I LOVE it. (written on an iPhone while cooking the sausages – which is what it’s all about, hey?)

Diane Crawford-Errington
23 October 2012 #

Great stuff guys. Looks really good, friendly and inviting. Keep up the great work.

Karen Bussing
23 October 2012 #

Love it! One question … why the American spelling (eg. categorize, check etc)?

@CJ_NZ
24 October 2012 #

Most people who go to the site will be existing customers (unless they go direct to the login site). Why not be able to log in from the homepage.

I am not a tech person but assume that is quite hard to do with security but ASB has managed to do it. That puts customers at the forefront but only takes up a bit of screen realestate.

Looking good though.

Chris
24 October 2012 #

Like Karen, I immediately noticed that American language, which is a bit disappointing for a Kiwi company.

Philip Fierlinger
24 October 2012 #

@CJ_NZ login directly from homepage is on our list.

@Karen American spelling is temporary. It will be localised/localized soon.

@Chris American voices are deliberate. We are super proud to be Kiwi, but we are an export company and the US is our largest target market. Also, nobody has trouble understanding an American accent. Localising videos (actors) for each major region isn’t really an option.

@charles not everything can go into the main menu. Even though everything is important, some things are essential. We felt like Do More is nice and obvious, and the structure of that menu works well. On a very related note, the reason the site is fixed width is due to a well known psychological principle called gestalt – the way our visual and spatial cognition works there’s an optimum density and hierarchy for digesting information.

Denis Breen
25 October 2012 #

Nice re-design, great video, using it already on our homepage. Just one suggestion – put the blog link on the top of the page. For such a great blog its getting harder to find it on your various pages.

Aroha Blake
25 October 2012 #

Good work guys! Love the way you keep pushing forward. It’s an art making the complex simple. But you’re spot on.. the #1 focus is your key target market of Business Owners, it makes the debate easier when the opinions start flying in. Whew.. @onesaas has just gone through a revamp too. I’m exhausted! But it’s good fun when you’re focused on the end goal, and of course, it’s iterative!

Andrew Cowan
25 October 2012 #

Very interesting to read the rationale for the redesign and agree it’s all about the customer journey through the site. Have to say though, I’m not warming to the heavy grey band across the top. Doesn’t feel fresh to me and is not consistent with the rest of the pages on the site :(

Cornelis Boertjens
30 October 2012 #

I have been a Xero customer for years. Great product, great company. I love how you guys are constantly pushing the boundaries and thanks for explaining (part of) the rationale behind the website redesign. Please keep us posted on how it is converting into new signups compared to the old site. Thanks!

Dane
13 November 2012 #

Is the old home page still available to view online anywhere? Was explaining the layout to a friend and now I can’t find it! Basically we were impressed how the video worked in a lightbox on desktops and in full screen on iPhone. Is it available on a different URL?

Philip Fierlinger
13 November 2012 #

@Dane sorry, it’s not archived anywhere online. But on iPhones all videos playback full screen in the native iOS video player. The current homepage works essentially the same, although we don’t open it within a lightbox.

Galen King
17 November 2012 #

Love the clear, concise message. Many of us could take a page from that book when it comes to saying what we’re selling. Keep it simple and to the point. Well done.

Michael Turner
18 November 2012 #

While there was nothing wrong with the previous design, the improved messaging and highlighting of what’s important make for a spectacular difference. Making something simple isn’t easy, and you’ve nailed it. The video is one of the best product demonstrations I’ve seen. Well done Philip and team.

Michael ‘MC’ Carter
19 November 2012 #

Thank you Philip for sharing the thinking and rationale. Interested to see you went for a custom mobile site (super lightweight) rather than a mobile-responsive design. Was there much debate around that? There is obviously a gulf between what your mobile site and what the full home page conveys. The new home page design looks like it would work well with a rearrange-into-one-column responsive design? Is this something you might test and measure on? Just curious.

Philip Fierlinger
20 November 2012 #

@Michael – we debate over mobile constantly.

Previously we’d had a dedicated mobile mini promo site (which linked to the full site) and we were happy with the results of that.

In general, we prefer having our mobile content more condensed and focused than the full web experience. But we are looking to make all our content much more mobile friendly.

Add your comment





We welcome all feedback but prefer a real name and email address.