Figma Make Rapid Prototyping
Problem
Youth sports referee scheduling is operationally complex. Assignors must coordinate referee availability, certification levels, field locations, and league requirements across hundreds of games.
In many organizations this work still relies on fragmented workflows:
• spreadsheets for availability tracking
• email and messaging for assignment coordination
• league systems with limited scheduling flexibility
• manual reconciliation of conflicts and changes
These processes create significant operational overhead and limit scalability for organizations managing large volumes of games.
At the same time, advances in AI-assisted development have created new opportunities for individual designers and small teams to understand complex product ideas faster than traditional workflows allow.
RefSync began as an exploration of two questions:
• How might referee scheduling be modeled as a multi-tenant SaaS platform supporting multiple organizations and roles?
• How can AI-orchestrated product development accelerate product design, architecture, and implementation?
FigJam Documentation
Solution
RefSync is a platform design exploration focused on modeling operational scheduling systems as multi-tenant SaaS infrastructure.
The project determines how scheduling platforms can support:
• organization-level tenancy
• role-based permissions
• workflow-driven assignment systems
• protected routing and session management
• scalable UI component structures aligned with implementation
Rather than separating design and engineering phases, the project is built using an AI-assisted development workflow where product thinking, system design, and code evolve together.
Platform Stack
• Next.js (App Router) — application architecture
• Supabase — PostgreSQL database, authentication, row-level security
• Resend — transactional email and onboarding flows
• Tailwind CSS — UI styling and component patterns
• Vercel — deployment infrastructure
• AI-Orchestrated Workflow
Development is coordinated across several specialized tools, each used for different parts of the product development process.
Product Strategy and Architecture
• ChatGPT — prompt development, architectural planning, and product strategy exploration
Engineering and Implementation
• Cursor CLI — primary development environment
• Claude — deeper reasoning for code architecture and refactoring
• Codex — rapid implementation and small coding tasks
Design and Prototyping
• Figma Make — rapid UI prototyping
• Figma — interface exploration and component structure
• FigJam — workflow diagrams and system documentation
This workflow allows rapid iteration across product thinking, architecture, and implementation while maintaining alignment between design and code.
Outcome (Current State)
RefSync is an ongoing exploration focused on validating platform architecture and scheduling workflows for operational systems.
Current progress includes:
• establishing the foundation for a multi-tenant platform architecture
• implementing role-based routing and permission models
• designing early scheduling and assignment workflows
• building a production-aligned UI component structure
The project continues to evolve as both a product and a practical process in AI-assisted product development, understanding how modern tools enable designers to move fluidly between strategy, design, and implementation.