Design 1
Design 1 is a web application. We decided to consider this as an option, since smart phones amongst our user population were a bit rarer than we expected. Web applications give us the advantage of having much more screen real estate, specific and familiar mouse movements, and the keyboard for shortcut sequences. Its disadvantages include it requiring a bit more technical expertise to hook up and less portability, especially for non-MIT students, who sometimes aren't carrying laptops.
Design 1 in action:
Storyboard
Sketch |
Explanation |
|---|---|
|
Being a millenial, Andrew expects the internet to solve all his problems. Andrew goes back to his dorm room and pulls out his Macbook Pro. |
|
He googles "free compose with whistling online". Andrew wants to do this quickly without having to download anything. |
|
Sweet, this looks like what he needs. He doesn't even have to register to begin. |
|
"Tutorial yeah whatever, I got this." |
|
"Record!" |
|
"Yeah yeah you can access my mic" |
|
When record is clicked, the button turns into 'stop record', and the other buttons gray out. The cursor moves steadily right and lines appear on the default track as he whistles. The default track is selected by default, and has a green glow to indicate this. |
|
When he's done, Andrew plays it back to make sure it sounds right. By default the instrument is set to grand piano, so it plays back as a piano. When he presses play, the play button turns into a 'stop play' and the edit buttons gray out, but the record button stays live. (This allows the user to play one track while recording another, but this issue doesn't come up for Andrew.) |
|
There's one place where Andrew screwed up a bit and started over. He wants to cut out the mistake, so he hits 'stop play' and drags the cursor back to the start of his mistake (he notices he can do this because he gets a drag pointer when he mouses over it). The 'edit track' button looks like what he wants, so he clicks it, and more buttons appear. He clicks cut, and it cuts the default track where the cursor is. The selection changes from the default track to just the second chunk of the track. |
|
Andrew plays it a bit more until he hits the end of what he wanted to cut out. He stops playback there, goes into editing and cuts the track again. He clicks the segment in the middle to give it the selection, then clicks 'delete segment' to make it disappear. A blank space is left in between. |
|
Andrew clicks and drags the second segment left to close the gap. The segment doesn't move any farther left when it hits the first segment--it seems segments can't overlap, which makes sense. |
|
If Andrew pulls past the segment, the rounded edges between segments disappear and a dotted line appears. Apparently you can join segments this way, in addition to whatever the menu button does. But Andrew decides to leave the segments separated for whatever reason. |
|
Andrew drags the cursor back to before the mistake and starts playing again to check that it sounds good. |
|
Here the mic picked up a wrong note. Andrew stops playback and now goes into 'Edit notes'. A new button appears. |
|
Andrew figures out how to edit the music based on his mouse cursor changing and experimentation. When he clicks a note or moves it up and down, it plays at its new pitch. The note snaps to notes on the chromatic scale, and the lines rescale if he brings the note up too high or too low to accomodate all the pitches. |
|
If Andrew screws up, he'll find an Undo in the edit menu, which says file in this picture for no reason. |
|
After editing, Andrew plays through the song one last time. Sounds good. Now save! |
|
Apparently to save his music, Andrew has to register. Okay, that seems reasonable. |
|
After saving, Andrew clicks on the new 'my account' link in the corner and sees a list of his songs, and also a list of popular songs by others. There's a dropdown next to his song which says 'private', so he assumes he can share his song later if he wishes. |
|
Class starts in 5 minutes! |
Analysis
Learnability
The symbols used are consistent with most music players and recorders. The "cutting and pasting strips" analogy is also consistent with many music and video editing softwares.
The site is designed for less experienced users, and the main commands are displayed large and clearly labeled at the top of the screen. There are many shortcuts in the program which Andrew fails to notice as a first-time user; for instance, delete can be done with the delete key, a second track can be recorded as the first one plays, segments can be dragged between tracks, and there are various other functions and keyboard shortcuts in the menus. These advanced features are intentionally not presented to the user all at once.
Efficiency
It's hard to tell before we do some user testing, but the program should be relatively efficient to use, with the most common functions clearly visible/close together/having keyboard shortcuts, and the whole recording mechanism designed to be easier than it is in existing software. It would take some exploring to get to this level though.
Safety
There's a short history of undo for editing operations, and users can save multiple copies of the same piece to "branch". Besides deleting songs, we mostly allow the user to make mistakes and go back rather than using confirmation dialogues. Composition inherently doesn't demand too much safety; in fact making mistakes is a tool of composition.