January 2026 Ticketing Platform Web Apps
This project was developed during my employment at Tink, who retains all proprietary rights and intellectual property associated with it. This case study is presented strictly for portfolio and educational demonstration purposes.
This project centered on delivering an end-to-end event ticketing ecosystem. Beyond building the frontend architecture, I was responsible for designing both the administrative dashboard and the dedicated on-site scanner web app, ensuring an intuitive, high-performance experience for event organizers, venue staff, and ticket buyers alike.
🛠 Tech Stack
A single Next.js application serves the public-facing storefront, the administrative dashboard, and the on-site scanner web app, all connected to an external RESTful microservices infrastructure.
React 19 + TypeScript – for a modern, type-safe, and highly performant frontend foundation
Next.js – providing SSR, SSG, and route segmentation across the public site, admin area, and scanner app
React View Transitions – delivering fluid, app-like transitions across scanner validation panels and dashboard views
TanStack Query – to manage, cache, and synchronize server state efficiently
Shadcn UI + Tailwind CSS – for accessible, customizable component primitives and rapid, consistent styling
TanStack Table – for high-density, searchable, and extensible ticket and attendee data tables
🎨 UI/UX Design: Scanner & Dashboard
A major highlight of this project was designing purpose-built interfaces tailored to distinct operational environments:
On-Site Scanner Web App: Crafted specifically for fast-paced venue entry points. The mobile-first design prioritizes ergonomic one-handed use, instant camera feed visibility, and high-contrast status feedback to ensure staff can scan tickets continuously without friction.
Organizer & Admin Dashboard: Focused on operational clarity, streamlining event configuration, multi-tier ticket management, attendee rosters, and live attendance metrics into a clean, distraction-free interface.
✨ Seamless Flow with React View Transitions
To elevate the user experience beyond static screen changes, I leveraged React’s View Transitions to create smooth, polished UI motion throughout critical workflows:
Scanner Validation States: Motion transitions between scanning, verification, and result panels (valid ticket, duplicate entry warning, or invalid barcode) provide clear spatial continuity and immediate visual confirmation for venue operators.
Dashboard Navigation: Switching between event overviews, ticket breakdowns, and contextual drawers maintains visual orientation without jarring layout shifts.
🧩 Architecture
Unifying the public site, admin portal, and scanner within one Next.js project enabled extensive reuse of shared UI primitives, validation schemas, and utility functions while maintaining strict separation of concerns across route groups. Paired with TanStack Query, the front-end remains responsive and resilient under high-volume workloads and intermittent venue network conditions.