Content first

We’re fond of advocating a content first approach to our clients. So when it came time to redesign our website, we were keen to practice what we preach. Before we wrote a line of code or designed a single pixel, we were thinking, talking and writing about our content.

Our content strategy emerged directly out of three core business goals:

1. Sign new clients in the media, sports, and entertainment space
2. Attract qualified leads for our products: DEQQ and TapThat
3. Recruit talent whose passions are aligned with our culture and values

With these objectives crystalized in our minds, we began to understand a few important things about our content.

1. First, it has a personality. Work at Play content is playful (naturally), a bit irreverent, and highly informative. So we wrote a style guide to keep our contributors in line and on message.
2. Second, our content is goal-driven. We generate content so that we can be found, so that we can offer value to our clients and community, and so that we can persuade. To achieve these goals we defined a message architecture and target keywords for each page on our site.
3. And third, our content travels. Only a small percentage of our content lives on our website. The rest travels the world through our various social media channels. To keep up with our globetrotting content, we needed a plan, complete with success metrics, for each of our channels – from our blog to our newsletter to Twitter, YouTube, LinkedIn and beyond!

Then, and only then, were we ready to sketch.

Designing a presentation platform

Vey early in our process, we had one governing design principle – our website is a presentation tool. We wanted a site that functioned as an enriched slide deck and that was optimized for a tablet browsing experience.

This principle drove design decisions from navigation choices to implementation of a novel feature that we call “the curtain.” The curtain is a design element that slides the main site out of the way so that a visitor can enter into full-screen mode and browse through content, such as imagery, video, or slides, step by step.

Go ahead – you know you want to try it. We’ll wait.

Playing with Flickr & Google Maps

In recent client work, we’d experimented with Flickr and Google Maps APIs. We decided our new site was the perfect opportunity to make a little magic and put these technologies to work in creative ways.

Flickr now serves most of the imagery for the site, including our slide shows behind the curtain. We used image tags to select and display appropriate images on our web pages. We also used a dynamically applied filter in the background to create an appropriate ambient feel for the background.

Google maps lets users find a route to our office, and through a little customization the map’s look and feel now matches the Work at Play brand. We achieved the circle effect on our contact page through some CSS trickery with transparent background images.

Another motto that we’re fond of advocating is “build what you design.” We’re proud to say that the Work at Play site is 100% built and designed by our always awesome and never-afraid-to-think-outside-the-box staff. Tell us what you think of our new look in the comments!

Testing our content

Despite our diligence, not every decision was clear cut or easy to make. We still had differences of opinion about which page content was more effective in a couple of cases. And so, we’ve launched multiple versions of some of our pages, and will be watching with interest to see which version performs best. I, in particular, will be watching with interest as there is a bottle of tequila on the line.