The Frustration as a Starting Point
As a music educator, I faced a recurring challenge: students constantly asking for metronome app recommendations. I wanted to suggest something without reservations, but the landscape had shifted from paid apps to subscription models filled with intrusive ads and data collection. This frustration became my motivation to create an alternative—a free, privacy-respecting metronome without distractions.
I decided to build it myself, leveraging AI tools to accelerate the development process while learning along the way.
Getting Started with "Vibe Coding"
My AI programming journey began with what I call "Vibe Coding"—using AI assistants instead of struggling through tutorials or syntax errors. While YouTube is full of claims that AI surpasses human coders, reality is more nuanced. Success requires precise prompting, patience, and persistence—skills I've honed through teaching and leadership roles.
My Tools of Choice
Visual Studio Code
My primary development environment. Having completed several programming projects, I appreciated VS Code's seamless AI assistant integration, which significantly accelerated development. I could describe goals in natural language and receive working code immediately.
Claude
Essential for complex architectural decisions and best practices. Its ability to process longer contexts helped structure the project effectively. The MCP Desktop Commander enabled local development and debugging.
ChatGPT and Gemini
Quick problem-solvers for specific issues. When functions misbehaved, I could describe the error and typically receive solutions within seconds through simple copy-paste workflows.
The Development Process
LibreMetronome evolved through several distinct phases:
Phase 1: Conception and Core Functions
I defined essential metronome features:
- Precise time measurement
- Variable BPM settings (40-240 BPM)
- Different time signatures
- Visual and acoustic feedback
- Responsive design for all devices
With AI assistance, I created a functioning framework in hours—work that would have taken weeks otherwise.
Phase 2: The Web Audio API Adventure
The biggest challenge was implementing precise timing. Browser timers are notoriously unreliable for musical applications—an inaccurate metronome is worthless to musicians. Though experienced in other areas, I needed AI's help with this crucial component. Through detailed prompting, we achieved sample-accurate precision:
// Minimal latency for precise timing
function schedulePlay({ buffer, audioCtx, when, nodeRefs, debugInfo = {} }) {
const now = audioCtx.currentTime;
// Drastically reduced latency to ~1ms
if (when <= now) {
when = now + 0.001; // Only 1ms delay instead of 5-10ms
}
const source = audioCtx.createBufferSource();
source.buffer = buffer;
const gainNode = audioCtx.createGain();
gainNode.gain.setValueAtTime(volumeRef.current, when);
source.connect(gainNode).connect(audioCtx.destination);
source.start(when);
// Automatic cleanup after playback
source.onended = () => {
try {
source.disconnect();
gainNode.disconnect();
} catch (err) {
// ignore
}
};
}
Phase 3: User Interface and Accessibility
Moodboard - Design via Adobe Illustrator
As an educator and frontend-focused developer, I prioritized an intuitive, distraction-free interface with versatile, appealing design. I'm particularly proud of the different modes:
Analog/Pendulum Mode - classic and familiar
Grid Mode - modern and clear
Circle Mode - visually appealing
Multicircle Mode - for complex rhythms (e.g., 4/4 and 7/8) and polyrhythmic exercises
Phase 4: Progressive Web App
I implemented PWA functionality for offline use. Students can install the app on their smartphones and use it like a native app—no app store, no tracking, no advertising.
Insights
This project demonstrates how AI can empower educators. These tools don't just assist professionals—they enable passionate individuals to bring their ideas to life. As a music school director, I see enormous potential for AI in education, not to replace learning, but to foster creativity and remove barriers.
Open Source as a Pedagogical Principle
Publishing LibreMetronome as open source was intentional. I believe in free access to educational resources. The code is available on GitHub, and I welcome students to explore and contribute:
Technical Details for the Interested
Technical summary:
- Audio Engine: Web Audio API for precise timing
- UI: Mobile-first, responsive layout
- Performance: Optimized for low latency
- Hosting: Static website on libremetronome.com via Nginx, Gunicorn, and Certbot
Conclusion
LibreMetronome represents more than a metronome—it's proof that AI-assisted development opens new possibilities. As a cultural manager, developer, and educator, I can now create digital tools precisely tailored to student needs.
This three-month journey (though not continuous) involved countless debugging sessions and often required manual programming when AI suggestions were overly complex. Yet the experience has motivated me to tackle more projects. With AI as a co-pilot, development is not only more enjoyable but yields usable results faster—provided you have foundational knowledge.
LibreMetronome thrives on community involvement. Whether bug reports, feature suggestions, or code contributions—all support is welcome. The dream of creating useful tools for musicians through AI-assisted development continues.