HN Explorer

Show HN: A simple web game to help learn chords and basic progressions (chords.yottanami.com)

215 points by yottanami ↗ HN
Hi Hacker News,

I've created Chord Nebula, a simple web-based game designed to help users learn and practice piano chords, basic progressions, and harmony fundamentals. The game integrates with MIDI keyboards, allowing you to play chords in real-time and receive immediate feedback based on the key you choose.

GitHub Repository: https://github.com/yottanami/chord_nebula Live Demo: https://chords.yottanami.com

Requirements: To use Chord Nebula, you'll need a MIDI keyboard connected to your computer.

Current Status: Chord Nebula is still a simple project. I'm committed to improving it based on user feedback and would greatly appreciate any support or contributions from the community.

Looking for Feedback and Collaborators: I'm eager to hear your thoughts on Chord Nebula! Whether it's suggestions for new features, improvements, or bug reports, your feedback is invaluable. Additionally, if you're interested in collaborating to enhance the game, feel free to reach out or contribute directly via GitHub.

Thanks for taking the time to check out Chord Nebula!

57 comments

[ 2.5 ms ] story [ 132 ms ] thread
[deleted]
(comment deleted)
kaines
No drop down options exist for MIDI keyboard?
sumnole
You need to both have existing midi devices and allow browser access.
TZubiri
There's probably a solution that creates a virtual midi device given a keyboard.

But it seems a bit counterproductive to train on a weird setup. You don't want to contaminate your muscle memory.

yottanami
I've improved the in-game messages a bit to guide you. As mentioned before, you'll need a MIDI device (or a phone or tablet as a virtual MIDI device) connected to your computer, and a modern browser with MIDI access on your computer. I've tested it on Chrome for now.
nlh
Congrats on launching!

Limiting this to work only with folks who have MIDI keyboards attached to their machines probably cuts your audience down by 99.9999%. Especially here on hacker news.

I think you’re going to find it tough going to get any real feedback with that requirement. You might find better luck launching in a community of folks who are more likely to meet your hardware requirements.

rybosworld
Agree - this is something I'd be interested in trying out, but I don't have a MIDI keyboard.
joel-birchler
If you really want to try it, you can use a virtual MIDI keyboard. I made one (BloopKeys for iPhone) but there are others around.
zellyn
Just got my MPK61 hooked up this week… I’ll have to give it a try.

The set of people that have MIDI capable keyboards and want to improve musically is vanishingly small compared to those without, true, but it’s clearly a lucrative market if you do it right: there are tons of (music) keyboard classes out there online.

And a lot of the hardware and software are pricey enough that I imagine ads could be pretty lucrative too.

swyx
okay, but.. any path to connecting this to phone mics so that it can function anywhere? whats the state of the art in tone and chord recognition models?
jasinjames
No need for any ML models here, you can "just" do an FFT on a conventional signal and pick out the peaks
swyx
(i mean yes i agree but) so ... why do i feel like ive never seen anyone do this before?
criddell
I believe this is how Yousician works.
udit99
If you have a guitar handy, you can try out the live mode on https://www.fretboardfly.com . It works and people use it: Using your acoustic guitar to play the fretboard learning game via the mic.
codyd51
The waveform produced by sounding a note on most physical instruments will often not exhibit a peak, or will not exhibit the strongest peak, on the note being sounded. Rather, most instruments will instead produce harmonic overtones and our brains fill in the gap of the pitch that’s intended to be sounded.

You can still absolutely deduce the fundamental with great accuracy via an FFT, but the approach is a bit more involved. The relevant research area here is called ‘fundamental frequency estimation’.

For an example of this, you can see this app I built that lets you give keyboard and mouse inputs via playing notes on a bass guitar, which are recognized over the microphone: https://github.com/codyd51/offkeyboard

hashishen
They're a minor investment now a days with some being under $30. It's just buttons at the end of the day
MikeTheGreat
Can you provide a link(s)?

