Seleziona Lingua
Seleziona Audio
Forest Day8D
Forest Night8D
Snowy Mountain8D
Rainstorm8D
Cavern8D
Seleziona Tema
Dark
Aa
Light
Aa
Come una Bimba
Aa
Carta da Zucchero
Aa
Submariner
Aa
MGS3
Aa
Matchfy

Matchfy

Cliente

Paolo Mantini

Ruolo

Product Designer

Stack Tecnologico

React, MongoDB, Koa, Node.js

Matchfy is the first platform that connects Artists to Playlist Curators and allows its users to promote their music on Spotify.

On a side note, the platform was previously called “Spotimatch” but we had to change the name and the color palette from green to blue, due to Spotify policies.

Matchfy Device Mockup

The cost of producing music is much lower today compared to a few decades ago. Tools are cheaper, the internet has democratized access to education and lowered the entry barrier for artists that want to publish their music. On the flip side, getting your song popular on Spotify has become more and more difficult.


Reportedly, 40.000 new songs are added to the platform every day, making digital promotion crucial to music artists.

We have worked on the landing page and a presentation. Unfortunately I wasn't able to develop the user interface of the platform from the start, but I tried to integrate my ideas into the existing codebase at a later stage. The goal was to improve the user experience by iterating on the look and feel of the app without altering its logic.

I did not have the freedom or the time budget to build components from the ground up, therefore I had to work with the appearance of the existing ones. For example I couldn't change UI patterns such as modals or select inputs but I could improve on the user interface, visual feedback and animations.

Matchfy Screens Mockup

It would surprise you how much you can improve usability just by working on color and spacing. I introduced variables for color, border radius, CSS transitions times and curves, allowing for a more consistent user interface and cleaner code base.

Basic tweaks such as using color to highlight call to actions, give more room to page sections and adding simple animations on hover can make a huge difference. Details that seem unimportant all add up to the user experience. Icon alignment, margins, border and shadows are powerful tools: you can either get away with the phrase "the average user won't notice" or make every pixel count. People using your product on a subconscious level will feel something is off. Design is not about fancy color or animations but it's how the product works.

“Design is How it Works”
Steve Jobs
Matchfy Screens Mockup

Adopting a dark color scheme was also a fairly new thing for the time — nowadays "dark mode" is almost considered a must-have feature — but we were confident it was going to appeal to our userbase: artists and playlist curators on Spotify. If you're spending time in a dashboard searching for playlists and writing pitches, you might as well do it reducing the strain on your eyes. By the end of the update you would think you were using an entirely different app, just by re-arranging and styling UI elements.


Good design doesn't get in your way and numbers seem to prove this point: in two years we were able to scale the platform to 1.7m users and 2.4m playlist submissions, with almost 90k collaborative playlists.
Matchfy Screens Mockup

A big part of the music industry — or any industry for that matter, like it or not — is social media. While promoting great artists and getting dozens of music certifications, Matchfy as a service needed to step up its game in communicating its features and success stories.

That's why I have developed a system for producing digital content in an efficient way. I started with Instagram posts and stories, designing a custom social media kit template in Figma. Providing the image and caption text, you can easily tweak layers by adding a background, overlays, changing logo position or accent color. This approach maximizes speed while keeping brand consistency.

The same philosophy was applied to video, I started by creating a simple animation in Adobe After Effects, organizing each element in compositions. I had the following structure:

  • Main Background
  • Title Text
  • Particle Background
  • Release Cover
  • Audio Track

The animation worked pretty good on social media: they were performing well and the promoted artists were enthusiast. We still had an issue keeping up with the amount of new weekly releases. Each video was requiring too much time and effort to make. We had to improve on automation, therefore I created a "control" adjustment layer linking the main parameters in the various compositions.

From a single panel we were now able to change the color for text and background, the hue and exposure for particles and enable/disable overlays. Not bad but I decided to go overboard with it, writing a script that automatically downloads the album cover from the music streaming services.

Matchfy After Effects Template
The manual operations still include changing the text for title track/artist name and syncing up the audio, extracting 15 seconds from the full track. The initial project setup was tricky but we managed to cut down the time to export a video from 25-30 minutes to 10-15 minutes, for a 2x improvement.
Overall this system proved to be working very well, maximizing the outcome with minimal effort. Next step will be iterating on the current work and creating different template variants for music certifications, releases and news.
Gold Certification Example
Platinum Certification Example
New Release Example
Lessons Learned

This was a life changing project also for many reasons, especially from a business perspective. Here’s some lessons I learned:

  • Working with constraints is easier: you would think otherwise but if you reduce the scope of your work you can focus on the variables you have control on. When you have "total freedom" you have to come up with your own decisions and trade-offs. In my experience if you are not working with limits it probably means that something isn't right.
  • Reasoned effort can lead to big results: it's often easy to dive right in the design process, have fun and get a cool output. But is it efficient and sustainable over time? Can it be improved and customized? Developing a system instead of a single outcome is hard but is much more rewarding in the long run.
There's still much to do but this project has allowed me to get creative and improve across a wide set of skills, from coding to visual effects.
Dopo tutto, si ha una sola vita.
Tanto vale realizzare qualcosa di grande.

Contattaci e sentiamo le tue idee!