Audio-reactive generative visual environments — create, share, and broadcast real-time visualizer scenes powered by the MAGE rendering engine.
Live demo: a4mage.github.io/MAGEPlatform
Original org repo: A4MAGE/A4MAGE.github.io
This repository reflects my personal work on the MAGE Platform, a CS410 Software Engineering capstone project at UMass Boston (Spring 2026). I co-led a 5-person team and merged 20+ pull requests.
- Architected the browser-based audio engine —
setAudioSource(),play(),pause(),getPlaybackState(),setPlaybackState() - Built the full audio player UI with waveform controls, seek, and playback sync
- Integrated the MAGE rendering engine with the audio control interface
- Built host + viewer end-to-end: host selects preset + uploads audio → publishes live session
- Implemented viewer auth gate and late-join sync
- Engineered drift correction and transit delay compensation for real-time audio sync across clients
- Rebuilt sidebar navigation (5-tab layout) and shipped it as a unified PR
- Unified design system across all pages (consistent spacing, typography, color tokens)
- Profile page: avatar upload + editable username
- Explore page: fixed production query bug, preset browser with thumbnail previews
- Fixed production build crash and shader-park player crash
- Created 10 GitHub issues, co-ordinated work across 5 contributors
- All features shipped via pull requests with review — 20 PRs merged over 7-week sprint
| Contributor | Primary Area |
|---|---|
| Yazeed Ghoban (@pnsw123) | Audio engine, broadcast rooms, platform integration, co-lead |
| Jason Courtois (@JasonCourtois) | Auth, MAGE engine integration, React platform |
| Roni Domi | Homepage, landing page, visual identity |
| Amanda Ulis (@amandulis8) | Search, database schema |
| Gladys Cubileta | Backend server endpoint, Supabase, audio controller |
| Layer | Technology |
|---|---|
| Frontend | React, TypeScript, Supabase Auth |
| Audio | HTML5 Web Audio API, browser File API |
| Rendering | MAGE Engine (WebGL, shader-park) |
| Database | Supabase (PostgreSQL) |
| Hosting | GitHub Pages |
| Real-time | WebSockets (broadcast rooms) |
Built as the capstone project for CS410 Software Engineering at University of Massachusetts Boston.
Sprint: March 11 – April 29, 2026.
Specification document by Brandon Siscoe (MAGE Engine author).