Arena
Sports Management Platform (SaaS)
Role Lead UX/UI Designer
Tools Figma · Jira · Confluence · Slack
Duration Dec 2024 – Present
Status Ongoing – Active product
Overview
Arena is a sports platform designed to help organizers create and manage leagues and tournaments, while allowing athletes and spectators to follow competitions, track live scores, and view performance data in real time.
The Problem
Competitions managed with spreadsheets, paper schedules, and WhatsApp chats
No real-time visibility of scores, standings, or player stats for anyone outside the game
No central place for players to track their performance history across competitions
How sports competitions are often managed today
My Role & Responsibilities
I joined Arena as the sole designer when the product was just a concept. Every screen and flow was designed by me, informed by competitive research and continuous iteration with the team.
Design system & component library
Multi-perspective flow design
End-to-end UX/UI design
Information architecture
Developer handoff documentation
Key Design Decisions
Tournament Creation Flow
The tournament creation flow guides organizers through team setup, format selection, scheduling, and rules without overwhelming them. It uses collapsible sections with contextual descriptions and free navigation between steps — organizers complete what they know and return later for the rest.
Live Scoring Under Pressure
Live scoring had to work under pressure: loud environments, officials focused on the game, no time for mistakes. The design prioritizes speed — large tap targets, always-visible score, immediate visual feedback, and undo support. Stats update in real time so coaches and spectators see performance as it happens.
Key Screens
League Profile
League profile as central hub
Tabs organize content by purpose: Schedule for match calendar, Standings for rankings by division, Leaders for top performers, Playoffs for bracket view, and Awards for season recognition. Each perspective serves a different user need without overwhelming a single view.
My Teams
Team management with status filtering
Active, Pending, and Past tabs filter teams by engagement status. Each card surfaces key info at a glance: role within the team, roster size, tournament count, and upcoming match details when relevant, reducing the need to drill into each team to understand current priorities.
Calendar
Auto-generated match calendar
Based on league configuration (teams, format, available courts), the system proposes a complete schedule with time slots and venues. Organizers can manually adjust or approve as-is, eliminating hours of manual scheduling work.
Reflection
What I learned
Designing Arena taught me that real products live in their edge cases. The happy path is the easy part, the work is in the empty states, the error messages, the permission logic, and the flows that break when something unexpected happens.
What I would do differently
If I could do one thing differently, I would get the live scoring flow in front of real table officials earlier. Their speed and behavior under match pressure is something you can only partially anticipate through research.