• 

  Website UI'

Inner Metronome, by Simon Valentino

Inspiration

As a high schooler who loves playing jazz piano, maintaining a steady beat is crucial for the overall feel of a jazz tune. Despite practicing daily with a metronome, I found it challenging to assess my ability to play at a consistent tempo without the metronome itself. I would record myself playing, set a metronome to a specific speed while listening to the recording, and try to determine if I veered off tempo or not. The overall process was tedious and mostly ineffective. Then I thought: what if there was a way that the metronome could go silent for a couple of measure while it was on and I was still playing, and then come back again so I could see if I was staying on beat in real time? I searched all over the internet for a website or app that did this WELL, but they didn't have the feature. The one app I found that did have the feature was too complicated, had a messy interface, and locked the feature behind an annual subscription. So, I realized if I wanted the perfect metronome to fix my problem, I would have to make it myself... enter, Inner Metronome.

What it does

Inner Metronome functions like an average metronome, playing a steady beat with options to adjust tempo and beats per measure. It features a clean and user-friendly interface, avoiding hidden buttons and unnecessary complexity. The standout feature is the ability to mute every other measure or a user-defined percentage of measures. This allows users to play along with the metronome while practicing maintaining tempo during silent intervals.

How I built it

I utilized HTML, CSS, and JavaScript to create the website. Starting with designing a clean interface, I then implemented functionality with JavaScript. Addressing minor bugs came next, enhancing the overall user experience.

Challenges I ran into

A major challenge was ensuring the accuracy of the inner timer of the metronome. I compared the metronome's beats per minute with real-time measurements to assess its accuracy. While it was fast at first, persistent tweaking resulted in a consistently accurate tempo. Other challenges included styling the site for user-friendliness and implementing scroll bars for tempo and muted measure percentage.

Accomplishments that I'm proud of

I take pride in the fact that I used computer science to solve a real-world problem I personally faced. Observing the positive impact of my work while practicing with Inner Metronome reinforces my passion for computer science and reminds me of why I got into CS in the first place.

What I learned

Building my first major website with HTML, CSS, and JavaScript, I gained insights into the overall roles of these languages, their functioning, and how they differ from languages like Python and Java.

What's next for Inner Metronome

Future enhancements could include different sound effects for beats and diverse rhythms such as Latin, swing, and bossa nova. Another potential addition could be a feature allowing users to play a sound on their instrument and identify the note, facilitating instrument tuning. While this feature is already accessible online, integrating it into Inner Metronome could provide a more seamless practice experience.

Built With

• css3
• html5
• javascript