This web site enables you to create your own versions of each of the four Piano Etudes by arranging short musical fragments on a timeline. Here’s how to get started:

  1. Open an etude. You can either create a new version of an etude from scratch by selecting the etude from the home page, or you can create a derivative version of an etude posted in the user gallery.
  2. Click on musical fragments in the graph to add them to the timeline. Click on fragments that appear in the graph (the big area with lots of arrows) and hit the “add” button. They will begin to appear on a timeline at the bottom of the screen. By arranging the musical fragments on the timeline, you create your own unique version of the etude. The arrows on the graph limit the ways in which you can jump from fragment to fragment to create your version.
  3. Listen to your version and edit it. Use the play/pause and stop buttons to listen to the version you have created. Click on the musical fragments in the timeline to edit them. Not all fragments can be removed from your version, though the first and last fragments can always be edited. (Removing others would sometimes break the rules of the etude.) Similarly, it is not possible to modify the duration of all fragments.
  4. Save and share your version. Use the sharing menu on the left side of the screen to save your version to our server, to share it with friends via e-mail or on social networks, to post it to our user gallery, or to download it as an MP3 audio file or as a printable musical score.

For a quick visual introduction to the project, watch the 3-minute screencast video.

For more detailed documentation of the interface, keep on reading.

Info Box (top left corner of window)

This box tells you which of the four etudes is open, and who wrote it. By clicking on the second name (usually “Anonymous”), you can enter your own name to be displayed when your version is shared.

Menu (left column)

The menu is divided into four sections (info, sharing, settings, and etudes). Click on the title word to jump to that menu section.

Graph (largest section of window, on right side)

The graph displays the “open” score for each etude: all of the musical fragments from which you can choose, along with arrows defining the paths which link them together. Clicking on a fragment brings up a visual and aural preview of it. From there, you can add it to the end of the timeline. For some fragments, you can also control its duration and number of repeats.

Remember that once you add a fragment to the timeline, your next choice is limited to the fragments connected to it by arrows. The colors of fragment borders change to highlight your available choices.

Etudes II and III have two graphs which correspond to two simultaneous layers of the music. Click on the tabs at the top of graph to switch between them.

Playback Controls (underneath the menu and the graph)

The play/pause and stop buttons control playback of your version of the etude, as shown by the timeline. Play begins playback (or resumes it if you have paused the music); stop both stops playback and rewinds back to the beginning of the timeline.

The remove all button will delete all fragments from your version of the etude so that you can begin again from scratch.

The zoom slider scales the horizontal display width of each fragment in your version. Move the slider to the left in order to view more fragments on your screen before needing to scroll forward.

The volume slider and mute button affect all sound on the web site, not just the timeline.

Timeline (bottom of the window)

Once you add a fragment to your version, the timeline will appear. The timeline is a visual representation of your version of the etude.

As you play back your version, the progress bar will indicate the playback position. To rewind or fast-forward, simply click or drag inside the progress bar.

When you click on a fragment in the timeline, a dialog box will open with a visual and aural preview of it. For some fragments, you can change their duration or number of repeats. For some fragments (and always for the first and last fragments), you can also remove the fragment from your version. (You cannot always remove fragments because doing so would sometimes break the rules of the etude.)

How did we make it?

Piano Etudes was written with the Google Web Toolkit, a really cool development environment that lets you write and debug code in Java and then cross-compile it to Web 2.0, AJAX-y javascript. For audio, we used SoundManager2, a javascript sound API that uses Flash. The blog-like pages of our web site (like this one) were created with Wordpress. Everything was developed by Jason Freeman and Akito Van Troyer.

Common Questions

Q: Why are there sometimes audio “hiccups” when playing back fragments?

A: These occasional hiccups result from the imprecise timing features in Javascript in most modern web browsers. In general, we have found that Mac browsers have more accurate timing than Windows browsers, and that on Windows, Firefox and Chrome are better than IE. Note that when you download an MP3 of your version of an etude, there will be no audio hiccups.

Q: Everything seems to load fine but there is no sound. What’s going on?

A: Occasionally, the audio component of Piano Etudes does not initialize properly, so try hitting your browser’s refresh button to fix the problem. If that doesn’t work, check audio output from other applications on your computer to make sure there isn’t a system-wide problem with your audio. Finally, try upgrading to the latest version of the Flash plugin. If all of that fails, please contact us so we can help!

Need more help?

Please post your question to the comments below or contact us.

2 Responses to “Help”

  1. Bill Capps - May 25th, 2010

    How do I repeat a section as I am composing???? I notice others have repeated. In those cases there is an arrow shown during the time the section is being repeated.

  2. admin - May 25th, 2010

    Some fragments in etudes 2, 3, and 4 can be repeated or their duration can be changed. To do so, click on a fragment, either in the timeline or in the graph. In the dialog box that appears, click the up/down arrow buttons to change number of repeats or duration.

Leave a Reply