Interactive Design Project Takes You Down Highway One

When creatives tackle an interactive design project, one goal is to engage visitors with clever and interesting features. The website or app must be intuitive and have a high level of readability. Not just anyone can throw together an interactive design project. It requires true professionals.

That’s why Exsus, a London-based travel company, came to Shout Digital seeking help with a new project, an interactive journey down Highway One and the Pacific Coast Highway in a red Cadillac Eldorado. Visitors pass through San Francisco, Morro Bay and Los Angeles on their way to San Diego. To see how Shout Digital same up with the concept and executed it to such a high standard, HOW caught up with the Shout online marketing and creative teams to explain the interactive design project from start to finish.


Exsus interactive design project daytime opening

Exsus’ interactive design project daytime opening

Exsus interactive design project nighttime opening

Exsus’ interactive design project nighttime opening

What can you tell us about the client?

Exsus is a privately owned luxury tour operator, primarily based in London with 13 years of experience. They plan and prepare bespoke luxury holidays and honeymoons for their clients to destinations such as North and South America, Mainland Europe, Africa and South East Asia. Exsus was referred to Shout Digital, a full service creative digital agency based in Newcastle-upon-Tyne.

American roadtrip interactive design project 6

Was the client always looking to create a website or did Exus look to Shout to plan the overall direction?

Exsus approached Shout to help promote their portfolio of North American holidays and their accompanied itineraries. Combining the creative team, who designs visuals for the websites and graphics the agency produces, along with the online marketing and development teams, Shout developed the idea of creating a virtual road trip along Highway One and the Pacific Coast Highway, which is one of Exsus’ featured itineraries.

Throughout the process of creating visuals and content and developing the virtual road trip, Exsus aided the process from start to finish, highlighting features they wanted to see along with sections Shout had created that they liked.

American roadtrip interactive design project 1

Who worked on the project?

In total, six members of the Shout digital team helped bring the California road trip from concepts to visuals to reality. The online marketing team consists of Ali Graham, online marketing manager and Jonny Rowntree, online marketing executive. The creative team consists of Ian Mullen, creative director; Andy Hiles, creative designer and Jennifer Hodgson, copywriter. The web developer on this project was Jennifer Rudd.

American roadtrip interactive design project 2

How long did the project take?

We started the project in October with initial meetings in the conference room involving the online marketing team, creative team and our copywriter. In the meetings, we discussed the purpose of the interactive website, what information would be included on it and what it would look like.

We then introduced the lead web developer on this project to the meetings to discuss the technical aspects to this project. The project mainly consists of HTML5 and CSS3 technology combined with Javascript in order to load the next scene as it appears in the visitor’s perspective.

Over the course of November, Rudd continuously developed the site aided by visuals and refined designs from the Shout creative team. This process continued until it was sent for testing before being deployed in the first week of December.

From initial meetings to visuals, development and testing, the project was built from ideas to the final version in three months.

American roadtrip interactive design project 3

What tools were used to create the website?

When sketching the initial designs, the creative team used almost every tool in their designers toolbox, including a mechanical and normal pencil, a swan Morton blade for sharpening, a putty rubber, fine liners, biro pens, a metal ruler, a circle stencil, a layout pad and a sketchbook.

In order to translate the sketches into digital designs, a graphic tablet was used and the sketches were imported into Fireworks. The creative team chooses to use Fireworks over other graphic applications, such as Illustrator or Photoshop, because of its excellent vector capabilities, the ease of exporting artwork and collaboration between designers and developers as they use the same application to slice up artwork. The workflow within Fireworks is more fluent compared to other applications the creative team has worked within as you can have multiple pages within the same document.

American roadtrip interactive design project 4

What was the biggest challenge of the project and how did you overcome it?

When we started to design the visuals for the project, we used some of the meeting time to brainstorm and develop the initial style which would be carried out throughout the project. However, the biggest challenge was keeping the illustrations consistent with the style we constructed. We were able to overcome this challenge by refining each of the designs before the final build was put together and deployed live. This activity was completed both internally, involving our online marketing, creative and development teams, and externally, involving Exsus.

American roadtrip interactive design project 5

Overall, what was the final project meant to achieve?

The main aim of the project was to create something that is visually impressive and is something a user can interact with, either by way of scrolling through the entire road trip or clicking on the characters we’ve created and implemented in each of the cities. Upon completion, each member of the team shared it on his or her own social media accounts: Twitter, Facebook and Google+.

To help generate some additional attention from across the web, we worked with some of our media partners within the travel and design industries to highlight the trip on their blog or magazine. At time of writing, we have worked with popular design blogs, Creative Bloq, Specky Boy and, of course, HOW Design and have generated 630 likes on Facebook, 250 tweets on Twitter and 70 +1’s on Google Plus.