TheBasketApp
Figma
C++
React
Tailwind
NodeJS
MongoDB

Description | Building an online recording studio with real-time DAW and Electron desktop app communication, using a JUCE-based VST plugin. |
My Role | UX Researcher, UI Designer, UX Designer, Front-end Developer, VST-Plugin Developer, Desktop App Developer. |
Platform | Web Mobile Desktop VST |
Client/Owner | Niphway LTD |
Duration | 4 Months |
Project Overview
In today's music industry, up and coming music producers often face challenges in connecting with already established artist which make collaboration opportunities likely impossible for them to take them to where they'd like to be according to their career goals. Likewise, established artists seeking fresh talent encounter difficulty in discovering promising new producers who would help them explore their sound. As a result, there exists a significant gap between aspiring and established music creators, hindering the growth and development of talent across the industry. ThebasketApp aims to address this problem by providing a platform that seamlessly connects emerging producers with established veterans, facilitating mentorship, collaboration, and the discovery of fresh talent, thereby fostering a more inclusive and vibrant music community.
Project Process
To solve this problem and ensure seamless collaboration between artist and music producers, I employed a 4 step iterative process which includes:
- Discovery and Synthesis:Gather user needs and insights to gain a deeper understanding of their needs, behaviours, and pain points.
- Strategy: Develop a strategy to address the identified issues and carter for the user experience.
- Design: Iterative Product design
- Implementation: Create the backend with typescript, MongoDB, Express

Discovery & Synthesis
I created a research plan in Great Questions, where I selected interviews and recruited 4 producers and 3 artists to understand their needs and frustrations. Conducting interviews was a decision I made because it allowed for a deeper understanding of their frustrations through one-on-one conversations. We conducted interviews at various locations, mainly at the artists' houses. I was able to meet with 2 popular producers and 2 up-and-coming producers, while the remaining participants were up-and-coming artists, as there was no way to meet with the popular artists. I refined my data in Figjam, utilizing thematic analysis to filter out findings, insights, and recommendations.
Artifacts Created
- Research Plan
- User Persona
- Research Report
Strategy
Using the recommendations, I decided to develop a cross-platform application, focusing on mobile for artists and a website for producers. Since the majority of producers use their devices for music production, I developed strategies to simplify music production for both artists and producers. This involved creating a platform that allows users to listen to music without seeing the name of the producer, thus reducing bias towards bigger producers. Additionally, the aim was to ensure that music production could be done remotely and seamlessly.
User Home & Explore
The homepage of Flowbasket serves as a gateway to a world of musical exploration, collaboration, and creativity, while the explore page allows users to listen according to their taste, as shown in 1, 2, 3 below.
-
Home
- Last Played: Personalized showcase of the user's recent tracks for a seamless experience.
- Randomized Music: Curated selection without creator names to encourage unbiased discovery.
-
Explore
This page filters music files into categories that can appeal to users based on what they would like to hear.
-
Category
This page displays individual music in a particular category, allowing users to listen without showing the names, so as not to bias their preferences.

Uploading Files
-
Upload
On this page, users are allowed to select the type of file they want to share, then they can view the progress of the upload while it's being processed on Page 2.
-
Metadata
This page collects metadata that is used to save user preferences on how they want the files to appear to other users. They can also choose whether they want the file to be private or visible to everyone on Flowbasket.
-
Success
This page notifies users upon the completion of their upload and allows them to seamlessly share their files with everyone.


VST Plugin
Making a platform for producers and artist to record seamlessly would not be possible, without producers being able to record the studio session direction to their digital audio workstations. so i designed a VST plugin which would work via network to record audio directly, which is to improve the producer's workload efficiently.

Other Screens and Features
- Studio session confirmation page
- Studio details page
- Studio description with map
- Online studio session screen
- User favourites in profile
- Join a studio session page


Next Steps
I continued to implement the backend in Nodejs with typescript, and implemented the features with another backend developer, we implemented all the features which includes creating the studio, starting a studio session, file upload. upon completion we would implement beta test.