Inspiration

Music brings us together, and making music is a powerful source of creativity, fostering connection with others. DJ mixing is one of the many ways we take inspiration from others and put our own "spin" to them, and with the rising interest of people learning how to DJ, we wanted to make DJ-ing more accessible to everyone. Our goal is to offer a fun, interactive experience for aspiring DJs without them having to pay for expensive equipment.

What it does

Our website lets users mix and remix songs, offering a hands-on experience of DJ-ing. Users can scratch records, transition songs, and create loops, all while offering a fun and exciting experience while they're using the website.

How we built it

We used React to build interactive components, with Howler.js for audio playback control. The spinning record animations and glowing effects are powered by CSS, and JavaScript handles drag-and-drop functionality for smooth track manipulation.

Challenges we ran into

Synchronizing record rotation with audio playback was challenging, as dragging caused glitches. We also struggled with git issues and had to find ways to better synchronize our code. Lastly, there were some difficulties tracking the BPM of the tracks with other libraries, as well as adding bass and filter equalizers.

Accomplishments that we're proud of

We are incredibly proud of the fact that we made our UI look incredibly smooth, such as the records spinning or the random glowing after affects that occur when a track is switched. We are also very impressed by how we figured out how to loop the song and convey how to do so to the user.

What we learned

We deepened our understanding of React, especially in regards to audio libraries, such as Howler.js and Tone.js. We also learned how to integrate complex UI interactions with smooth, real-time performance, while solving challenges related to synchronization.

What's next for DJ Board

If given more time, we would love to use machine learning to implement a DJ assistant. One example would be reccommending the user which track to use to transition to based on similar energy, pitch, and BPM.

Built With

Share this project:

Updates