AURAL — Virtual Multitrack Mixing Console

A mixing console in your browser. A full multitrack audio workstation: build sessions, load audio, arrange and edit clips on a timeline, mix with real DSP, automate the mix, and render a high-quality offline mixdown.

Overview

AURAL is a browser-based multitrack audio workstation built with a real-time Web Audio API engine and a React + TypeScript frontend. Create a session with any number of channels, drop in audio, edit and arrange clips non-destructively, shape each channel with EQ, dynamics, sends and buses, draw automation lanes, and export a rendered WAV or MP3 mixdown.

Mixing happens entirely in the browser — the backend is a lightweight FastAPI service reserved for encoding (FFmpeg) and future services, so there are no round-trips during mixing.

Features

• Session and project lifecycle with a forward/backward-safe .aural project format
• Open / Save / Save As / New, autosave and crash recovery
• Transaction-based undo/redo — every edit is exactly one undo step
• Timeline with per-channel lanes, adaptive zoom, snapping, and sample-accurate transport clock
• Non-destructive clip editing: trim, split, duplicate, fades, per-clip gain
• Per-channel strip: trim, polarity, high-pass, four-band EQ, pan, long-throw fader, mute, solo, and PFL
• Per-channel gate and compressor with gain-reduction metering
• Bus sends and FX: AUX buses, convolution reverb, and feedback delay
• Master compressor, true-peak limiter, and LUFS monitoring
• Real-time metering (peak/RMS/clip, peak-hold, stereo master, LUFS) from a single requestAnimationFrame loop
• Automation lanes for fader, pan, mute, sends, and bus returns in OFF / READ / WRITE / TOUCH modes
• Offline export to WAV (16/24/32-bit PCM) or MP3 with full DSP and automation applied
• Backend structured error envelope on every failure
• Automated test suite (Vitest + pytest)

Project Structure

AURAL/
├── backend/                # FastAPI service (Python)
│   ├── app/
│   │   ├── api/            # /api/health, /api/encode
│   │   └── errors.py       # Structured error envelope
│   ├── tests/
│   ├── main.py
│   └── requirements.txt
├── frontend/               # React + TypeScript (Vite)
│   ├── public/             # favicon, static assets
│   ├── src/
│   │   ├── audio/          # Web Audio engine, transport, automation
│   │   ├── components/     # Mixer, timeline, transport, panels
│   │   ├── models/         # Serializable project model
│   │   ├── services/       # Offline export, backend API client
│   │   ├── state/          # Zustand session store + undo transactions
│   │   ├── styles/
│   │   └── utils/
│   ├── index.html
│   ├── package.json
│   └── vite.config.ts
├── docs/                   # Phase completion reports, signal-flow spec
├── dev.sh                  # One-command local start
└── README.md

Installation

Prerequisites

• Node.js ≥ 20 and npm
• Python ≥ 3.11
• FFmpeg on the backend host (for MP3/M4A export)

Backend

cd backend
python3 -m venv .venv
source .venv/bin/activate
pip install -r requirements-dev.txt

Frontend

cd frontend
npm install

Run

Start both servers from the project root:

./dev.sh

This starts FastAPI on http://localhost:8000 and Vite on http://localhost:5173. Press Ctrl+C to stop both.

Alternatively, run each server separately:

# Backend
cd backend && .venv/bin/python -m uvicorn main:app --reload

# Frontend
cd frontend && npm run dev

Open http://localhost:5173, create a session, import audio, and start mixing. The Vite dev server proxies /api to the backend on :8000, so no CORS configuration is needed during development.

Testing

cd frontend && npm test        # Vitest — 337 tests (audio math, DSP config,
                               # automation scheduling, monitor logic, timing,
                               # timeline math, session store + undo, …)

cd backend && .venv/bin/python -m pytest   # 10 tests — health, encode,
                               # structured error envelope

Production build (includes tsc --noEmit):

cd frontend && npm run build

Supported Audio Formats

• Import — browser's native decoder: WAV, MP3, FLAC, AIFF, M4A/AAC, OGG
• Export — WAV (16/24/32-bit PCM) directly in the browser, and MP3 (128/192/256/320 kbps) via the backend FFmpeg service

Tech Stack

• React + TypeScript — frontend UI (Vite)
• Zustand — serializable session store and undo transactions
• Web Audio API — real-time DSP, transport clock, and automation scheduling
• OfflineAudioContext — high-quality offline mixdown rendering
• FastAPI — backend services (health, MP3/M4A encoding)
• FFmpeg — WAV → MP3/M4A transcoding
• Vitest / pytest — automated test suites

Author

Khatwang Madhav Yippili

B.S. (Hons.) in Mathematical Sciences and Computing

Sri Sathya Sai Institute of Higher Learning