Chord On Piano Chart

This is a visual and aural exploration of piano chords on your computer screen. Accessing this widget is via two main methods: either by the keyboard controls that are available inside the widget, or simply by clicking around interface elements. If you want to know what keys make up a certain chord, then this widget will show you while also playing those notes for you to hear how they sound together. Everything is laid out in an easy to access way so that you can concentrate on learning without fussing around trying to navigate complicated menu.

First, let’s look at the grid of buttons towards the top. These are each a different chord (e.g. These are G7, A minor, and C major. Tap on one of them and matching keys on the piano keyboard beneath will light up. What’s more, you’ll hear the chord played too as soon as you’ve selected it. That way you can link actual sound of the chord to its name. And the button you’ve chosen remains lit, so you’re never in doubt about which progression is playing.

How to Use the Piano Chord Widget

The part just below the selection grid are the interactive piano keyboard. This shows a set of white and black keys that you can click to hear individually. If there is a chord selected, then the keys for that chord will be lit up in blue. There will also be one key from these that has a white ring round it to signify root note of the chord. This is the key from which the chord gets its name. You can see how C and Cm has some of the same keys but are not the same.

The Play Chord button plays the selected chord. Use this control if you want to hear current chord again without clicking the selection grid. This can come in handy when playing around with different chords or looping through a progression. You don’t have to select the chord over and over; you can simply press play to make the same chord sound again.

On the far right-hand side of the toolbar is the volume control. Here you can set the master volume level for the entire widget. To do this, use the slider which has a handle that you can drag left (to lower volume) or right (to increase). This is useful if your system volume are set quite high or if you’re in a quiet space where unexpected sounds may be distracting. This will apply to both chord playback and single key presses.

There is also a Help button that displays a concise summary of key theoretical concepts. These include the structure of major, minor, and dominant seventh chords. The help panel can be toggled on or off as needed especially if you need to refresh your memory while playing. When closed down, it remains unobtrusive but brings instant context when needed. This is great if you are new to playing and wish to double check the structure of any chords on-the-fly.

The interaction model is accessible by design. Interact with the widget without needing a mouse. The entire interface can be navigated via your computer keyboard. Focus moves from piano key to chord button as you tab around the interface. Activate the currently focused element by pressing Space or Enter. If you’re more comfortable typing than clicking, this means you can use the instrument hands free. It’s also fully labelled for screen readers so it works well for people who use them.

If you’re on a smaller device, there may not be much screen space. On those devices, the Fullscreen button will expand the widget to fill your whole screen. Not only does it make it easier to tap things on a touch screen but it leaves you with plenty of space for keyboard display. To exit out of fullscreen mode, simply click the same button again (or use some other standard browser commands). If you think the default is too cramped for comfortabley play, try this mode.

To try this, experiment with various kinds of chords, changing them to see the impact it has on the mood. Try swapping from a major chord to its minor cousin and listen for change in brightness. Move on to a seventh chord and you will increase the tension and complexity. Listen carefully as the additional notes fills out the harmony. There is another feature that enables you to click the individual keys on the piano staff to play through melody lines or scales in addition to the chords.

The blend of visual clues and sound feedback makes for an effective learning environment. Each area of the interface deserves exploration. Don’t feel rushed to do it all in one sitting. Try out the elements that teach you most effectively. Is it reading chords written as formulas? Adjusting volume knobs? Are you clicking keys? When you’re ready, press play, pick a chord you know, and start playing.

You should of tried this earlier.