Ritmica Music Practice Platform
A comprehensive platform for musicians to learn and perform chord charts with real-time transposition, auto-scroll playback, and interactive piano visualization.
Architecture
Built with modern Rails conventions and a Hotwire-first approach for fast, interactive user experiences.
Rails 8
Backend
Hotwire
Turbo + Streams
Stimulus
28+ Controllers
Technical Highlights
Key engineering challenges and solutions that power the platform.
Chord Parsing Engine
Comprehensive music theory implementation supporting 50+ chord qualities, intelligent transposition with proper enharmonic spelling, and Unicode symbols (△, ø, °).
- Multi-stage parsing: Tokenizer → Parser → Analyzer
- Handles slash chords, extensions, alterations
- Smart note spelling for any key signature
Real-time Interactive Player
Sophisticated Stimulus controller managing auto-scroll, countdown timers, and live transposition with debounced preference saves.
- Smooth 1px scroll at 5 configurable speed levels
- Three-state countdown timer with double-tap reset
- Live transposition ±11 semitones
Piano Keyboard Visualization
Dynamic SVG generation rendering a 2-octave piano keyboard with intelligent note highlighting and smart bubble positioning.
- Real-time SVG keyboard generation
- Enharmonic note mapping (E#=F, Cb=B)
- Responsive bubble positioning on scroll
Database Optimization
PostgreSQL extensions enabling accent-insensitive search with GIN indexes and JSONB caching for parsed chord content.
- unaccent + pg_trgm for fuzzy search
- GIN indexes on title and artist fields
- Cached parsed content in JSONB columns
Ready to Try It?
Experience Ritmica live and see these technical solutions in action.
Visit ritmi.ca