03 Aug 2025

Addressing usability issues in MCPlayer, a third-party client for Monstercat music

Redesigning a feature-complete FOSS music app into a more intuitive, consistent, and responsive product.

UI/UX designer (solo)

Role

3 months

Duration

2024

Year

Figma

Tools

Overview

MCPlayer was a free and open-source (FOSS) mobile app designed as an alternative client for Monstercat, a music label known for copyright-friendly electronic music. The app aimed to provide a better mobile experience than the Monstercat's browser-based PWA or outdated third-party apps.

I was brought on by the developer, Puzzak to redesign the entire experience and introduce new functionality. My role spanned UI/UX design and copywriting in Figma.

The Problems

The mobile experience for Monstercat listeners was severely limited:

  • Monstercat’s official platform was a browser-based PWA, with all the performance and UX limitations of a web app

  • While the music was also available on YouTube and YouTube Music, it is not catalogized and unfriendly to creators

  • The only alternative, CatPlayer, was four years old, visually outdated, and no longer maintained. It's now considered lost media.

MCPlayer's developer had released an early MVP (v0.0.1) with essential functionality: login, music browsing, filters, and account settings. However, the experience needed a complete design overhaul to meet user expectations.

“To play monstercat songs (except YouTube and music, where it is not catalogized and not creator-friendly), you have two options on mobile, Monstercat website or CatPlayer” - MCPlayer creator, Puzzak


Redesign process

Research

I began by auditing popular music apps such as Spotify, Apple Music, YouTube Music, as well as the Monstercat website itself. This helped me:

  • Identify core features users expect like search filters, playlists and artist pages

  • Spot UI patterns and mobile-friendly design practices

  • Understand what Monstercat’s API could realistically support

UI/UX Redesign

I focused on reworking both the structure and visual design of the app:

Introduced a new setup flow, including:

  • Splash screen with login/create account options

  • Step-by-step onboarding with email prompt (inspired by TikTok’s domain tile UX), password, 2FA input, and a confirmation screen

Main menu

This had to be revamped with a cleaner look with added functionality from the MVP, which includes:

  • Accomodation for the music features, such as a context menu with more features (like add songs to playlists/albums), music history button in header, settings button and more

  • Last played playlists

  • Persistent music player in the navigation bar

Search experience:

  • Instead of showing all tags at once (which overwhelmed the UI), I showed a few essential tags, adding a “Show more” option

Visual Design:

  • Tweaked sizing and paddings to include more elements while scrolling, as the previous UI was too large

  • Shorter copywriting to reduce cognitive load

  • Designed across light and dark modes with better hierarchy and contrast

  • Introduced a new black-and-teal color palette to replace the original gray background and dark accent retaining the developer’s preference for the Comfortaa font and color scheme, even though the font had contrast limitations on smaller text

I also built interactive Figma prototypes for both mobile and tablet views, making key flows scrollable and clickable. This allowed the developer to better understand intended interactions and helped validate the design across screen sizes.

Constraints & Challenges

  • The developer was learning to program apps, therefore not experienced in implementing the UI

  • We worked within the limitations of Monstercat’s unofficial API, which later introduced a captcha in the login flow breaking core functionality

  • Copywriting was deprioritized to allow the dev to implement layouts first (currently visible as in-progress in the Figma file)

Final Result

Despite the limitations, MCPlayer launched on the Play Store with much of the new UI implemented. However, due to:

  • Breaking API changes by Monstercat

  • Limited time and dev capacity

  • Decreased app functionality

…the app was eventually deprecated, and the codebase archived.

What I Learned

  • FOSS projects teach you to design under real-world constraints, like working with unpredictable APIs and limited dev time

  • UX patterns from larger apps (like TikTok’s domain tiles or Spotify’s search logic) can massively improve usability in niche tools

  • Sometimes, the value of a project isn’t the result. It’s the process, and how you adapt to changing conditions

If you are interested in seeing the source code or learning about the former project, feel free to check these following links:
https://github.com/Puzzaks/MCPlayer
https://play.google.com/store/apps/details?id=page.puzzak.mcplayer

Open for work

23:45

Let’s build the next big thing together.

© 2025, DarkPlayer
made with love <3

Open for work

23:45

Let’s build the next big thing together.

© 2025, DarkPlayer
made with love <3

Open for work

23:45

Let’s build the next big thing together.

© 2025, DarkPlayer
made with love <3