Existing tools for creating customizable audio-driven animations often suffer from complexity, proprietary licensing, or the need for extensive coding skills.
This thesis introduces VizEngine, an open-source, web-based editor designed to offer a more accessible alternative for this domain, with the aim of addressing this gap.
VizEngine employs a hybrid architecture that integrates a layer-based compositing system with a declarative, node-based animation engine, enabling users to visually construct reactive behaviors by directly connecting audio analysis outputs to visual parameters.
The prototype system implements this architecture using modern web technologies, primarily React for the user interface, Three.js for 2D/3D rendering via WebGL, and the Web Audio API for audio processing.
The evaluation assesses the system's expressive capabilities through demonstrative compositions and includes a detailed, cross-platform performance analysis using a custom in-engine profiler.
The results validate the efficiency of the core architecture, demonstrating that the node engine imposes negligible computational overhead and that the system achieves high average frame rates across different hardware configurations. The analysis also identifies component-specific rendering costs and main-thread contention—primarily during JavaScript garbage collection—as the main factors limiting stability under heavy load.
The primary contribution is a functional prototype and an architectural design that demonstrates the feasibility of using standard web technologies to build performant, extensible, and accessible tools for creating audio-reactive visuals.
|