The Garmin vívoactive Page Grabber was an OMMA 2017 finalist in Rich Display Media. The unit is a full-page takeover that drops the GPS smartwatch into the page and lands the miles run in the viewer's own region against the miles left to go.
The unit had to carry a live Garmin activity feed in the brand reveal, hold the drop-in and overlay motion, and still clear the ad-serving file-size limit.
How we built it
I took Garmin's creative assets and componentized them for a Page Grabber that had to carry a live feed and this motion system. Componentizing meant the brand reveal, the color and black-and-white states, and the overlay that crosses them stayed separate pieces, so live numbers could land in the reveal without re-cutting the motion. I owned wiring the feed into the reveal and packing the unit to serve. The feed came from Garmin's activity API, which summed activity across the region the unit served, so a viewer read the miles logged near them and their own time of day.
Animation ran on GreenSock with CSS3 layered in, color and black-and-white states crossing under a shared overlay at different page lengths. Daniel Englert, my manager, owned a lot of the motion judgment on the unit, and I applied what I learned from him on animation and motion design as we built it. I was his first hire, and for a stretch the two of us were the only creative developers at Undertone, sitting next to each other and hand-coding formats from scratch before productizing them onto the ad serving platform, so a lot of the process was ours to invent.
When the hard file-size limit blocked what the unit needed, the loop widened to three. Crow, lead engineer and architect, expanded the limit and put the standards into the framework, which moved the constraint off the creative and onto the platform. I pushed to experiment further while he held what the platform could safely serve.
What later builds kept
The part that carries to later projects is the mental model, especially how we laid out a shared file system and directory for this kind of unit. Delivery itself stayed manual at the time. We passed zips back and forth and packed files down under the weight limit while we worked out where automation would help, and later builds started from that directory and handoff shape.
Credits
I wanted to make sure everyone on the team was cited here, because none of this would have been possible without these people.
| Name | Role at Undertone |
|---|---|
| Josh Gotthelf | VP, Brand Marketing |
| Jeff Ortegon | Creative Director |
| Jeffrey Liu | Creative Developer |
| Justin Samuels | Senior Manager, Brand Marketing |
| Ilana Greenberg | Brand Marketing Content Coordinator |
| Mariam Matin | Brand Marketing Associate |
| Jaime Nash | Associate Director, Creative Strategy |
| Chris Negron | Vice President, Sales |
| Dayna Hall | Senior Art Director |
| RJ Turchick | Senior Creative Project Manager |
| Tiffany Saldibar | Director, Advertiser Solutions |
| Alexi Kuelske | Manager, Client Strategy |
| Kelsey Hughes | Senior Client Services Manager |
The names and roles above are the campaign credits from the MediaPost OMMA 2017 finalists page. Daniel Englert and Crow, named in the build section above, worked on the unit alongside them.