L-SHAY AI Music Visualizer was created to provide accessible and dynamic music visualization through a browser-based application, eliminating the need for expensive tools or complex software.
This Chrome web app uses built-in AI to analyze a song's mood, energy, and beats, generating real-time visuals and matching album art within the browser, leveraging Chrome's AI APIs for speed, intelligence, and privacy.
Key features include live visualizer effects (bars, wave, spectrum, 3D glow), AI-generated album covers reflecting the track's mood, smart color palettes dynamically adapting to the song's emotion, and export/share functionality for social media and streaming platforms.
It was built using HTML, CSS, and JavaScript for the frontend; p5.js and the Canvas API for real-time animations; Google Chrome's built-in AI APIs for AI power; Web Audio API and CCapture.js for media handling; and GitHub Pages/Netlify for hosting.
Challenges included integrating Chrome's experimental AI APIs, optimizing frame rates, managing local file I/O, and developing a responsive UI.
Accomplishments include a fully AI-powered visualizer within Chrome, real-time audio-visual synchronization, and an intuitive UI.
The project facilitated learning about Chrome Built-in AI API integration, real-time audio frequency processing, video export rendering, and the importance of UI/UX.
Future plans involve lyrics-based AI mood adaptation, multi-track visuals and VST plugin integration, and a Chrome Extension for real-time visualization of YouTube or Spotify songs.
Log in or sign up for Devpost to join the conversation.