Home

Projects

Resume

Gravity Ad Unit & Management System

Gannett’s Gravity unit is an immersive cross-platform advertising experience. The advertiser’s cinematic video and message are showcased within a fluid design. Gravity is an award-winning product and lead ad revenue generator.

Roles

UX & Design Lead - worked with 2 product managers, 2 iOS developers, 1 Android developer, 1 web developer

Tools

Illustrator, Photoshop, Edge Animate, After Effects

Platforms

Responsive web, iOS, Android

Skill Development

Responsive system, prototypes, asset creation, client-facing documentation & templates, wireframes, style guide

gravity-example

Problem

Video advertising was on the rise and increasingly desired by advertisers. The USA TODAY NETWORK did not have a product to showcase video in a unique and compelling way for advertisers.

Our team worked with the revenue team and advertisers to define the needs of a successful video ad unit. Developing a responsive unit was a priority because our previous ad products were not cross-platform. Furthermore, the ad product needed to support 100+ publishing sites, serving both small-town and national advertisers with strict deadlines.

Approach

Our team analyzed desktop and mobile screen sizes to create a system that allowed elements to scale and reposition appropriately without interfering with advertisers’ messaging.

Since over 100 designers would be building Gravity units, we developed templates meeting the needs of their workflows. We created two responsive templates: one to support advertisers with quick turnaround times and another for design flexibility.

Gravity is a premium unit; therefore, an important part of the design process was creating quality standards for maintaining a positive user experience.

Responsive System

The ad unit needed to be responsive to reach our audience and stay competitive in the industry. The challenge was to support all viewports while keeping advertisers’ messaging in-view.

gravity-responsive-system

Component-based Design

It was a requirement to support quick turnaround times (less than 2 hours) and integrate seamlessly into the ad workflow with 100+ publishers. We utilized component-based design to help with speed and scalability.

gravity-component-based

Optimizing the User Experience

We understood that advertising can impact the user experience, and we wanted to make sure our users had the best possible experience with this unit:

gravity-optimizing-user-experience

Benchmarks & Award

The team successfully achieved industry metrics beyond expectation, which made Gravity attractive to advertisers and our users.

gravity-optimizing-user-experience

Gravity Product with Creatives

gravity-example-planet-fitness gravity-example-qantas gravity-example-des-moines

Gravity Builder - Management System

Gravity Builder is a CMS for producing Gravity ad units. This tool is linked to DFP (Google’s Doubleclick for Publishers) and allows seamless uploading, scheduling and previewing. The tool was built for users with any technical skill set.

Roles

UX & Design Lead - worked with 2 product managers, 1 project manager and 1 web developer

Tools

Sketch

Platforms

Responsive web

Skill Development

Form validations, upload asset experience, alerts, blank states, search functionality, index priority

ravity-management-hero

Management System

Color gradation indicated the status of Gravity from creation to running live - the darker the color, the closer it was to live. The list view showed important information at a quick glance, while a detailed view was available.

gravity-management-system
gravity-management-system

Build Process & Preview Screens

After collaborating with designers, sales and Ad Ops, we learned the tool needed additional functionalities to support their ad operations workflow. For example, syncing with multiple publishers, instant updates and previewing.

gravity-management-build
gravity-management-preview