The official digital ecosystem engineered for Renaissance-TechSpan 2026 — our college’s premier annual cultural and technical fest.
Renaissance-TechSpan 2026 was designed to move beyond the traditional chaos of Google Forms, spreadsheets, and fragmented communication systems commonly used in college events.
This platform was engineered as a centralized event management ecosystem that handled registrations, decentralized society operations, announcements, attendance workflows, real-time updates, and administrative coordination — all within a highly responsive, cinematic, and immersive user experience.
Built with scale, reliability, and operational efficiency in mind to serve thousands of students flawlessly.
The platform is divided into three major architectural pillars: The Participant Experience, The Society Dashboard, and The Super-Admin Command Center.
- Cinematic Landing Experience: Immersive 3D intro and WebGL-powered particle effects built with Three.js. Smooth UI transitions powered by GSAP and Framer Motion.
- Dynamic Event Forms: Custom-built registration forms linked to specific events, complete with Google Drive file upload proxying.
- Real-Time Leaderboards: Live scoring and tracking to keep the competitive spirit alive during the fest.
- Gallery & Artist Reveals: Dedicated sections for photo galleries, timeline-based artist reveals, and sponsor showcases.
- Smart Push Notifications: Real-time web-push notifications to instantly alert attendees about schedule changes and major events.
Each society/club is provided isolated credentials to manage their own workflows without interfering with others.
- Secure Login: Role-based login specifically for Society Heads.
- Real-time KPI Tracking: Instant metrics on Total Registrations, Unique Users, and Active Forms.
- Submission Management Table: A robust data grid to view form submissions, including search, multi-field sorting, and pagination.
- Media Handling: Built-in viewer for images and document links uploaded by participants.
- Enterprise Excel Export: One-click generation of beautifully formatted, natively sorted Excel (.xlsx) sheets with dynamic columns for offline registration tracking (powered by ExcelJS).
A comprehensive, all-in-one control panel for the core organizing committee to orchestrate the entire fest.
- Fest Analytics: Live dashboards displaying overall fest health, total footfall, and event popularity.
- Dynamic Form Builder: A drag-and-drop style interface for creating custom registration forms and assigning them to specific societies.
- Role & Profile Management:
- Manage Core Team, Faculty Coordinators, and HOD (Head of Department) profiles.
- Generate and revoke Society Credentials dynamically.
- Global Event & Registration Moderation: View, edit, or delete any event or registration across any society.
- Asset Managers: Dedicated portals for updating the Gallery, Sponsors list, and dispatching Global Notifications.
- System Activity Log: An audit trail tracking all administrative actions for accountability.
| Category | Technologies |
|---|---|
| Frontend Core | Next.js 16 (App Router), React 19, TypeScript |
| Styling & UI | Tailwind CSS v4, Lucide React, Radix UI |
| Animations | GSAP, Framer Motion, tw-animate-css |
| 3D / WebGL | Three.js, React Three Fiber, Postprocessing |
| Backend & Auth | Supabase, PostgreSQL |
| Data Processing | ExcelJS, FileSaver, Google APIs |
| Automation | Custom DOCX generation scripts |
| Deployment | Vercel |
renaissance-2026/
├── app/ # Next.js App Router root
│ ├── admin/ # Super Admin panel routes & auth
│ ├── society-dashboard/# Decentralized society login & views
│ ├── form/ # Dynamic participant registration forms
│ ├── leaderboard/ # Real-time scoring systems
│ ├── gallery/ # Media showcase pages
│ └── api/ # Secure backend endpoints & proxy routes
├── components/ # Reusable, modular UI elements
├── lib/ # Utility functions, Supabase clients & services
├── public/ # Static assets (images, 3D models)
├── supabase/ # Database schemas & constraint definitions
└── scripts/ # Automation scripts (e.g., SRS generation)
Throughout the development lifecycle, ensuring a flawless experience for the end-user was the top priority. Key challenges tackled included:
- Decentralized Workflows: Architecting a system where multiple societies could operate simultaneously without data collision.
- Performance Optimization: Tuning WebGL animations and 3D assets to ensure 60fps performance even on lower-end mobile devices.
- Complex Data Exports: Writing custom Excel generation logic that dynamically mapped varied form fields into structured columns for society heads.
- Real-Time Coordination: Guaranteeing zero-latency updates for live fest operations.
- AI-Assisted Development: Leveraged AI as a pair-programming assistant to accelerate architecture planning, debug complex WebGL workflows, iterate on UI components, and automate database schema refinement.
To run this project locally, follow these steps:
git clone https://github.com/itsJ0ker/rena26.git
cd rena26npm installCreate a .env.local file in the root directory:
NEXT_PUBLIC_SUPABASE_URL=YOUR_SUPABASE_URL
NEXT_PUBLIC_SUPABASE_ANON_KEY=YOUR_SUPABASE_ANON_KEYnpm run devThe application will be running on http://localhost:3000.
While the platform successfully powered the 2026 fest, future iterations will include:
- QR-based attendance system integration for instant check-ins.
- Advanced analytics dashboard for deeper participant insights.
- Enhanced push-notification engine.
- Multi-event template support for scaling to other collegiate events.
Huge thanks to the organizing team, faculty coordinators, society members, and everyone who provided invaluable feedback during the rapid development phase.
Harsh
Frontend & Full Stack Developer
Focused on building immersive, scalable, and real-world software systems.