Puck
Line
Pro
Designing an AI-powered hockey betting dashboard that turns predictive intelligence into a winning edge.
The Product
PuckLine Pro is an AI-powered sports betting platform purpose-built for NHL fans and bettors. It combines real-time fixture data, machine-learned odds analysis, and a clean dashboard experience to give users a measurable edge over traditional betting platforms.
The platform distills complex statistical models into simple, actionable picks, surfacing the right bet at the right time, powered by a proprietary AI engine called BTRZedge.
What Was Built
Scope
- End-to-end dashboard UI/UX design for a betting AI web application
- AI-powered Top Picks feed with real-time odds display (Home / Away / AI Pick)
- Individual game bet view with player spotlights and main/side bet categories
- Bet Slip component: live stake management and return estimation
- Schedule & Table widget with filterable calendar view and conference standings
- AI Report module with Ask-AI prompt input and bubble chart visualization
- My Report section with active bet donut chart and tag-based segmentation
- Next Fixtures ticker with team matchup logos
- User balance, notification, and navigation system
Tools
14 Weeks
The Objective
Make AI betting intelligence accessible, not intimidating.
The core goal was to design a betting platform where AI recommendations feel natural, trustworthy, and immediately actionable. The product needed to serve two user archetypes: the casual NHL fan placing a first bet, and the experienced bettor who wants deeper data on demand. Both should find value within 60 seconds of opening the dashboard, without onboarding, without friction, and without information overload.
What We Were Up Against
How We Solved It
Hierarchy-First Dashboard Layout
The main dashboard was structured around a clear visual hierarchy: the Top Picks feed dominates the primary content area with Home, Away, and AI Pick odds always visible. The AI Pick column uses a distinct color treatment to signal provenance without requiring a label read. Peripheral data (Schedule, Bet Slip) occupies the right rail, accessible but never competing.
BTRZedge AI Branding & Transparency Layer
To address trust, the AI was given a distinct identity, BTRZedge Verified by AI, displayed prominently on the individual game screen alongside real player imagery. This humanized the recommendations. An "Ask AI" prompt input in the My Report panel further positioned AI as a responsive advisor, not an opaque oracle.
Progressive Disclosure on Game Pages
The individual bet page (Dallas Stars vs Arizona Coyotes) used a progressive disclosure model: hero images establish emotional context, player spotlights add depth, and Main Bets / Players / Game tabs allow users to go as deep as they choose. Bets are scannable at a glance but expandable for detail.
Persistent Live Bet Slip
The Bet Slip panel was fixed in the right rail across both dashboard states, always showing current stakes, multipliers, and estimated returns. This persistent context prevents the common error of losing track of active bets. Color-coded bet rows and inline ×close actions keep management effortless.
Schedule × Table Widget with Tag Filtering
The calendar component was designed with a dual-mode toggle (Schedule / Table) and persisted tag filters, allowing users to quickly segment upcoming fixtures by team or competition. Highlighted date cells use a subtle green glow to draw attention to event-rich days without demanding it.
The Outcome
"The design finally made me feel like the AI was on my side, like a betting partner, not a slot machine."
Beta User, NHL Bettor, Toronto