A super-brief spin through Amazon doesn't show anything like that. And <= $30 is within the 'impulse buy' range, so I'm very interested to know more, if you're up for sharing :)

input_sh
Akai LPK 25 is like $50 brand new, so is LPD 8 if you're more interested in pads (MPK Mini gives you both for $100 new). There's cheaper options out there, but that's the cheapest I know from a well-established brand.

Even if you have no interest in music, get one. MIDI is super easy to read, you can DIY something like an Elgato Stream Deck for a third of the price, physical volume knobs included. It's up there with a Raspberry Pi for the coolest cheap gadget.

mikepurvis
You can even get halfway decent touch sensitive ones on marketplace for sub-$200 if you’re not fussy about it being a full 88 or weighted keys.
cladopa
I disagree. I believe it is a good idea to focus in your "customer" and ignore the rest.

This is the best advice I was given. People are always asking for you to unfocus and disperse.

Most people that is serious about learning chords have a MIDI device. It will make your life way harder to add non MIDI devices and the people that will use it are not really that committed. MIDI devices are so cheap today that anyone that wants one could get one.

BTW I have several MIDI devices because I create my own games too.

darkerside
If you're smart, you'll put an affiliate link to a MIDI keyboard on Amazon
dietr1ch
Or find a virtual midi keyboard. Technically we already have a keyboard, right?
yottanami
Sounds like an interesting idea but honestly I have no idea how many people will use the game.
andkenneth
I agree with you functionality wise, but a video showing it in use would be a good idea so those of us away from our midi devices can at least see it in action.
efilife
"people that is serious"
DidYaWipe
I have a MIDI keyboard and an interest in learning, but it's not hooked up to my computer most of the time.

But if this is strictly for learning fingering and not for identifying chords by ear, I guess it's reasonable to require a keyboard. Otherwise you can't use it anyway.

Related question: Some people are suggesting keyboards that are only MIDI controllers; but that doesn't seem sufficient, because in that instance where will the sounds come from? Are there default sounds that will be triggered if you hook up a controller-only keyboard?

yottanami
Thanks for you feedback. It is really valuable for me. Actually, my main idea when I started this project was helping to remember the chords and common progressions on a real keyboard. Like making a muscle memory, so personally prefer to keep it for MIDI devices, but helping users there to find a virtual MIDI device could be also a good idea.
nemomarx
I do think it would be nice to let me back up to even a janky keyboard input?

not sure if anyone has good mapping for that.

Terr_
A janky keyboard input could be useful for demo purposes, to get folks excited about it before they drag their keyboard/MIDI cables out of the closet. (Debugging too, perhaps.)
joel-birchler
This was kinda cool once I got it working! It reminds me of the terminal learn to type games.

I made an app to help learn chords and keys too: https://apps.apple.com/us/app/bloopkeys/id6689494178

Mine doesn't require MIDI (although it supports MIDI out as an option), but I can see why you went with that for yours.

