(For the judges: previous team name was SightReadTutor)


Both of us played piano, so when we saw the Music Track, we knew we wanted to pursue something related to it. It was sad to hear that the Music Track was taken down, but we decided to still do this idea anyway. The inspiration came from when I used to practice sight reading as a kid, but I always read the notes wrong and didn't even realize it.

What it does

Autonorous is your personal sight reading trainer. It will listen to the notes you play on your piano, and it will let you know if played it correctly! We wanted to tailor it toward kids, so we made it a game. When you press start, notes will start to flow from right to left, and your job is to play the right note on the piano before the flowing note hits the clef. Because the pitch detection is done on the client, it gets confused when there's a lot of noise in the room. We encourage you to go into the quiet piano room next to the vending machines in HFSC and try it out yourself!

How we built it

We built it with JavaScript, HTML, CSS. We used and modified JavaScript libraries called Vexflow and pitchdetect.js to render music and detect the notes, respectively.

Challenges we ran into

Configuring the JavaScript libraries were particularly hard for me (Shoya), as this was my first time building a website with JavaScript!

Accomplishments that we're proud of

We are very happy to have built something that everyone can try out very easily in the piano room in HFSC.

What we learned

We learned that there are vast amounts of libraries out there roughly trying to do the same thing (such as rendering music), but some are definitely much easier and well-documented than others. Choosing your tools carefully is key.

What's next for Autonorous (SightReaderTutor #12)

Next up on the list would definitely to include support for chords. Eventually, it would be cool to automatically generate music using deep learning.

Built With

Share this project: