Let’s be upfront. It’s not every day that an independent web designer gets approached by a multi award-winning company to redesign their website. It was even more unlikely after making a boardroom of decision makers (used to interviewing industry world leaders) sit through slide after slide of a hapless presentation. It felt like a train wreck and a low point of my career. Graciously, Green Park allowed me to submit three new home page ideas, and we continued to talk. After reconsidering, they decided to place their trust in Catch22 for the redesign over more experienced design agencies. That decision said far more about Green Park than it did about my abilities. It proved they genuinely placed real stock in business chemistry, and found the common ground. I was humbled by their decision.

Takeaway: Business Chemistry and Communication can trump Experience and Professionalism.

The Design Brief

The Client Said: “We want to refresh and professionalize our website without losing our unique personality so that it reflects our maturity. We want to be more corporate but without the stereotypical ‘stuffiness’ attached to that.” They also gave a useful breakdown of priorities with ‘Return on Investment’ being the highest, followed by retention of brand identity and then finally creativity, improved functionality and improved SEO.

Client Requirements: Green Park needed a CMS with strong editing capabilities, a feature-rich blog experience, fully featured jobs board, content scalability, industry compliant accessibility and social features, along with a responsive design for the growing number of mobile internet users.

Design Goals and Challenges

Firstly we needed to choose the right platform to develop on. We shortlisted ModX (existing platform), WordPress and custom build. In the end, due mainly to client user-friendliness, design flexibility and available feature set, we decided on the world’s most popular open-source CMS WordPress.

The existing site was the starting reference point and thankfully it was solid, logically laid out and had a substantial level of layered content – the previous company had done a stand-up job. But, there was room for progress and after reviewing it, we could see some ‘low-lying fruit’ to get big wins for the client and users. The three biggest usability improvements I believed we could achieve were in A) improving the layout and readability of the content, B) improving the navigation and movement throughout the site, and lastly C)  improving ‘sign-posting’ and introducing much clearer calls to action. All of which would improve the user experience, interaction with the Green Park brand and ultimately the likelihood of connecting with their target market.

Green Park had lots of quality content, but little that helped visitors engage with it. We radically addressed that. The main inspiration wasn’t from Green Park’s competitors, but the design of broadsheet newspapers like The Guardian.

The Existing Website

The Design Process

We are a design-lead company so we began the web design process in Photoshop, drafting the all important homepage first. Once finalised we moved onto the ‘templates’ for the other main pages. Once Green Park were happy, we developed a fully functional HTML build of the site, which included all the moving parts so they could get a good “feel” for the finished website. We then converted the HTML build into a custom-built WordPress theme using the best plugins available and custom coding the remaining features.

Once complete, we began adding content and polishing the usability. Then came the final review with a read-through, browser checking and mobile device testing. The final step was moving the completed website from the development area to the live domain.

New Homepage!

Top 5 Design Features and Improvements

1. Revamped Navigation

We created a dropdown menu system we referred to as the “SuperNav” which gave users an instant visual snapshot of each section and access to the top two levels of content. We worked very hard to allow users to move up and down the content tree as logically as possible. We also made the navigation ‘sticky’ so when scrolling down, users would have easy access to the main pages.

2. Site Structure

Information architecture is a multi-tasking art form. Green Park’s content had many levels and so we wanted users to be able to instantly grasp which ‘floor’ they were on, and to know how to get where they wanted to go. This was achieved by a combination of variation in page types, informative sub navigation, logical page structures and clear calls to action.

3. Calls to Action

Green Park is fundamentally a people business and it’s reputation is built on high-level individual care. So we were keen to cement that by having personal ‘business cards’ on each relevant page. Moreover we worked to develop more intuitive ‘sign-posting’ supported by strong user feedback for where users should click to get what they needed.

4. Cutting Edge Jobs Board

This was practically a website in it’s own right. It included an Ajax powered search engine that filters results as you type, one-click instant category filtering, a homepage jobs feed, intelligent application handling and an RSS feed to update Green Park’s social media channels.

5. User Focused

This encapsulates all previous points but specifically was about passionately fighting for what would be best for the user against the demands of personal preferences, great ideas and Google. This also included asking Green Park to embrace ‘responsive design’ which we believed would be appreciated by their iPad owning executives and also separate them from their online competition.

Before and After Comparisons

Top Level Page (BEFORE)

Top Level Page (AFTER)

Content Page (BEFORE)

Content Page (AFTER)

Conclusion

The Green Park redesign presented a terrific challenge. Included were the demands of an evolving brand and a rapidly growing business, in-house communication needs, the changing demands of Google, raised design expectations by virtue of the redesign process, changing user needs and expectations, a changing social media landscape and the increase in mobile device usage. That’s without even looking over our shoulder at what the competition might be up to!

Ultimately there are many indicators that can determine a successful redesign – from high client satisfaction, positive user feedback,  improved Analytics scores, increased inquiries, improved inquiry quality and on it goes. On those metrics we scored very highly and looking back the launch of Green Park’s new website there is a high degree of satisfaction in the Catch22 office of a job well done. But, the critical role of the client has to be acknowledged. Web development is a collaborative PROCESS that requires mutual trust and commitment to the project. Green Park demanded much but importantly were open to learn, explore new ideas and trust in recommendations. It was the marriage of all these factors that resulted in the most technically advanced and holistically accomplished website we’ve ever produced.