Project Background
Our respectful customer is a leading Music Tech Company who specializes in providing digital solutions that allow musicians from all over the world to express themselves creatively. The customer’s flagship product is a Social Music Platform - a full-featured all-in-one application for music recording, producing, streaming, and sharing with 1M+ members.
The company planned to launch a platform’s web version. Upsilon was chosen as a vendor to help with the design and development of its most important functional parts.
Challenge
The Music Tech Company’s goal was to bring its Social Music Platform to the web in order to reach more users who prefer to use browsers rather than mobile applications. Upsilon team was tasked with delivering three functional and visual parts: music playback, playlist management, and user profile design. The customer also set some custom requirements. Along with ‘basic’ features, the platform had to be enhanced with the advanced ones:
- Audio and video playback control, including play/pause button, track length displaying, next/previous button, volume control, etc.
- Playlists management. The possibility to download tracks and form playlists, share them via social networks, comment on songs, and add them to favorites.
- User profile design. It must be responsive and optimized for various desktop screen resolutions.
- The Implementation of custom UI design for desktop and mobile versions of the Web Social Music Platform.
- Support of a special background mode. In that mode, video tracks or playlists should continue to play whatever screen the user interacts with. When browsing different pages or screens, a user should keep the ability to control playback and manage playlists in one click. If a user switches the player from background to foreground mode, the media file continues to ‘seamlessly’ without any pauses and interruptions.
Solution
The Upsilon team consisted of two front-end developers and a designer who worked in close collaboration with the customer’s software development team.
Firstly, we analyzed all the requirements and documentation attached and interviewed the Music Tech Company's engineers. After all investigations, we determined the project’s tech stack, agreed on all aspects with the client and started the development process.
We realized that most of the ready-made music player solutions are over-complicated; therefore, we decided to develop a custom one. To deliver all player's features according to the requirements, we built its core functionality on TypeScript. For UI development, we used React, Next.js, Redux-Toolkit, Material-UI. For custom styling of Material-UI components, we used the CSS-in-JS approach.
In our recent blog post, we described the development process in full detail, illustrating each step with several programming code lines.
After 5 months of work, our team provided the client with an effective solution: a web version of their platform with a custom multi-featured music player in its core.
As a result, users got a Web Social Music Platform that provided all the functionality that was previously available only in the mobile app. Also, it is mobile-friendly and responsive across all screen resolutions.
Business Results
Our specialists delivered all the required platform functionality in time and according to the budget.
The launch of the web version of the Social Music Platform made it possible to interact with the application for both PC and mobile users from one side and reach a wider audience from another.
Web Social Music Platform makes it easier for artists to share their music and communicate within the community from any device. Thus, the service became available and convenient for mobile and web, which allowed Music Tech Company to satisfy users’ preferences more fully.
