Findaside.
A responsive platform for creating, discovering and managing casual football games.
- Platform
- Responsive web app
- Role
- Frontend Developer · Product UI Contributor
- Timeline
- 2025
01 / CONTEXT
Problem and response
Challenge
The product needed a working frontend for two user types: hosts who create and manage games, and players who discover, join, and coordinate around those games.
Response
Findaside brings the full game-management journey into one responsive web app with structured flows for creating games, managing players, generating teams, tracking payments, and handling account settings.
02 / CONTRIBUTION
What I owned
Frontend Architecture
- +Built the frontend structure across 30+ page-level screens.
- +Organized routes and features for auth, dashboard, games, payments, profile, and settings.
- +Created reusable layouts, route constants, shared UI primitives, cards, forms, and utility components.
Product UI
- +Implemented authentication, onboarding, dashboard, game creation, discovery, and history flows.
- +Built player management, team generation, payment, profile, and settings interfaces.
- +Added realistic UI states including empty states, loading screens, modals, toasts, disabled actions, and confirmation dialogs.
03 / PRODUCT
Selected interface
A focused view of the product states and workflows that carry the core experience.
04 / DECISIONS
How the system took shape
- 01
Hosts needed a dashboard for upcoming games, bookings, created games, groups, and payment activity.
- 02
Players needed clear game discovery and match-detail screens that worked on mobile as well as desktop.
- 03
Built the application frontend with React and TypeScript for component-driven screens and safer UI logic.
- 04
Used Firebase Authentication with OAuth and Firestore for account-backed flows and app data.
05 / OUTCOME
Outcome and reflection
Findaside demonstrates contract frontend delivery: taking product requirements and turning them into routed, authenticated, responsive React screens for a real match-planning workflow.
The project pushed me to focus less on visual exploration and more on implementation quality: page structure, state handling, authenticated flows, responsive layouts, and making complex screens usable.