Article Image

ROLE

Project Co-Lead & Lead Design Engineer

SKILLS

Project Management UI Design Web & Mobile Optimization CSS & Frontend Architecture

I was co-lead of a team that redesigned and rebuilt Gapyear.com, one of the UK's leading community travel portals, from the ground up.

With a focus on content management, page speed, maintainability, and accessibility, my role on the project bridged my user experience design, technical, and leadership skillsets.

read

Taking the Leap

Gapyear.com is one of the UK's foremost online travel portals and social networks, offering expert advice and inspiration on travelling and volunteering to the UK's young and young at heart. Founded in 1998, the website has grown at a steady but unrelenting pace, with a strong community spirit laying at the heart of its growth and appeal.

The company was acquired by Flight Centre, a large global travel agency, in 2012, and I was part of a small team tasked with taking their at-the-time fairly modest web presence to "the next level" - overhauling the existing website and building a modern, user-centric community platform in its place.

Hearts and Minds

Gapyear's success was built on its awesome community of backpackers, students, and travel enthusiasts - guys and gals who dedicated their time and effort to provide in-depth advice and accounts of their personal experiences to fellow travellers. These wizened sages were the heartbeat of Gapyear.com, and were a huge part of what set the website apart from the competition.

Retaining this strong sense of community was at the forefront of our redesign efforts.

We engaged these superstars early and often, partnering with usability testing firm CyberDuck to conduct user interviews, eye tracking tests and focus group sessions with the community which fed a lot of the design decisions made.

http://localhost

The Content Management Conundrum

With hundreds of authors, editors and content providers spread across the globe, Gapyear needed a flexible content management system that allowed both content creators and website administrators to create and manage varied types of content (blog posts, in-depth articles, video diaries, photo albums... the list goes on) with minimal fuss. At the time the site's content sat on a shaky bespoke solution that suffered from maintennance, usability, page speed, and development lifecycle issues.

After extensive analysis we settled on the ExpressionEngine framework as the way forward. Its powerful publishing tools, built-in security and user management features, and extensive customisation options made it the perfect fit for the new Gapyear.com, giving us sturdy foundations to build upon, not to mention a greatly simplified publishing workflow that our users instantly fell in love with.

Crossing the Channel

The site's recent acquisition by a company with "booking" at the core of its online offering also opened up the door to start integrating clever sales and cross-channel features into the site

This hit both the business ("we have so much unfulfilled potential with our partners and advertisers ") and user value ("when I read a great article about an activity or tour it would be great if I didn't have to scramble around Google to try and find the tour company and book it for myself") nails on the head.

http://localhost

Looking Onwards and Upwards

With the desire for the new Gapyear.com to be a high-traffic, feature-rich website, and a product roadmap featuring radical new (for their time) innovations like faceted search and filtering, region-specific pages and versions, location-based content tagging, and contextual navigation, we knew we needed to build the frontend from the ground up for complete control.

http://localhost

Accessiblity and standards compliance - three words dear to my heart - were critical factors, and it was my job to ensure that we not only ingrained their core tenets into the new site and content management platform, but laid out guidelines and internal protocols for future teams to follow. Implementing a custom solution and building all templates and stylesheets from a clean slate meant that we were also able to extend the system in ways previously unimaginable, maintaining a living web presence that could grow with the company as it evolved.

Rolling out

The new Gapyear.com was rolled out in small increments over many months, starting with the content management framework and new user interface foundations, and then incorporating new features and sections prioritised on user and business value as time went on. With my focus as Lead Design Engineer being on the site's overall user interface and content management, page speed, maintainability, and accessibility, my role touched almost every facet and feature release, bridging my technical and user experience skillsets. Most importantly, the new website was well received by the community, its users, and its new owners, serving as a platform for the company to grow in brave new directions.

"Well done guys. I know nothing about building a website, but i’m sure it takes a lot of time and would be painfully frustrating at times... The country sections are awesome and the information available on this site is everything a backpacker (or future one) could possible need. I stand by that this is the best ‘one stop site’ for all of your needs. Keep it up and I have always appreciated this site."

Lunny, longtime Gapyear.com community member

Next project