The logo for Bard, which is the word bard with all lowercase letters, and a tail attached to the letter d to make it look like a musical note
Providing songwriters with a new way to
organize ideas and prioritize creativity
View Solution
A mockup of an iPhone featuring a screen from BardAn iPhone mockup featuring the home page from Bard
Role
UX / UI Designer, User Researcher
Tools
Figma, Zoom, Google Forms
Timeline
4 weeks

Background

I'm a songwriter.

When Thinkful gave me the task of coming up with an idea for a capstone project, music was the first place my mind went. I started thinking about the apps I currently use for music, and realized that I rely on two different apps to get song ideas down - voice memos and notes. While using two apps has worked somewhat well for me, I wanted to see if I could create something better.

I had a problem with my process.

Songwriting is all about ideas. But when you lack organization and have several pieces of a song in different places, you run the risk of forgetting good ideas. I've lost countless ideas just because I couldn't find where I wrote something down.

I wanted to help other songwriters too.

Even in the wake of a global pandemic that has kept live music from happening for nearly a year, the music industry is still valued at over $50 billion. This figure is only expected to rise, as the growth of digital music streaming and creation has been accelerated by COVID-19. With songwriters now spending more time at home than performing, it's safe to say that more musicians than ever are looking for new and better ways to create.
Source: World Economic Forum, 2020

Solution

Bard is an iOS app prototype that allows users to

• record songs using the phone's microphone, or in-app MIDI instruments
• add lyrics or notes alongside audio/MIDI tracks
• organize and edit songs
View Prototype
Discover
Research Plan
Competitive Analysis
User Survey
User Interviews
Personas
User Stories
Research Plan
Will this product help people?
• Understand how and why people write music
• Identify pain points users face when using existing songwriting tools

How might people use this product?
• Identify the tools people use to write and record music
• Identify when a songwriter would want to use an app like this
• Narrow down feature options

How do competing apps address the problem?
• Understand users' relationships to existing songwriting apps
• Understand how competitors are addressing this problem within the app space
Competitive Analysis
Existing mobile apps seem to mostly focus on sharing ideas with others and making a name for yourself as a musician or songwriter. I wanted to differentiate Bard by focusing more on creation and organization. These SWOT analyses summarize my findings on two competitors, Bandlab and Tully.
User Survey
A survey helped me to find answers to the questions asked by the research goals. These answers would then help back up any design decisions later on in the process. Some of the main takeaways from this survey were:

• 90% of the participants believe an app like this would potentially be helpful to them
• top feature choices included writing lyrics, a recorder, and mixing capabilities
• most participants would use this app when they want to start the songwriting process

The survey and a full analysis of the results can be seen here
User Interviews
Interviews were conducted with three survey respondents, who were all songwriters between the ages of 20-30. Through these interviews I deepened my understanding of people who might use this product.

The full interview script and notes can be seen here

Users don't want any frills – just the basics.

"I'd want it to be really simple, and just easy to use."
– Zee, writes hip-hop

They struggle with organization.

"Keeping ideas together can be tough sometimes."
– Em, writes indie pop

Most of their songs start with small ideas.

"I usually start with some doodles, record a few seconds of it on my phone, write some lyrics down, and go from there."
– Tom, writes all kinds of music
Personas
These personas gave me a way to visually condense the analysis of the survey and interview results, and to give faces to those abstract concepts. This helped me build empathy and made the project more tangible.
User Stories
I then crafted user stories based on the interview results. These stories acted as the next step in translating research directly into solutions. For these stories, I used the "jobs to be done" framework, which follows this pattern:

When [I, the user, am in a situation],
I want to [act based on a motivation]
so I can [achieve a desired outcome].

