�1

Transitions,*Limits,*and*Amplifying*Usage

PART*A*8*Responsiveness*vs.*Resolution*

Musicking Timeline: One of the features of the web app will be an interactive, animated timeline that serves as a record of the user’s musical journey - practices logged, video and audio recordings, and events the user has participated in may all appear here, and recordings can be launched from within the timeline.

There are a number of ways web developers create animations, including new animation options in CSS3, and JavaScript-based tools like GSAP. CSS3 isn’t always compatible with older browsers, however, and even the fastest animation tends to be pretty choppy in a mobile browser.

For example, the timeline creation tool Tiki-Toki produces timelines with a similar action to what we’re planning to build. This sample timeline of theirs works beautifully in the latest version of Safari’s desktop browser, somewhat slowly in Safari’s iOS browser on an iPad, and barely at all in Chrome’s latest Android browser on a 3-year-old phone.

One option to make the timeline more usable on older and mobile browsers might be to give users the option to view it in some other way besides the default - perhaps users could choose. It could even default to an alternate version in mobile browsers - perhaps a series of lists sorted by type of entry, or a single (but potentially very long) list.

Recording Playback: An important part of the site is being able to play your and other users’ recordings. These can be audio alone or audio/video. Since the focus here is on sound, however, video (the most resource-intensive part of the playback) is less important. It would be nice to offer the option to play only the audio of a video recording, as this would allow for a much better user experience over slower Internet connections and limited data plans.

More on the relative merits of web development tools for animation: Treehouse, “Mythbusting: CSS Animation vs. JavaScript.” David Walsh, “CSS vs. JS Animation: Which is Faster?”

�2

PART*B*8*Optimization*vs.*Ubiquity*

In deciding which screen sizes to optimize Musicking’s content for, we thought about how people tend to use different screen sizes. Referring to Microsoft’s study on cross-screen engagement, we might think about how people tend to move across multiple screens, in order to ensure we’ve optimized Musicking’s content for the best overall experience:

Content Grazing: This describes a distracted pattern of engagement where people will pause in the middle of one activity to quickly consume content on another device (such as checking Twitter on your phone during a TV commercial). We can see this as being a likely pattern for monitoring items of interest where comments and updates are constantly flowing in - for example, if a musicker is participating in a virtual event (see Parts C and F for details), or if they’re following a forum thread. Dashboard updates, forums, and Virtual Event pages should be easy to read and reply to on a small screen.

Quantum: This is how Microsoft describes a pattern of moving across multiple screens in order to complete a single task (such as taking a picture of an interesting concert poster on your phone, then investigating it later on your laptop).

This pattern will likely be particularly important for musickers who are using the web app to record their performance and post it to either their timeline or a virtual event. It’s vital that users be able to play and record themselves in whatever setting they feel reasonably comfortable. Often, this will not be in front of their desktop computer. For some instruments, it may in fact be impossible to record this way.

For this task, we want users to be able to move easily from the desktop version of the web app - where they have the greatest amount of control, and can feel most productive - to their mobile device, where they have the greatest amount of flexibility in terms of location. The ability to capture audio and video must be available on all screen sizes and devices (which means looking at HTML5 solutions rather than Flash). In fact, it might be useful to develop a separate mobile app whose only function is to record, and push recordings to the user’s timeline or virtual events.

�3

We also want to make sure that users can upload files as well as record from the app itself, as some may want to use more powerful and specialized recording equipment than their mobile phone.

Logging practices could also be usefully thought of in terms of “quantum” multiscreen habits. Wherever the user practices, they should be able to quickly log their time practiced and what they worked on before they forget. This should be easy to do on a mobile phone, since its the one they’re most likely to have on hand.

Things musickers should be able to do on a mobile device: log a practice, make and post a recording, and monitor conversations and interactions in forums, groups and virtual events.

PART*C*8*Customization*vs.*Design*

Some variables we could manipulate to allow the user more or less control over their experience:

1. Creating Virtual Events. One of Musicking’s features allows users to participate in “virtual events.” These are pages where participants can post recordings of themselves playing, and listen to one another’s recordings.

In this feature alone there are a number of variables that could be tweaked. For example:

• Who can create a new virtual event? Site administrators? A special category of user? Anyone? Will events be monitored/moderated?

• What event features are optional and what are required? Will there be a restricted number of event “templates” so that users can learn a specific and limited set of expectations, or event creators be less limited in how they set up their events? For example, we might say that events must either be workshops, where users can expect to post recordings and get feedback, or open mic nights, where users can expect to receive only virtual applause. Or we might leave it to event creators to explain the rules of their individual event.

�4

• Other variables: Are events public or private, or is this up to the user? How much flexibility is there in setting the duration of the event? After an event is over, does the information associated with it disappear, or is it archived, or does someone choose for each event?

2. Focus. Many existing online communities for musicians focus on a single instrument and/or musical style. Similarly, we could design forums and content to focus on a narrower subset of music-makers (guitarists, classically trained musicians, composers of electronic music, etc.) or try to design for a cross-genre audience.

