Neon Beats
High-Fidelity Musical Instrument Storefront & Cart Engine
A modern dark-neon musical instruments web application featuring glassmorphism Bento Grid architecture, dynamic category filtering, interactive sliding drawer cart, and real-time state persistence built under the Ugam Campus Alchemist Protocol.
Engineered for Tactile Interaction.
Designed with modern e-commerce UX best practices to simulate a production-grade instrument retail storefront.
Real-Time Category Filtering
Instant client-side sorting across Guitars, Keyboards, Drums, and Accessories with zero layout thrashing and smooth opacity fades.
Sliding Cart & Live Calculation
Interactive drawer cart with increment/decrement item controls, persistent subtotal and tax computations, and sticky checkout action bar.
Glassmorphic Bento Grid
Signature backdrop-filter blur surfaces with neon-accented borders showcasing instrument collections, technical specs, and customer guarantees.
Interactive Auth & Modals
Simulated user authentication and quick-view inspection popups with backdrop light traps and keyboard accessibility.
Adaptive Mobile-First Layout
Fluid CSS Grid and flexbox layouts optimized for mobile devices, tablets, and high-DPI desktop displays without external UI frameworks.
Elastic Logo Splash Screen
Staggered letter-gathering intro animation spelling out 'NEON BEATS' with alternating neon brand hues and smooth fade out.
Delivered via the Alchemist Protocol.
Engineered by Riya Ghodele under the Ugam Campus mentorship framework. The project was executed following structured phases: requirement specification, responsive design scaffolding, reactive state implementation, and complete academic documentation.