Show HN: Babeloop, a new music sight-reading webapp Backstory: I have a kid learning to play the clarinet in a music conservatory, which involves compulsory sight reading classes. Teaching for sight reading is done on books. The idea for this app is to port the method online, so that it's easier to practice and follow one's progress. It should also be more fun, and, for those so inclined, competitive. The learning method is based on landmarks: for each clef one first learns the position of 2-3 landmarks, and then each note is in relation to a landmark. So for example, if you know where the middle G is on the treble clef, then you can learn fast that 2 positions up (next line) is B, and two positions down is E. (Anecdotally, in an earlier iteration of the app, landmark notes were displayed using specific colors; but users learned colors instead of the note position on the staff, and when they moved to a level without colors (or an actual score) they were completely lost.) The app doesn't try to teach keyboard playing, or fingering for any other instrument for that matter. It only helps associate the position of a note on the staff with a name, in a given clef. It doesn't deal with octaves: a C3 is a C4 is a C; or accidentals: a sharp G is a flat G is a G. It also doesn't wait for user input, as other apps do. Music doesn't work that way; but more importantly, the point is to learn to recognize intervals instantly, not count them. No account is necessary to use the app, only to participate in the leaderboard, and save one's score in case of device reset (or to use more than one device). When an account is created, the data is stored on the server in SQLite; I'm curious to see how far it can go. (Without an account, no data leaves the device.) It's still a little rough around the edges but should work ok in reasonably recent browsers. On the client side, it uses VexFlow to display notes, staff and clefs, but animations are done using CSS transitions (not JS), to be mobile friendly. Tone.js helps provide a more accurate timing than a simple setInterval. Icons are coded in SVG by hand; for simple shapes, this is surprisingly fun and straightforward to do. https://ift.tt/jXSIi5Q May 15, 2022 at 10:25PM
Show HN: Babeloop, a new music sight-reading webapp https://ift.tt/DGSYZ9E
Related Articles
Show HN: CodeWing – next level code navigation for {Python,Java,Go} on GitHub https://ift.tt/3ms26swShow HN: CodeWing – next level code navigation for {Python,Java,Go} on… Read More
Show HN: Docuowl – Pretty documentation generator based on Stripe's layout https://ift.tt/3fFYjGsShow HN: Docuowl – Pretty documentation generator based on Stripe's la… Read More
Show HN: I wrote a program in Zig to solve my friend's riddle https://ift.tt/3sJkdfTShow HN: I wrote a program in Zig to solve my friend's riddle https://… Read More
Show HN: A CLI Utility to interact with Spring Boot's Actuator Endpoint https://ift.tt/2PW6LqgShow HN: A CLI Utility to interact with Spring Boot's Actuator Endpoin… Read More
Show HN: Switch – Automatically disable your WiFi when not connected to a VPN https://ift.tt/2Oiq7FJShow HN: Switch – Automatically disable your WiFi when not connected t… Read More
Show HN: DragonRuby Game Toolkit – Commercial 2D Game Engine https://ift.tt/2R2PKLxShow HN: DragonRuby Game Toolkit – Commercial 2D Game Engine https://i… Read More
Show HN: I wrote an HN bot to suggest HTTPS url when people post HTTP URLs https://ift.tt/3uq7XB1Show HN: I wrote an HN bot to suggest HTTPS url when people post HTTP … Read More
Show HN: Microsoft Teams (unofficial) Go library (WIP) https://ift.tt/3t5N3asShow HN: Microsoft Teams (unofficial) Go library (WIP) https://ift.tt/… Read More
0 Comments: