Treblr

Treblr is a cloud-based music notation platform designed for collaborative songwriting.

Role

As UX team of one, conducted user research, wrote user narratives & crafted personas, mapped out the information architecture, built high fidelity mockups, and a prototype.

Timeline

Three and a half months.

Design Toolkit

Adobe XD

Adobe XD

Adobe Illustrator

Illustrator

Optimal Workshop

Pen & Paper

Pen & Paper


The Challenge

Can the experience of live jam sessions be recreated in a digital scorewriter platform?

Background

Making music with peers in the flesh feels natural because everyone can experience the pitches and rhythms together in real-time. Digitally notating songs as a team, however, can be difficult because musical thoughts are complex and hard to convey without playing an instrument right then and there.

Musicians can send each other digital scores, but there are many scorewriter apps, and most have incompatible file types. 

The Problem

Writing music with others online is difficult because many musicians use different scorewriters with incompatible file types. 

The goal

  1. To help musicians collaborate in the songwriting and arranging process.

  2. To help users write music the way they think about it—phrase by phrase, not note by note.

1-treblr-persona-all.png

User Research

Challenge

Songwriting is a niche interest, and music notation is an even smaller subset within that community. I relied on snowball sampling and reached out to musicians in my network for insights.

Process

I connected with five musicians, four of whom were familiar with notating music and regularly arrange music. Through hour long chats, I inquired about their songwriting process as well as their experiences and thoughts on scorewriter platforms they’ve used in the past.

Insight

Interviewees who had tried multiple scorewriter platforms noted that they’d chosen their current scorewriter because of handy shortcuts which made for faster writing. A shared frustration between the interviewees was that music notation is tedious.

They elaborated that often they hear the musical phrases in their head and know what they want to write, but that inputting notes was laborious and time consuming, which disrupted their creative flow. Four of the interviewees noted that they liked the idea of writing music with others online and would want to try a cloud-based collaborative music notation platform.

1-treblr-cardsort-feature-3.png

Information Architecture

Card Sort

Through Optimal Workshop, I invited musicians in my network who could read music to sort music symbols by category. In this card sort, the opportunity to create custom category names was offered.

Process

Since sorting by technical category didn’t work out in the card sort, I removed category names which were confusing for the testers. With the help of the card sort analytics and user suggestions, I redistributed the musical symbols under more familiar terms.

Initial Approach

Symbols and glyphs in music theory are categorized by purpose and usage. There are many symbols which would need to be organized into an editing toolbar. My assumption was that the simplest way to organize symbols by technical category. I tested this theory by conducting a card sort.

Results

Commonly used musical symbols were sorted correctly, but otherwise, many symbols were miscategorized. While many of the musicians had been classically trained and had taken theory classes, not all recalled the technical names and designations of each symbol. 

Design Solutions

Cloud-based collaborative composing & editing

Cloud-based collaborative services are already commonly used. According to TechCrunch, 70 million students used G Suite for Education in 2017. 

In a cloud-based scorewriting platform, musicians could virtually convey musical ideas in real-time. Treblr’s score playback function would enable users to hear the music right away. All collaborators for a score could write and edit directly to the score without the hassle of passing around a computer to take turns writing.

Songwriting by phrase, not note

Since sorting by technical category didn’t work out in the card sort, I removed category names which were confusing for the testers. With the help of the card sort analytics and user suggestions, I redistributed the musical symbols under more familiar terms.

Toolbar functions organized by familiarity

There are lots and lots of musical symbols that a songwriter might need in their toolbox when composing a song. Instead of using technical jargon to organize these glyphs, Treblr’s toolbar is organized using tried and tested terms which are familiar to musicians. 

The toolbar is arranged such that only one row of music symbols are shown under each category

treblr-brand-kit.png

 

Previous
Previous

Interactive Ontario Website Refresh