Scratchboard

The freeform canvas, where you can adjust all your nodes
Dialog, choose your node and add it onto the canvas

Music is hard. What if creating music was easier? Scratchboard is our project attempt at creating our very own DAW (Digital Audio Workstation), but with the intention of making it easier for people who aren't familiar with music to get started.

The project revolves around a "node-based editor"; think of visual scripting like Scratch, Blender, Unity, or Unreal Engine. In Scratchboard, users work with nodes, where each node represents some sort of audio processing unit.

The most basic unit the user works with is a "Tone" module, where the user can customize: 1.) the wave shape (sine, square, sawtooth, and triangle), 2.) octave, and 3.) pitch.

The idea is that users can connect nodes together to create a pipeline, and each node will apply some effect, like reverb and chorus. Then, users would be able to export it to some sort of audio file (like an .mp3, or .wav) and use their audio as SFX or music :3

How we built it

We used Vite, Svelte/SvelteKit, Tailwind CSS, Bits UI, Tone.js + Web Audio API, Auth.js, and Svelte Flow.

Challenges we ran into

While we were able to connect nodes using Web Audio API + Tone.js, we had trouble connecting backend to frontend user interactions.

Accomplishments that we're proud of

We're proud of becoming a lot more familiar with Svelte and SvelteKit, as well as Tone.js + Web Audio API. We felt like that despite our hurdles, we were still able to accomplish a good amount of work and still learned a lot of new things!