Apparently doctors make the worst patients. As web designers, working on our own websites can be similarly life threatening.

We must be getting better at this though, because this was a cinch.

Here’s our old site:

And the new one, which of course you’re already looking at. Go on, take a look around – we’ll wait.

Why redesign, you might ask? Here’s a a few reasons:

• Our new identity was out of synch with our website. The old site said things like “strategic online marketing and digital development”, which makes us feel dirty inside.
• Our standards had moved on, we had two great new designers and wanted to show them off.
• We wanted a simpler site with a clearer message: easier to maintain and understand.

This is what we did, and some lessons from along the way.

Step 1: identity

The most important part occurred before we even started: we defined exactly who we are, and what we do. If you don’t know your own identity as a business, you’re going to waste a lot of time playing with your website until you find it.

We had a succinct new tagline – “websites that work” – that sums up almost everything we do and a value proposition (we focus on delivering results, not just pretty pictures). We drafted an identity brief – just 3 pages of A4 – that contained answers to key questions like “how do we price our work?”

“We aren’t the cheapest, or the most expensive. We aim to deliver the highest return on whatever you spend. Consider how much value an effective website can create for you – does a cheap website actually ‘save’ you money?

How do we deliver great service without costing the most? We have a great process and we focus on the right things. You’ll often find your top-line premium agencies are just inventing ways to spend your money. (“How about an interactive 3D map, with video clips from every country around the world?”)

Ultimately our aim is simple: whatever you spend, it should be clearly worth it.”

Our identity needed to be something we believed in, did, and were comfortable telling the world. It may sound simple or unnecessary, but this is the hardest and most crucial part. Without it, we’d just be putting random marketing crap on a page, which is sadly what most sites do.

Step 2: sketches

We used Balsamiq Mockups to knock up some quick sketches of all the key pages. Sketches allowed us to focus on what mattered without getting worried about design or brand yet:

We were then able to explore our sketches like webpages – Balsamiq actually makes the sketched links clickable – and did some quick refinement on the basics.

Our focus was on simplicity, so this whole process took under a day, including draft content for all pages. It made the next steps even easier.

Step 3: pretty pictures

We knew our brand was going to get a reboot, partly because all of Silktide is moving to a consistent look (we’re still working on Silktide Software’s site). However, we had decided to keep some key elements: the red & grey palette, and the logo.

Because we had sketches for every single page, our designers Ben and Bex (not a celebrity couple, but they sound like it) knew exactly what needed to go on each page. After wading through some creative block – working on your own brand is always the hardest – a single concept quickly developed into a clear favourite.

See how this early sketch, turned ultimately into this webpage:

Step 4: build

Putting the design together was incredibly easy, partly because our coding guru Alison is faster than the speed of light. We tried to measure how long she took, but we couldn’t click the buttons on the stopwatch fast enough.

Step 5: polish

Although a bit rough, we now had a workable website. Because it was in our CMS, we were able to split up refining the copy, images and design between us without treading on each other’s toes.

This part is the second most important after the identity step. Too many websites are rushed to meet an arbitrary deadline, without time to polish. We made sure we had time to make zombie hands pop out of boxes.

Step 6: oh-crap-we-forgot-something

We launched, and didn’t tell anyone.

On purpose, mind. We obsessively tracked the analytics for our site, and quickly discovered one fairly major oversight: only a fraction of visitors were visiting our new portfolio. Because we followed our old analytics regularly we knew this was odd: most people spend their time in our portfolio. Why the change?

The explanation was introduce-hand-to-forehead obvious when we saw it. We’d renamed all of our menu options one word: “about us” was now “about”, “contact us” was now “contact”. And “our work” was now “work”, which it turns out doesn’t make sense by itself. We quickly renamed it to “portfolio”, and traffic soared.

Aftermath

In total, the whole process took us about a week, although we spread that out over a month. We’re pretty happy with the end result.

Of course traffic is up too – but we’d expect that with any launch. What’s more interesting is people are spending more time on the website, and less new visitors are leaving (the so called ‘bounce’ rate). In the world of websites, that’s a Good Thing.

With hindsight, there were a few things that made this project work so well:

• We knew what we wanted
• We clarified our identity up front
• We prototyped early
• Decisions were made quickly
• We had time to polish at the end

Some of these lessons are working their way into our client processes now. We hope your next website redesign goes so smoothly!