Ram Trucksexperience art direction with seamless structure and custom vfx pipeline

RamTrucks.com

Based on our past interactive graphic novel work for Disney's Tron: Legacy and Coke's Play Fanta, Ram came to Vectorform looking for an interactive HTML5 experience for their ramtrucks.com home page. Goals included increasing customer interaction, visitor retention, and an improved J.D. Power rating.

Working through various approaches, I helped create previsualisation of several user experience options. By balancing the technical capabilities of online rendering and the aesthetic production goals, I was able to help guide the client to a solution that was both capable and engaging. The final direction involved a seamless video loop that traveled through the entire product line with interactive content built directly into the scene; never moving from or covering over our heroic content—the Ram vehicle being highlighted.

Storyboarding included stringent mapping of the camera path, vehicle path, and scenery boundary markers. I designed the entire experience to be as modular as possible, ensuring future updates could be made with minimal restructuring or damage to the original goals. Working with the Vectorform art team, these storyboards were made into master templates for all involved parties to reference throughout the project, ensuring consistency and solid communication throughout.

Previsualisation involved creation of a camera rig that would allow for interactive arcing movement at key points of the experience. As part of the previs process I built custom parallax control solutions in both After Effects and HTML/Javascript to allow the team to preview exactly how mouse interaction would feel with different ranges of input motion and 3D distance. Motion graphic demos were created for meetings, along with user interface animations to illustrate the primary user experience points.

Art direction

As art director on the project I collected reference imagery for every environment and location we needed to show, along with detailed lighting and grading notes for the CG team working on the vehicle animations and environments at Mackevision. Each segment of the seamless loop had its own mood board, carefully orchestrated to create a trip across the United States, basing each look on iconic landscapes from western coastline to eastern metropolis. Each landscape was tailored to the vehicle it would highlight, showing off the wide range of capabilities in the Ram product line.

Every aspect of the project was designed to seamlessly mesh with and then extend the existing Ram brand, from established colour grading tonality to themes of work and play.

Project management

During production I worked closely with both internal and external teams, ensuring all assets were delivered and integrated correctly with the rest of the project. Vectorform created all of the user experience, from visual interface to interactive motion graphics and the final cutaway effects. Mackevision produced all environments and exterior vehicle renders, and working directly with their team I helped finish the final colour grading at their location in Rochester, Michigan. Chrysler CGI produced the interior component renders, matching Mackevision's virtual cameras to ensure accurate asset alignment. I worked as liaison between all three companies, providing technical guidance and quality control alongside the Vectorform producer.

I handled organisation of the motion graphics side of the project by building documentation that tracked everything from initial script through final delivery of the web-ready compressed assets, providing Vectorform project leadership with estimated timelines and progress reports.

Creation of the visual effects for the final experience required several custom tools developed in Quartz Composer along with numerous OS X automations to improve batch processing efficiency. These included reflection map painting with realtime vehicle preview, effects processing, and illustration filters.

Results

The Ram team loved the final product, and the experience quickly produced marked increases in website traffic, visitor retention, and follow through to subsequent product pages. The website's J.D. Power rating jumped to first place in its category, and maintained good numbers throughout the lifespan of the experience. Thanks to the careful planning in early stages of the storyboarding and scripting process, the addition and changing of vehicles in the summers of 2014 and 2015 were not a problem, allowing Ram to efficiently and cost effectively keep the experience updated.

Experience it for yourself

ram.vectorform.com