Luke Hillman Posted January 3, 2022 Share Posted January 3, 2022 (edited) A while ago I started trying to make an app that would help me learn different scales and puzzle through different chord options on my Anglo without excessive hunting-and-pecking. I eventually arrived at something that worked well enough for my purposes. It doesn't do much and could be a lot better, but I figured it might be of some use to folks here: anglopiano.com NB, I added several keyboard layouts that I don't personally own. They're based on charts I found here and there on the internet, so do please tell me if you see anything amiss. In particular, I couldn't find a 40-button G/D Wheatstone chart, so I extrapolated based on the C/G one I found. Hope this is useful, let me know what you think. Edited January 3, 2022 by Luke Hillman Editing to include screenshot. 7 Link to comment Share on other sites More sharing options...
Steve Schulteis Posted January 3, 2022 Share Posted January 3, 2022 That's pretty slick. Thanks for sharing! 1 Link to comment Share on other sites More sharing options...
Roger Hare Posted January 3, 2022 Share Posted January 3, 2022 (edited) 3 hours ago, Luke Hillman said: A while ago I started trying to make an app... That's extremely neat and well laid out! Nice! Suggestions: 1) Bb/F layout? 2) Work it in reverse - tapping a concertina button highlights the relevant piano key? I dunno if that would be helpful - seems to me it might be... 3) Add sound when you hit a note? Again, would that be useful? Edited January 3, 2022 by lachenal74693 Link to comment Share on other sites More sharing options...
gcoover Posted January 3, 2022 Share Posted January 3, 2022 For those of us who think of music utilizing a piano keyboard, this is absolutely brilliant. Well-done, Master Luke! Gary 1 Link to comment Share on other sites More sharing options...
SIMON GABRIELOW Posted January 3, 2022 Share Posted January 3, 2022 Llooks like a good idea; I tried it out and easy way for people to relate where the note is. Would it also be possible to put actual concertina note sound for each press of the 'virtual' keyboard? Link to comment Share on other sites More sharing options...
Richard Mellish Posted January 3, 2022 Share Posted January 3, 2022 Very nicely done. And I can confirm that your 40-button G/D Wheatstone chart agrees exactly with my Wheatstone G/D. 1 Link to comment Share on other sites More sharing options...
Fanie Posted January 3, 2022 Share Posted January 3, 2022 That is very neat, Luke. What would be interesting for me (as totally musical illiterate) to see, is if you press on the concertina button, which piano key will light up. Link to comment Share on other sites More sharing options...
Jake Middleton-Metcalfe Posted January 3, 2022 Share Posted January 3, 2022 This is really really cool. Actually I hope one day to learn the 40 key C/G system (all I play I do so on a G/D 34 key). I have saved the link as it looks quite handy to help one think about arrangements and chord choices. Link to comment Share on other sites More sharing options...
Luke Hillman Posted January 3, 2022 Author Share Posted January 3, 2022 Thanks for weighing in, everyone! 12 hours ago, lachenal74693 said: Suggestions: 1) Bb/F layout? 2) Work it in reverse - tapping a concertina button highlights the relevant piano key? I dunno if that would be helpful - seems to me it might be... 3) Add sound when you hit a note? Again, would that be useful? Roger, you're completely right, I'll add a Bb/F layout. Do you happen to have any Bb/F charts lying around? They are surprisingly hard to find via a casual search. Both of your other suggestions are definitely things I want to do. 7 hours ago, SIMON GABRIELOW said: Llooks like a good idea; I tried it out and easy way for people to relate where the note is. Would it also be possible to put actual concertina note sound for each press of the 'virtual' keyboard? Definitely possible. I'm still trying to figure out the best way to do it. I'm actually not a software engineer by trade, and the tool I used to make the app doesn't provide a straightforward way to integrate sounds. But I'll get there. 5 hours ago, Richard Mellish said: Very nicely done. And I can confirm that your 40-button G/D Wheatstone chart agrees exactly with my Wheatstone G/D. Excellent! Good to have the confirmation. There really doesn't seem to be a single place where one can find charts for all conceivable Anglo layouts. 4 hours ago, Fanie said: That is very neat, Luke. What would be interesting for me (as totally musical illiterate) to see, is if you press on the concertina button, which piano key will light up. I'm on it! I, too, am completely illiterate, but I do have access to a piano, and working out chords by ear is WAY more straightforward on that keyboard. At least, until you have 10+ years of muscle memory. And I hope this project will help lead me to literacy. 3 hours ago, Jake Middleton-Metcalfe said: This is really really cool. Actually I hope one day to learn the 40 key C/G system (all I play I do so on a G/D 34 key). I have saved the link as it looks quite handy to help one think about arrangements and chord choices. Thanks Jake! That's precisely how I use it. I also am hoping to get my hands on a 40-key one day... perhaps in 2022 😁 Link to comment Share on other sites More sharing options...
Don Taylor Posted January 3, 2022 Share Posted January 3, 2022 Luke: What tool are you using to write your app? A couple more suggestions for you to consider: 1. A dialog box that allows the user to enter a chord by name, or select it in some way which results in all of the notes of that chord being being highlighted on both the keyboard and the Anglo. 2. A way to select a key and then a note in that key, your program would show all the possible common chords that harmonize with that note. You would probably need to provide a way to cycle through the chords one at a time. Link to comment Share on other sites More sharing options...
David Barnert Posted January 3, 2022 Share Posted January 3, 2022 8 hours ago, SIMON GABRIELOW said: Would it also be possible to put actual concertina note sound for each press of the 'virtual' keyboard? 26 minutes ago, Luke Hillman said: Definitely possible. I'm still trying to figure out the best way to do it. I'm actually not a software engineer by trade, and the tool I used to make the app doesn't provide a straightforward way to integrate sounds. But I'll get there. See the link to Phil Taylor's concertina sound font in Don Taylor’s sig, immediately above this post. Link to comment Share on other sites More sharing options...
Don Taylor Posted January 3, 2022 Share Posted January 3, 2022 7 minutes ago, David Barnert said: See the link to Phil Taylor's concertina sound font in Don Taylor’s sig, immediately above this post. I am not sure that you can use a sound font in a webapp, you would need something like fluidsynth to host the sound font file. I would like to be proved wrong about this! Link to comment Share on other sites More sharing options...
Luke Hillman Posted January 3, 2022 Author Share Posted January 3, 2022 (edited) @Don Taylor I'm using Axure, which is a bit of a cheat. (I'm a designer, so it was easier for me to do it that way than coding it from scratch, which I should probably eventually do, and which would enable me to implement some features that are currently difficult, like adding sound). Building in a chord cheat-sheet would be pretty easy, I think. I originally didn't include that because I was seduced by the idea of calculating chords programmatically, but maybe the way to go for now is just to hard-code them. In Axure, where basically everything is done via event-driven JS (including things like positioning), performance starts to suffer pretty dramatically past a certain point. @David Barnert I like the idea of using a soundfont. When I re-write the app from scratch, I could look at ways of doing that... for now, the easiest (if not simplest) things to try are using individual mp3s for each note (barf), or figuring out some way of using OscillatorNode (functional and performant, but not exactly easy on the ears). Edit: I've just added piano sounds to the piano keys. It was tedious, and there's undoubtedly a better way of doing it, and I'm not sure how well it will work across browsers and devices. But it's something! Edited January 4, 2022 by Luke Hillman Link to comment Share on other sites More sharing options...
Steve Schulteis Posted January 4, 2022 Share Posted January 4, 2022 Hmm, the latest update seems to have rendered it inoperable, at least in Chrome on Android. The keyboard and buttons are there, but there's no note names on them and they don't respond to being pressed. Speaking as someone who is a software engineer by trade, there's no such thing as cheating. Nobody cares how you get the results as long as they're good, and your results are good. Your design chops really shine through, too. Link to comment Share on other sites More sharing options...
Luke Hillman Posted January 4, 2022 Author Share Posted January 4, 2022 Thanks @Steve Schulteis! I think a hard refresh ought to fix it (DM me if not). Seems to be working for me. There is a period when it's loading where there are some blank keys visible, but hopefully it doesn't last more than a couple seconds. 1 Link to comment Share on other sites More sharing options...
Roger Hare Posted January 4, 2022 Share Posted January 4, 2022 (edited) 12 hours ago, Luke Hillman said: Roger, you're completely right, I'll add a Bb/F layout. Do you happen to have any Bb/F charts lying around? They are surprisingly hard to find via a casual search. Both of your other suggestions are definitely things I want to do. OK, leave it with me. Somewhere, I have a layout chart for my Bb/F Lachenal. I will dig it out. Warning: It may have the push/pull semi-circles reversed when compared to your diagram (hysterical reasons - don't ask...). Edit: I struck lucky and found it straight away! The first diagram was created using Dr McCann's keyboard design program, the second I created within a document I used when I first started ~5-6 years ago... Edited January 4, 2022 by lachenal74693 1 Link to comment Share on other sites More sharing options...
Roger Hare Posted January 4, 2022 Share Posted January 4, 2022 (edited) 4 hours ago, Steve Schulteis said: Speaking as someone who is a software engineer by trade, there's no such thing as cheating. Nobody cares how you get the results as long as they're good, and your results are good. Your design chops really shine through, too. I may be OT here, but goodie! That means I can fix the off-by-one line number in my ABC error detection program by simply adding 1 to the line number - even if I can't see why the error occurs in the first place... Edited January 4, 2022 by lachenal74693 1 Link to comment Share on other sites More sharing options...
DaveRo Posted January 4, 2022 Share Posted January 4, 2022 As Luke said, you may need to clear the webapp's caches for a new versions to work. Android, both Chrome & Firefox: Settings, Privacy & Security, Delete Browsing Data Tick(check) Cached images & files (untick the rest) Press Delete iPad, Safari, in the Settings app: Safari, Clear Website History and Data Press Clear (Which seems a bit brutal. What if I don't want to clear History and Cookies? Maybe somebody knows a more precise way.) Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now