Topps Pennant

September 12, 2018

Role: User Experience Lead

How do you bring a company built on selling pieces of cardboard into the digital age? One of Topps’ solutions was to provide an experience where fans could relive meaningful moments from over 30 years of baseball history. Acquiring an app that did just that in 2012, the challenge lay in scaling and adding new features—social sharing, check-ins and more— with the aim of bringing a unique mobile tool to fellow baseball fans who could see its value. How could Topps encourage users to engage for more than a single search at a time? The above question led team to larger questions such as "how do baseball fans socialize?” Is being a baseball fan better as a solitary experience or a shared experience and should the app evolve into a social destination for baseball fans, what shape would that take?

To find answers, I spoke to baseball fans, surveying Topps collectors as well as approaching them at games and in local bars. I landed on a shared research document and user stories that allowed our team to understand Pennant’s fate was less "Facebook for baseball fans" and more that of “elegant data provider." Instead of using Pennant to socialize, fans could use at to consume unique, elegant data and encourage others to consume by tagging past games and reminiscing via aggressive social media.

After arriving at that conclusion, my involvement with Pennant was two-fold: First, I designed new branding and collaborated with a development team to iterate upon new features (audio playback, tagging and checking, sharing moments) and revised interactions (such as a seamless transition between radial and grid box score views). Second, I was instrumental in conceiving and designing marketing landing pages, art directing a team of freelance front-end developers whom I oversaw. The wireframes for the browser-based landing pages can be viewed here. Finally, I designed a "Summer Barnstorm" Campaign (highlighting shared memories on a team-by-team basis via Twitter throughout the summer of 2012, selecting the best memories to receive official MLB memorabilia) which included a landing page, marketing materials and mobile ads. The overall campaign resulted in increased downloads of the app, increased engagement with and a tripling of followers to Topps Pennant social media channels, and a number of memories shared on Twitter into the triple digits.

Final visual design for the Topps Pennant landing page as viewed on browser. I designed the logo and the overall visual design (fonts, textures, colors) was pulled from the app's design system. In addition, I added an interactive carousel for testimonials beneath the left rail and added a place for marketing videos below the logo/tag. On the final landing page, the iPhone in the right rail presented a brief slideshow following a single data/memory search within the app.
AT TOP: Final visual design for the Topps Pennant landing page as viewed on tablet. AT BOTTOM: Final visual design for the "Summer Barnstom" landing page — each dot on the map coincided with a team and memory we "traveled" to that summer. When the Pennant team highlighted a specific team, fans had a limited amount of time to share their favorite memory of that team to Twitter — a randomly chosen memory won that fan a piece of baseball memorabilia from that specific team. I designed the landing page, the interactions (each city had a before, during and after state as well as a tapped state that would highlight the stadium and date of the Topps Pennant "visit" —whether upcoming or already completed). I oversaw a team of front-end developers and worked alongside a writer/editor in order to bring the campaign for life.
AT TOP: Final "About" page for the Campaign. AT BOTTOM: Highlighted current stop with team-specific hashtag
Final visual designs for the Topps Pennant landing page and the "Summer Barnstom" landing page as viewed on a phone.