Many of the issues music learners face require specific types of expertise to address: a piano player isn’t likely to be able to advise a clarinet player on what kind of reed to get, and a classically trained musician may (or may not) be a poor judge of punk music aesthetics. Focusing on a narrower community makes it easier to create content, while a broader focus requires users to find or build their own music communities within it in order to be useful (eg. creating a group that caters to one’s specific interest). The former would be easier to manage, but the latter might allow for more serendipitous discovery.

A middle ground would be to create spaces for common interests - for example, subforums devoted to popular instruments and styles - as well as a way for users to adapt the system to create communities around more niche interests.

3. Timeline content. Users will have the option of posting information about their practice, including time spent practicing and recordings. As with the Virtual Events described above, this generates a whole host of variables that can affect the amount of design vs. user control over the experience. Users could be offered a great deal of flexibility in terms of what they can post to the Timeline, or else we could restrict the types of content, either directly (only text can be entered, only certain types of files can be uploaded) or through the use of forms and templates (for example, “Hours practiced: [text entry field]”).

The advantage of the latter approach is that we can have different types of entries display in different ways on the timeline - for example, all the hours practiced

�5

could be added up and displayed as a meter indicating progress. More flexible tools for entering information into the Timeline would give users the ability to adapt it to a wider range of needs and goals, but it could restrict the number of creative things we as designers could do with the Timeline display.

�6

PART D - Observe

PART E - ExploreMartina'logs'a'practice'session.'

When%Martina%first%logs%in%to%Musicking,%she%sees%her%dashboard%and%her%updates%feed.%She’s%in%a%hurry,%

so%she%immediately%selects%My%Timeline%without%pausing%to%read%her%updates.%

�8

Martina’s%timeline%takes%a%moment%to%load.%While%it%does,%she%sees%a%notification%that%her%timeline%is%

loading,%featuring%the%banjo@playing%robot%mascot.%

%

%%

Once%her%timeline%loads,%she%goes%to%Create%Timeline%Post

�9

Ellipsis%(dots)%moves%as%the%page%loads,%indicating%

progress%is%being%made.

The%form%for%logging%a%practice%appears%as%an%overlay%floating%above%her%timeline.%Martina%enters%her%

time%practiced,%and%a%few%notes%on%what%she%worked%on.%

�10

After%she%hits%Log%Practice,%the%form%disappears%to%reveal%the%timeline%again.%Another%note%is%slowly%

shaded%in%to%mark%another%practice%accomplished,%and%the%robot%mascot%bobs%its%head%and%plays%its%

banjo%in%celebration.%

�11

PART*F*8*Modify*

How does the musicker change the system to get what she/he needs?

Participating in a Virtual Event:

One of the ways the Musicking community learns from one another is by participating in Virtual Events. In a Virtual Event, participants upload or add a recording by a given deadline. Afterwards, there is a listening period, during which you can listen to other people’s recordings and respond. This is a great way to engage with the Musicking community, and a fun and non-stressful way to perform for others.

To participate in a Virtual Event:

1. First, decide what kind of Virtual Event you want to participate in. Start by asking yourself the following questions:

1. Do you want feedback on your performance? Are you prepared to leave feedback for others? If so, look for a Virtual Workshop.

2. Do you simply want people to listen to share performances and offer “virtual applause”? If so, look for a Virtual Open Mic Night.

2. On the Virtual Events page, choose either the “Virtual Workshops” or “Virtual Open Mic Nights” button.

3. You will now see a list of upcoming events in chronological order. You can filter these by instrument, style or skill level. Some events will specify a particular instrument, style or skill level, and some will not.

4. If you want to read more of an event description, hit “More.” This will open a window with the event details, including a list of questions that other users have asked about this event (and hopefully the event organizer’s answers). If you have any further questions about the event, hit “Ask a Question.” You will be notified when the event organizer responds.

5. If you’ve decided you want to participate in the event, hit “Sign Up.” The event will then be automatically added to your Dashboard under “Upcoming Virtual Events.”

6. When you’re ready to post a recording, find the event in your Dashboard. Be sure to post your recording before the recording deadline, which appears next to the event on your Dashboard.

�12

7. If you wish to make a recording from within the web app, choose “record your piece.” 1. You will be asked if you wish to record audio or video. If you decide to record

video, position your device in such a way that you will appear on the screen; otherwise, position your device so that the microphone will pick up your sound. If you want to use an external microphone, connect it to your device now.

2. Test the audio levels by playing or singing something at a medium-to-loud volume. Watch the bar at the bottom left corner - if it leaps to red, slide the slider to the left. If it fails to reach the green region, slide the slider to the right.

3. Hit Record, perform your piece, and hit Stop. You can choose Replay, Redo, Post to Event or Post to Timeline. If you choose Post to Event, you will be prompted to enter the title of the recording, and any comments you wish to include. Once you’re ready, hit Post Now.

8. If you’d rather upload a recording you’ve already made, choose “upload a recording.” Compatible file formats are .avi, .flv, .mp3, .mp4, .wav.

