Case Study
Product | Soundtrap, a browser based Digital Audio Workstation (DAW)
Task | Add a feature to Soundtrap
Team Size | One
Role | Product Designer (UX/UI)
Timeline | Three weeks
Project Background | Soundtrap is a web-based Digital Audio Workstation (DAW) designed for music production and collaborative work in the cloud. What's an extra feature that can keep current users engaged and attract new ones?
Chart topping effects
3rd party plugins from the best in the biz.
Game changing instruments
Era defining sounds ready to be reimagined.
Now in your workflow
Rent or buy within the studio and get creating.
Problem Statement
Despite its popularity among beginners, experienced users are not recommending Soundtrap to others. Direct competitors are offering more affordable and feature-rich alternatives, thereby diminishing Soundtrap's competitiveness. Potential new users with production experience are put off by a perceived lack of base line features. In order to grow loyalty and obtain new users, there is a need to keep up with competing platforms by improving the offering based on feedback.
The Soundtrap Plugin Store allows users to lease or buy third-party plugins, including both effects and instruments, merging them into their music projects. This addresses the current user base as well as music creators with typical expectations from any DAW software. Initial store offerings include the legendary TB-303 Synthesizer and Juno-60 Chorus from Roland, enabling users to recreate sounds associated with major artists like Daft Punk and Tame Impala.
Research Objectives
Understand
Existing product and its features
Identify
Potential features that may benefit current and future users
Gain Insights
Into target audience and establish user personas
Define
Problem statement based on user needs and expectations
User Interviews
Users interviews were carried out both with Soundtrap users and music producers who used other DAWs. These findings were affinity mapped and summarised.
Forum Research
A deep dive was performed on the Soundtrap feature request forum as well as Soundtrap specific Reddit groups. These findings were affinity mapped and summarised.
Competitor Analysis
Initial analysis included platforms such as Logic Pro, Ableton, Serato Studio, FL Studio, Pro Tools and Garage Band, before being condensed to the most direct competition for Soundtrap.
Key takeaways
Bandlab provides much of the functionality of Soundtrap Free, with extras. These extra features might impact user retention within Soundtrap, and risk users shifting to Bandlab. Bandlab (free) also competes with Soundtrap Premium at 9.99 p/m and Soundtrap Supreme at 14.99 p/m, meaning Soundtrap relies on existing users staying with them (Sunk cost fallacy), reliance on Soundtrap instruments and effects, or strong community and collaboration.
Soundation is not a consideration with its free version, however paid versions, particularly Creator, compete strongly.
Amped Studio has less collaborative support and community, however the ability to use 3rd party plugins, and the browser base puts it in contention.
Soundtrap may benefit from differentiating itself from Bandlab, and improving upon the comparable experience for users.
Research Synthesis
Users provided feedback based on their expectations, the experience within the Soundtrap platform, and based on their comparative experiences with other DAW’s. The feedback shares more consistencies than contradictions, making a feature roadmap possible to build with some confidence of additional feature’s effectiveness in retaining users, gaining new users (new to music production), and bringing users of other DAWs across to Soundtrap.
One prominent issue that has arisen consistently is the shifting paywall of Soundtrap. Users are feeling frustrated that functionality which was free, is now behind paid subscriptions. Without knowing the revenue structure and business plan of Soundtrap, it is difficult to recommend changes, given some seemingly basic fixes have been skipped, assumably for a reason, behind the scenes. Based off the feedback from current users, the user vs business aspirations do seem to be misaligned at this point.
Recommendations for features from users include the ability to disrupt the paywall by way of purchases of specific sounds and functions, and using their own instruments, without a full subscription upgrade, which may keep users from shifting to other free platforms such as Bandlab, and introduce gifting as a revenue stream.
Key takeaways:
Soundtrap is often seen as an entry level DAW for beginners.
Soundtrap is enjoyed for affordability for beginner engineers and producers who may not be able to afford expensive DAWs and equipment.
Soundtrap Free has been well regarded, however regular changes are frustrating users
Soundtrap’s community is viewed positively, with some frustrations building as functionality shifts.
The collaborative features of Soundtrap are praised, but the inability to use 3rd party plugins and existing sound kits is seen as a limitation.
Based on the research, I was able to put together a full feature log, build user personas, and develop How Might We questions in order to start building a new feature.
Feature Log
Research results allowed for a comprehensive feature log to be built.
Establish Personas
“Foundation user”
How Might We introduce 3rd party instruments and effects to the Soundtap toolkit?
Flows
User and task flows take into consideration existing UI and patterns used within the Soundtrap platform.
The store has adopted the existing flows of instrument and effects selection, meaning instrument and effect flows are different, albeit slightly.
Adding powerful functionality within existing patterns should retain user familiarity and reduce friction for the use of this new feature.
Lo fi sketching
Wireframing flows considering existing UI
Interface building
Soundtrap Instrument Interface: limited real estate to maintain plugin functionality
Instrument Interface: TB-303 edit off, light mode
Instrument Interface: TB-303 edit on, dark mode
Effect interface:
Chosen effect Roland Juno-60 Chorus has a simple interface which was able to be designed and incorporated within Soundtrap’s existing effect rack and effect size parameters, with the exception of width. As more complex effects are introduced, effects may need to break out of the rack for accessibility and functionality purposes.
Newly designed Juno-60 Chorus blending into existing effects rack alongside Soundtrap Crusher effect.
Building product page
Mid fi mockups, product page
Hi fi mockup, products page
Light | Dark Mode
Using Figma variables, Soundtrap’s color system was built out, allowing for every screen to be available in light mode and dark mode, accurate to the performance within Soundtrap.
Audio and visual playback.
Bringing a Digital Audio Workstation (DAW) to life within Figma was an exciting challenge. Given it is all about audio, wouldn’t some audio within the prototype be nice? Audio examples can be played back at the beginning and end of the prototype - including hearing the difference between the chorus effect on and off. The sound of the TB-303? That’s the real sound of the TB-303 that I programmed and recorded. To give a visual playback experience, the playbar moves across the screen using variables and conditional prototyping in Figma.
Prototyping
Soundtrap’s interface was fully built out using Figma, and each flow was prototyped for testing and delivery. The full user flow was then build in one prototype allowing users to access the store, rent or purchase an effect or instrument, and add this to the their track within the Soundtrap Studio. Using newly introduced functionality in Figma, the protoype was built to
fully work in both light and dark mode.
Usability test results
Usability test: full prototype
Participants: 4
User feedback:
new feature slightly hidden.
new feature not immediately apparent as new.
new feature so embedded and familiar that it could be missed.
like full functionality and large display of instrument.
more information of terms & conditions of purchase/rent.
are other payment options available
option to use loaded payment details as current paid user
terms inconsistent, sometimes ‘purchase’ sometimes ‘buy’
Users attempted:
drag effect around page and out of effect rack
change option rent/purchase in payment page (rather than exit to change)
click effect to enlarge or bring out of effect rack
Iterations to carry out:
allow shift between rent and purchase within payment screens
streamline language purchase/buy
highlight new instrument/effect within UI
Iterations for consideration:
option to use existing pay details.
agreement checkbox and link to T&Cs
alternative payment options such as Paypal, Apple Pay.
enlarge effects out of effects rack.
Final flow
Final prototype can follow all user and task flows, in light and dark mode (switchable).
Access plugin store from Studio via effects and instruments, followed by selection, purchase, and adding of instruments or effects. Best viewed fullscreen - press R to restart at any point.
Reflection
This project provided multiple insights into the design process, and the broad application of processes mixed with the constraints of industries and technologies. I worked on a Digital Audio Workstation to expand my skillset both in research and design tools - my Figma proficiency has improved markedly and I tried to implement new functionality within Figma as it was released. I also chose it as I am passionate about music and music production, so it was fulfilling to work on something like this, and chat to users who were all music producers themselves. I am super proud of the final result, particularly the functional prototypes using colour modes and up to the minute techniques. Key takeaways are knowing when to deep dive, and when to keep things moving. I look forward to more work in this field.