The full list and details can be seen here
Define
User Flows
Sitemap
Wireframe Sketches
Lo-Fi Wireframes
User Flows
I created user flows, based directly on the user stories, to ensure that the most important needs of users would be met and translated into this product.
A few examples of micro-flows I created to represent each user story
A combined, simplified user flow
Sitemap
Wireframe Sketches
I sketched out some different ideas for each screen laid out in the sitemap. The sketches I ended up prioritizing were the most usable, followed common mobile patterns, and reflected the needs of users the best.
Lo-Fi Wireframes
Sketching and content creation led to wireframing, where I started by simply recreating the sketches I thought best solved for each user story. Realizing that some of the sketches didn't translate very well, I experimented with other sketches. Staying open to new and old ideas led to a more usable and appealing design.
Develop
Branding
Hi-Fi Wireframes
Interactive Prototype
Branding
Based on what interviewees told me, I wanted the app to be simple and unobtrusive. I wanted the branding to reflect that by including color and styling sparingly. This is the first color palette and limited style guide I created. After testing, I would go on to expand on this style guide, and adjust the color palette and its use within the app, to improve accessibility and usability.
Hi-Fi Wireframes
Using the first iteration of branding, I updated the low fidelity wireframes. I made some adjustments in regards to alignment, spacing, and hierarchy as well. This first version of high-fidelity wireframes is what I used to craft the first testable version of a prototype.
Interactive Prototype
I continued using Figma to create a clickable prototype based on the high fidelity wireframes. This prototype would be used for testing, so it only included the necessary screens and interactions for users to achieve certain goals.
Testing
Moderated Usability Tests and Analysis
Updates
MVP Prototype
Moderated Usability Tests and Analysis
I conducted three moderated usability tests via Zoom. The goal of these tests was to assess how easily and quickly users could complete given tasks within the prototype. While most of the feedback indicated that users were able to complete tasks with ease, some feedback indicated that there were necessary updates to make.

A full test script, notes, and analysis can be seen here
Updates
Based on feedback from usability tests, I made the following changes to the prototype:

• Added more color throughout the app, and improved the palette's accessibility
• Changed the "Recent Projects" layout on the Home Page to be more usable
• Improved functionality of the "Mix" panel
• Added an "Effects" screen or layer
• Changed some titles and labels to improve clarity
• Added a "Collection Details" screen

These changes resulted in an updated branding guide and mockups.
MVP Prototype
After prioritizing updates based on user and mentor feedback, I updated the prototype and finalized the MVP. While it still is limited in functionality due to the scope of the project, this iteration aims to provide a more usable product for songwriters.

Prioritizing creation

No matter where you are in the app, it's always easy to start a new project and do what you want to do - create.

Making it easy

No more switching apps or screens to write down lyrics. Right within the Project page, add and edit notes or lyrics alongside your audio and MIDI tracks.

Mixing things up

After creating a song, edit and mix the tracks to your heart's content. You can also edit how these songs are organized by putting projects together into Collections.
View Prototype
Next Steps & Outcomes
Product Backlog
Results & Reflections
Product Backlog
From here, I plan to conduct more interviews and usability tests as I develop this product. In the initial research, survey participants expressed that they would want to able to share their ideas with others, so a sharing feature would take first priority moving forward. Some other potential features and additions include

• Metronome option while recording
• Count-in option
• Tempo settings
• More in-depth effects page
• Adding flows for adding projects to Collections
Results & Reflections
The primary goal of this project was to create a solution for songwriters who feel unorganized and uninspired. I believe I've achieved this goal by creating a simple and easy-to-use prototype. I tested the validity of preliminary designs, and made the according updates based on user feedback. More testing and iterating will be needed to verify this product's validity as I add and remove features.

If I could go back and change anything about this project, I would have created more user and journey profiles as a part of the research analysis. I also would have liked to conducted a feature analysis of competing apps. In future additions to this project, I will include journey mapping, empathy mapping, and more in the research phase to strengthen my understanding of the problem space.

Since this is a passion project in which I am my own client, I learned a lot about the importance of setting scope and sticking to constraints. I believe that establishing landmarks during a product's development is crucial to ensuring that positive progress is being made, and that design decisions are consistently backed by user research. I think I've reached a landmark with Bard, and I'm excited to see where I can take it in the future.
Back To Top