Sebastian Krüger
f3f5b65e1e
Major UX refactor to match professional DAW workflows (Ableton/Bitwig): **Layout Changes:** - Removed sidebar completely - Track actions moved to header toolbar (Add/Import/Clear All) - Each track now shows its own devices/effects in the track strip - Master section moved to bottom footer area - Full-width waveform display **Track Strip (left panel):** - Track name (editable inline) - Color indicator - Collapse/Solo/Mute/Delete buttons - Volume slider with percentage - Pan slider with L/C/R indicator - Collapsible "Devices" section showing track effects - Shows effect count in header - Each effect card shows: name, enable/disable toggle, remove button - Effects are colored based on enabled/disabled state - Click to expand/collapse devices section **Master Section (bottom):** - Transport controls (Play/Pause/Stop) with timeline - Master volume control - Master effects placeholder (to be implemented) **Benefits:** - True DAW experience like Ableton Live - Each track is self-contained with its own effect chain - No context switching between tabs - Effects are always visible for each track - More screen space for waveforms - Professional mixer-style layout Note: Effects are visible but not yet applied to audio - that's next! 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
Audio UI
A sophisticated browser-only audio editor built with Next.js 16, React 19, and Tailwind CSS 4.
Features (Planned)
- 100% Client-Side: All audio processing happens in your browser
- Multi-Track Editing: Professional multi-track audio editing
- Advanced Effects: EQ, compression, reverb, delay, and more
- Automation: Automate volume, pan, and effect parameters
- Recording: Record audio directly from your microphone
- Analysis Tools: Frequency analyzer, spectrogram, and loudness metering
- Export Formats: WAV, MP3, OGG, FLAC
- Project Management: Save and load complete projects
- Privacy-First: No uploads, all data stays local in your browser
Tech Stack
- Next.js 16 with React 19
- TypeScript 5
- Tailwind CSS 4 with OKLCH colors
- Web Audio API for audio processing
- Canvas API for waveform visualization
- IndexedDB for project storage
Getting Started
This project is currently in the planning phase. See PLAN.md for the complete implementation plan.
Development (Coming Soon)
# Install dependencies
pnpm install
# Run development server
pnpm dev
# Build for production
pnpm build
Inspiration
Inspired by AudioMass and professional DAWs like Ableton Live, Logic Pro, and FL Studio.
License
TBD
Contributing
This is a personal project, but suggestions and ideas are welcome!