Freelance Project
Architected a high-performance, cinematic event booking platform using the bleeding-edge Next.js 16 and React 19 stack. Engineered a scalable content management system with Sanity to handle 11+ custom schema types, ensuring seamless client updates. Implemented complex UI animations using Framer Motion and Lenis for smooth scrolling, while building a robust transactional email service with Nodemailer for automated booking confirmations.
Key metrics and achievements that define this project
Explore the live demo, check the code, or reach out to discuss it
Full Case Study
A recruiter-friendly breakdown of how I translated a cinematic event brand into a production booking site with a structured Sanity content model, smooth motion, and operational email flows.
Creating a luxury event booking platform for an international client required managing complex state, real-time availability, multi-language support, and cinematic animations while maintaining peak performance across devices.
Leveraged Next.js 16's advanced caching and React 19's concurrent features. Built a headless CMS architecture with Sanity for flexible content management. Implemented server-side rendering for SEO and client-side interactivity for smooth UX.
Mastered bleeding-edge React Server Components, optimized international performance with edge functions, and learned to balance stunning visuals with accessibility and performance constraints.
A phase-by-phase record of how the work was scoped, built, and carried into production.
Mapped the booking flow, content update requirements, and the visual expectations for a luxury event experience before implementation started.
Kept the project on a headless CMS path so non-developer updates would not require code edits for venue, event, and narrative content.
The build started with a constrained content and interaction scope instead of styling-first iteration.
Defined the project around a scalable content model so the site could support rich editorial updates without rewiring the frontend.
The current project description already notes 11+ custom schema types, which became the backbone for flexible admin-managed publishing.
Built the cinematic frontend using Next.js 16, React 19, TypeScript, and Tailwind while preserving responsive behavior across project sections.
Server rendering handled the SEO-critical shell while client interactivity was reserved for motion-heavy areas where it materially improved the experience.
Balanced Lenis and Framer Motion effects against accessibility and performance so the site stayed cinematic without collapsing on smaller devices.
Reduced-motion considerations and careful animation placement were treated as engineering constraints, not post-launch cleanup.
The presentation layer stayed premium without making motion the only way to understand the interface.
Completed the production path with automated booking confirmations and a publishable content workflow for ongoing client updates.
Transactional email support was included in the initial delivery rather than handled as a separate operational patch.
The site shipped with both presentation and booking-response mechanics in place.
Key Decisions
A compact snapshot of the technical and product decisions that had the biggest impact on delivery.
A premium event site changes often: venues, editorial copy, event details, and booking-related content all move faster than a static portfolio-style frontend usually can.
I structured the project around Sanity so content changes could be made through an editorial workflow rather than through repeated code edits.
Impact: The README-backed schema strategy made the site easier to evolve once the presentation layer was already live.
Tradeoff: The content model and frontend queries took more upfront design work than a simpler static build.
Visual Showcase
This screen captures the production-facing design language, layout rhythm, and overall polish of the experience.
Scroll to explore technologies →
The brand needed cinematic movement, but the site still had to remain readable and responsive across devices.
I kept the motion identity, but reserved it for areas where it improved perceived quality without obscuring the content model.
Impact: The final UI stayed premium without making animation the only source of differentiation.
Tradeoff: That meant turning down some visual spectacle to keep the experience stable and legible.
A visually strong event site still fails operationally if booking inquiries disappear into a passive form inbox.
I implemented the outbound booking confirmation path with Nodemailer during the main build.
Impact: The delivered product covered both the public brand layer and the immediate communication workflow.
Tradeoff: Email handling added backend responsibility to what could have been treated as a purely presentational site.
