Project Metadata
- Role: Lead UX, Product Designer & UI Engineer
- Timeline: High-Velocity Sprint (Driven by upfront system mapping and AI-assisted implementation)
- Platform: Responsive Web
- Tech Stack: Figma, Claude Code
- Core Focus: Replace existing subscription page with dynamic content so value prop section are customized for each fan experience. Dynamically populate each section with real data: team-specific content using associated team, mascot, and author names, and real data from the team's app and message board(s).
The Business & User Challenge
The previous Join Now (subscribe) page was using generic terms for every localized team market. We want to adopt real data for each local market so the sections read better for local fans, driving signups.
- The Core Objective: Increase conversions:
- Localized naming: Use real data for each team, mascot, and author names
- Message Boards: Use real content from the team's primary message baord
- App: Use real content from the team's app, including that team's app header and colors.
National Coverage Included: AI Map
The On3 subscription also comes with access to the entire national database of localized team coverage. Utilizing Claude AI, create a map that visually respresents each market On3 currently has boots on the ground covering local athletic programs.
- Publishers present: Find the school's location and insert the official logo to indicate On3 has publisher-suported coverage.
- Channel sites (future expansion): Find school's location and display a small dot to represent additional markets still in need of a local site publisher.
The map respresnts the vast amount of localized market coverage for On3, with additional areas where it can grow.
Localized App Content
Use real content from the team's app, including that team's app header and colors.
- Team graphics: Use AI to bring in the local team's color scheme and brand logo
- Team content: Use AI to bring in real articles from the local team's app
- Push alerts: Use AI to bring in real content as a push notification example