Alliance of American Football Website

AAF was the tech-centric pro football league offering a digital interactive experience allowing fans to experience the game like never before. The site offered multi-feed video streaming and paired real-time player telemetry with 3D interactivity. Standard features of a sports league website also included - stats for players, teams, league, standings, tickets, etc.

I was contacted by a previous business partner about a UX Lead role for the web product at the Alliance of American Football. He described the working experience being akin to a 4 month long hackathon. I started 6 days before the launch of the inaugural season. Operating at a hackathon pace was absolutely correct. Unfortunately for me, the awesome experience only lasted 2 months and change due to the implosion of the league that was beyond anyone’s control (except for Tom Dundon). The experience gave new meaning to working fast and being nimble for me. The new website was launched the night before the first game. There were 4 games every weekend. We pushed new features and updates between games, EVERY game. A newer version of the website was deployed on a weekly basis. It was nice to see some of the fans acknowledge that on Reddit :)

Working with a team of 3 engineers building a product that would garner 11 million eyeballs, iterative design and prioritization was critical. This meant having an in-depth understanding of technical feasibility and implementation time intensity, while balancing demands from management and page visibility from Google Analytics. For every feature of the website, I designed at least 3 variants - VP (viable product), MVP, and MMVP. I worked solely in high-fidelity to minimize misinterpretations from design to implementation.

Landing Page Iterations

Desktop

Mobile

After looking at week one's analytics, I realized I needed to remove my B2B hat and design mobile first (67% mobile).

Team Ticket Center Iterations

Mobile

Desktop

To prioritize pages and features, I used a spreadsheet to compare technical feasibility, management priority, and page visibility from Google Analytics.

The Basics

User flow diagram. Partly made to demonstrate that the site needed some optimization after the hackathon phase is over (post-season).

Spreadsheet for pages with a standard design but data variations (aka football stats)

Site Snapshots

I wish the site was still live for viewing but at least here are some snapshots.

Stats and Game Center

Standings, Schedule, and Game Center on Mobile

Paying tribute to each team and advertising our tech-centric-ness