DRAMM_Synthesizer

React, MongoDb, Spring.io, Java, Javascript, Tone.js, P5.js, HTML, CSS | A full-stack, interactive Audio Visual Synthesiser utilising dynamically loaded XY touch and mouse data - includes load and save functionality for user settings | CodeClan Capstone Project

Set-up

• Install MongoDB: https://www.mongodb.com/docs/manual/installation/
• Clone repository onto local machine
• Open database folder in IntelliJ
• Run DatabaseApplication.java to start the backend
• In terminal cd into javascript/dramm and use command npm install to install dependencies
• Also within javascipt/dramm use command npm start to run the frontend

MVP

A user can:

• Create a sound
• Alter pitch,volume,reverb & distortion settings
• Save and Load user settings from database
• View visual which responds to user actions (mouse and touch events)

Extensions

• Responsive screen size (desktop and mobile)
• Volume and pitch controlled by mouse and touch events
• Additional visual options
• Hosting (Vercel for frontend)

Example of User Loading Sound Settings From Database: