Bandbox
A self-defined passion project, designing a web app from scratch
My role: I completed the entirety of this project by myself
Tools:
Figma
Zoom
Real-life whiteboard
Sketchbook/pencil
Methods:
Competitive audit
Directed Storytelling
Affinity Diagramming
Usability Testing
Kanban board
Context
Bandbox is a self-defined passion project born from my background of being in and co-managing a band for seven years. Bandbox is a free cloud-based file storage web app specifically curated for self-managed bands. Bandbox is a one-stop-shop for file storage, organization, and collaboration, giving bands the tools they need to efficiently complete everyday admin tasks so that they can spend less time wingin’ it, and more time singin’ it!
The Problem
Independent, self-managed bands have limited time and money to invest in completing administrative tasks. They often find themselves using numerous generic tools, causing their content and resources to be spread out and disorganized. This limits the bands in their ability to be successful.
The Solution
I designed a cloud-storage web app, not dissimilar from Google Drive, but curated to independent bands. Bandbox has built-in tools to help aid in scheduling and the creation of important documents like setlists, lyric/chord sheets, and more.
What Surprised Me
One thing that surprised me was that 2/4 of my participants in generative research brought up wanting to use audio annotation before I ever mentioned it as a potential feature. 3 out of 4 participants chose this feature as one of their most-desired features. I learned through further research that many people don’t know what audio annotation is, however it remains to be a crucial tool for communicating in any collaborative creation involving recorded sound, especially in the iterative process of recording music in a studio with an engineer.
The Users
The primary users are musicians who manage their own small, independent bands. They typically have full-time jobs and other responsibilities outside of the band, causing them to have limited time and money to invest in management. They want more gigs and more time to practice, but are held back by mundane tasks.
The Process
Research
Does this product already exist? Is it any good?
In a competitive analysis I conducted of competitors in the market, I found that most of them focus on the booking and distribution side of things, and cost at least $10/mo and sometimes more than $50/mo. However, as I discovered through later research, self-managed bands don’t have much of a budget for this type of tool.
This told me that there is a gap in the market for a free management tool that focuses more on administrative tasks within the band (rather than booking and distribution).
Directed Storytelling User Interview
What do users think/feel/experience/use?
Directed Storytelling interviews provided insights on tools that indie bands currently use to complete administrative tasks, their struggles in managing their bands, and their desires for a better experience. I let the findings from this research define the features I would focus on for the scope of my project.
I found that users were most interested in these proposed features:
Songs, chords, and lyrics
File manager
Setlist builder
Calendar
Audio annotation
User Journey Map
View/download a PDF of the user journey map
Early Prototyping
Taking some inspiration from Google Drive, and combining it with my research findings, I came up with some rough sketches to work from later while building my digital wireframes.
Dashboard Sketch
Setlist Builder Sketches
Something Unusual
I designed the app so that “Songs” are set up like folders that contain any files associated with the song, like audio files or lyric/chord sheets. Individual files can still be found easily on their own, but this method of grouping allows songs to be recognized as “songs” rather than just a file or folder. This also helps the Setlist Builder function, because it needs to pull from a list of songs. Songs also contain unique metadata like song length, songwriter, guitar tuning, and other custom tags that the user might want to add.
Song Hover State
“It’s pretty simple and minimal, but in like a very useful way”
“[The comment] looks like it posted because of the checkmark”
“This is definitely ideal.. Just kind of a drag and drop”
User-Informed Improvements
Through usability testing, it became clear that a few minor changes needed to be made to the app, since users experienced friction or confusion often in the same places. Based on these discoveries, refinements were made to improve site navigation, visibility, and feedback.
These tests were also a great opportunity to get feedback on what users like and dislike about the app!
One particular refinement I made was to improve how the app communicates with the user based on their actions (feedback) in the Audio Annotation user flow. In order to better show the user what they can do, and what they’ve done, I clarified the app’s feedback using plain language instead of symbols and variety to show change, as shown below.
BEFORE - Clean design, but confusing for the user
AFTER - More clearly communicates system status to user
To improve this design even further, I would like to increase the size of comment text, and increase the hierarchy of the “add a comment” button.
High-fidelity Prototype
Research showed that these refinements had an overall positive effect, and I received a little bit of additional feedback on how to improve the app even further. Some of these changes were able to be made, while others fell outside of the scope of work.
Lastly, I worked on adding color and stylizing the app, before creating my slide deck and presenting my work.
Here are the key user flows that I prototyped:
Create a Setlist:
Add Availability:
View Lyric/Chord Sheet:
Comment on Audio:
This is really just the beginning of what could be possible with Bandbox.
Next steps might include:
Continuing to improve the existing design and design system through repetitive research and refinement
Learning about the feasibility of developing this app and making it free for users
Creating a mobile version of the app
Creating non-admin accounts with limited access and capabilities.
Presentation
View/download a PDF of the full slide deck.
How I grew
I am grateful to have had the opportunity to design a product that serves a community that is close to my heart. Being in the primary user group of this project, I have experienced many of the pain points firsthand, and I know how much room for improvement there is with what is commonly the experience for self-managed bands.
Defining this entire project on my own, from scope, to timeline, to process; was something I had never done. At first the task seemed daunting, but now I’ve completed my first design sprint “completely alone”, and I get to walk away with more confidence, and more importantly, wisdom and experience.