Some notes/thoughts: 1. It didn't work on my iPhone (either with Firefox or Safari). 2. A helpful sentence or two would be useful. For example, it wasn't obvious that what you were looking for was midi in and not midi out. 3. Ignore the folks on here talking about monetization (it won't compete with something like Melodics). You made a fun little thing and that's great.

yottanami
Thank you very much for your suggestions. I made a small update and added a guidance to help users for now and hopefully will share the new version.
paulluuk
Nice! This reminds me of https://news.ycombinator.com/item?id=32023881
yottanami
Thanks for the link, I hadn't seen it before. I guess it focuses more on teaching scales and chords, and the main difference this game has is teaching how to put chords after each other and also common progressions.
stevoski
I’d love to try this.

But… I’ve connected my Yamaha P-515 electric piano to my iPad, and it doesn’t show in the app’s “MIDI keyboard” dropdown.

Lots of Googling comes up with nothing helpful - or understandable, at least, to me, a novice when it comes to MIDI.

I’m writing this feedback, not because I want tech support, but because maybe it is helpful that a keen would-be user simply can’t get started.

stevoski
Replying to myself:

I got it working by plugging my Yamaha P-515 MacBook Pro into my computer. The ergonomics of playing the piano while viewing on a laptop were awkward.

As to the game, well, it doesn’t do much yet. Just prompting me to play some chords. But it’s a start.

Congrats on launching, and good luck with the next steps.

yottanami
Thank you for your feedback. It will be very valuable to me. Can I ask what browser you are using on your iPad? I guess Chrome will solve your problem on your iPad. I will try to look into it.

As you mentioned, this is a first step and the main goal is to help build muscle memory for common progressions. And also how chords solve into each other, not just learning the chords themselves.

With the great feedback I got here, I am planning to improve it so that more people can enjoy it.

Feel free to join the mailing list to get the updates.

teekoiv
Great job on launching! It sure does feel good to ship something and get a positive reaction. I don't want to steal your thunder but I did something similar a year ago and posted it here with a fresh HN account without much fanfare.

https://midi-note-trainer.teemukoivisto.xyz/

I maybe put even too much effort in it, all those different keyboard layouts and all. But I am happy with the end result and noticed it did actually work. For me, the most important thing was (and still is) just learning music notation. Maybe one day I'll make a v2.

asimovfan
i was not able to change the midi device to the appropriate one, so i couldn't use it, it looks really good though.
robertlutece
+1, even when I unplug everything beside my keyboard and remove any virtual devices, it stumbles onto "unknown input port" before my keyboard. I'd like to try it
teekoiv
Damn. I did use webmidi to wrap the access but apparently there's something missing. Works with my MPK3. Thanks for the feedback.
boredemployee
god, the serendipity in HN sometimes is out of this world. im desperate to pratice chord progression in a more hands on way, hope this help me! ty
yottanami
I hope Chord Nebula helps you practice chord progressions. I'd love to hear your feedback, and feel free to join our mailing list for updates.
block_dagger
Neat project. I’ve been using SimplyPiano on iPad for about a year and it’s great for learning sight reading, scales, and chords. I recommend it for anyone seeking to improve their piano skills as well as devs building similar apps.
yottanami
Thank you very much. My goal with this game is to not only teach individual chords but also to delve into basic practical harmony, chord resolutions, and common progressions. This comprehensive approach is designed to support those interested in performing famous pieces, providing accompaniment, and even creating their own compositions.
hackernewds
would love something like this for guitar! :(
criddell
The old Rocksmith games included a bunch of guitar games. I don’t know if they were fun, but they definitely helped me learn to move around the fretboard without looking.
yottanami
Thank You All for the Amazing Feedback!

I want to extend my heartfelt thanks to everyone for the incredible feedback. I honestly didn't anticipate such a positive response, and it has motivated me to dedicate more time and effort to developing Chord Nebula.

I am committed to carefully reading all your messages and responding to each one. To keep everyone updated on the latest developments and changes, I've created a mailing list on the project's page. If you're interested, please feel free to join!

Based on your valuable suggestions, I've implemented several small changes to enhance the user experience. Your input is instrumental in making this project better.

You can report any issues on GitHub, contribute to the project, or simply give the repository a star to provide me with extra motivation to keep pushing forward.

Thank you once again for your support and enthusiasm!

brianvoll
nice game! I think it would be better from an education standpoint if the roman numerals were at the bottom of the circle and you didn't include the spelling of the chords. I like that you added 3 lives to make it more challenging and fun. Here is my game that I am starting to work on. It is meant to teach the concept of harmonic movement - movement by second third or 4th. https://editor.p5js.org/briancameronvoll/full/sCR6630hj It is in very early stages. I have only started learning to code a couple months ago! let me know what you think, I am still trying to think of simple ways to make it more fun.
yottanami
Thanks for the suggestions. I will try to apply what you mentioned the roman numerals and the chord names in next version