TIMELINE

3 days for UX portion

Program

Omnigraffle and Illustrator

Role

concept, strategy, research, wireframing

COMPANY

Fancy Pants Group

 


landrover_screen.png

OVERVIEW

In a partnership with Land Rover, Time came to Fancy Pants Group wanting a Lightbox ad unit that highlighted the new online interactive e-book called The Vanishing Game, a short story written by William Boyd, that highlighted Land Rover in this story. Beginning in a smaller 300x600px invite state that expanded to the 970x500px unit, my job was to take the story into a smaller format while still being engaging to the user and carry on the story's themes.

 

CHALLENGE

The biggest challenge was translating this interactive story into an engaging ad at a smaller size.

I wanted to keep the essence of this media being a story, while still maintaining unique interactive elements.

Another challenge was keeping the experience in line with the Landrover brand. Landrover is a sleek and sophisticated car, and the interactions had to mirror that.

RESEARCH

With a short timeline, I knew my research had to be meaningful. I started with digging deep into the Landrover site and the then not-released site of The Vanishing Game. I paid close attention to each site's transitions and interactive elements and how they utilized them. I then did some general research on experiential websites, seeing how these sites told stories in intriguing and interactive ways.

Going into the wireframe phase, I made quick sketches of three different layouts to send to the client to get their initial feedback. I wanted to tell a story and guide the user through the experience by having their position in the experience clearly indicated, while still formatting it in a way that led the user from one point to the next.

landrover_sketch.png

After getting client direction on wanting to explore two of the options, I moved to the computer to flesh them out in Omnigraffle. The first option features bottom navigation system for the user to experience each custom content section. Each custom content section is first supplemented with an excerpt from The Vanishing Game, where the user can interact with the text or have it read aloud. From there, users can view the custom content relating to Land Rover.

landrover_option1_wire1.png
landrover_option1_wire2.png

The second option features a top sliding navigation that leads the user through an experiential journey with custom content and text excerpts from The Vanishing Game intertwined. Custom content is revealed first as the user slides the experience horizontally, with a related text excerpt following it.

landrover_option2_wire1.png

This option is the stronger of the two in my opinion, because it fully encapsulates the essence of leading the user through the story. The top navigation immediately grabs the user’s attention and begs to be interacted with, giving a rewarding parallax motion of content when moved. The client ultimately decided to go with this option.

SOLUTION

In the design phase, I worked remotely with the designers in our overseas team to further craft this experience as the client had evolving needs. The ultimate result features 6 number interactive pages and 1 trailer page, guiding the user through a summarized version of The Vanishing Game.

landrover_design1.png