9. If you wish, you can also post a recording from your Timeline. Select “choose a recording from my Timeline.” You will see a list of sound and video recordings that you’ve posted to your Timeline. Select the one you want, and choose “post this recording to [event].”

10. After you’ve posted your video to the event, you can delete it and post a new one at any time before the recording deadline.

11. After the recording deadline has passed, it’s time to listen to what other people have recorded:

1. Find the event in your Dashboard, or on the Events Page. It should be labeled “Listening period in progress.” Select “Listen Now.” You will be taken to the event page, where you can browse recordings, and see other participants’ interactions with your recording. Interactions might take the form of comments or “virtual applause,” depending on the type of event.

2. Make sure you visit the event page during the listening period - at the end of this period, the page will expire and you will no longer be able to access the event page.

�13

PART*G*8*Change*

How does the system change the musicker?

In his book Human Scale Development, economist Manfred Max-Neef argued that there are 9 fundamental human needs, and that quality of life is determined by the degree to which these needs are satisfied. We’ll look a few Musicking use cases in terms of how they satisfy human needs for creation, understanding, participation, identity and freedom, and invite the musicker to continue using the site.

Use Case #1: Practicing and Logging a Practice

Laura picks up her guitar one afternoon. She sets her timer, and pulls out some sheets she’s printed out. One outlines a suggested 15-20 minute practice routine for beginners, and another with the guitar tabs for the Beatle’s “I Feel Fine” along with her scrawled notes.

The chord changes are still challenging, but she can hear the familiar song beginning to emerge - amazing how it only uses 3 chords!

At the end of her practice, she reaches for her phone and opens Musicking. Selecting “Log a Practice,” she enters the amount of time she’s practiced, and what she’s worked on. She adds a sentence expressing her excitement at the idea of soon being able to play a real song - she knows that a few of her friends might read her practice notes, because she’s asked them to help hold her accountable to her practice schedule! She also has her settings set to Tweet new Timeline posts.

After she logs her practice, the system notifies her that there are only 2 more hours of practice to go before she reaches the next musicking level.

Later she gets an email notifying her that two people liked her practice log. She follows the link in the email to view her Musicking Timeline. She notes with satisfaction the

�14

music staff at the bottom, where the ghosts of music notes are slowly being filled in to mark the time that she’s practiced.

Use Case #2: Posting a Recording to a Virtual Event

Ahmad belongs to the Musicking group “Cover Contests.” The premise of the group is that every month or so, members will take turns issuing a cover song challenge in the form of a virtual open mic night. Ahmad joined the group because the premise sounded like fun, and people seem to enjoy it when he and his brother cover American popular music on oud and darbuka (listen to an example of an oud and darbuka duo).

This month’s cover contest features “Ain’t No Sunshine” by Bill Withers, and Ahmad has some great ideas for it. After going over the melody a few times on the oud, Ahmad is joined in the basement by his brother, and they work on their arrangement. Ahmad decides to begin with an improvisation on the Arabic maq’am (mode) Saba, from which he transitions into the pentatonic scale used in “Ain’t No Sunshine.” His brother then begins a steady rhythm suitable to the song, but still inflected with Middle Eastern-style ornamentation. Ahmad sings and plays the melody on the oud.

Once the brothers are happy with their arrangement, they set up their camera on a tripod and record their cover. Ahmad downloads the file to his computer, then finds the event on his dashboard in Musicking, and uploads the file. A message urges him to check back during the listening period, which will run from 8pm that night until 8pm the night after. There is a checked box next to “Notify me by email when the listening period begins,” and he leaves it checked before hitting “done.”

Use Case #3: Give Feedback in a Virtual Workshop

Alex has been playing the piano for about 3 years now, and started using Musicking 6 months ago. He finds that participating in virtual workshops is a good way to get feedback on what he’s doing, and he enjoys the analytical aspect of music practice.

He posted a recording in a virtual workshop a couple days ago, and the listening period has just begun. On his laptop, Alex works his way through the recordings, listening to his fellow musickers. He takes his responsibility as a participant seriously - he wants

�15

people to leave encouraging, constructive feedback on his own recording, so he tries to leave similar feedback on as many recordings as he can.

This workshop is limited to piano recordings, though the skill level, style and selection of pieces have been left open. He’s just listened to a recording of someone playing the theme song from the movie Forrest Gump. In the notes, the player says that she learned the song by ear off a recording.

Impressed, Alex leaves the following comment:

“That’s amazing! I wish I could learn chords by ear - unfortunately, I need to see them written out. It sounds great so far, but maybe a bit rushed? It’s been a while since I saw the movie, but I think it goes a bit slower, doesn’t it? If you slow down and relax, you can really bring out the contrast between when the melody is on the beat, and when it’s off the beat.”

Alex pauses for a moment, then hits “insert a recording.” The recording screen opens, and he hits “record” and sings the melody at the speed he thinks it should go, with an exaggerated emphasis on the syncopation. He then hits “insert recording,” and then “post comment.”

An hour or so later, he receives a notification that the woman who played the Forrest Gump theme rated his comment as “useful.”

�16