Terry – Interactive Music Playground (Web-App)

Project Overview

Terry is a browser-based „music creation playground“ developed as a collaborative Bachelor project at the Berlin University of Applied Sciences (BHT). The application invites users to experiment with musical structures through an intuitive canvas interface.

Instead of traditional notation, users interact with dynamic 3D spheres to modulate sound parameters (timbre, duration, reverb) in real-time. The core feature is a custom-built Looper engine that records user interactions as timestamped events, allowing for complex, layered polyrhythmic structures within a harmonically constrained C-Major context.

Technical Features

  • Audio Engine: Implementation of Tone.js for web-based synthesis and signal processing.
  • 3D Interface: Utilization of React-three-fiber to create responsive, manipulatable visual control elements.
  • Custom Event Looper: Development of a logic system that captures click-events and state changes relative to a start time, enabling non-destructive overdubbing.
  • Full-Stack Architecture: A Python (Flask) backend connected to a MongoDB database allows users to save, load, and share their compositions via a REST API.

Tech Stack

  • Frontend: React.js, React-three-fiber, Tone.js, Docker
  • Backend: Python 3.7 (Flask), MongoDB, Marshmallow (Serialization)