<?xml version="1.0" encoding="utf-8"?>
Open full project

My role: Lead Designer

Cora Music powered by STIM 1

Cora Music powered by STIM 2

Cora Music powered by STIM 3

Cora Music powered by STIM 4

Summary

Cora Music is a SaaS subscription music platform owned by STIM, operating under its own brand and strategy.

Cora Music offers, in exchange for a monthly fee, online video creators on YouTube and METAs products (Facebook, Instagram etc), to use copyrighted "official" music in their videos/content, without the risk of running into copyright issues.

Happy path in short

A user visits https://coramusic.com/ and registers an account.

They then connect the YouTube channel they want to publish videos on that contains music from Cora Music. This is done via API and is a very straightforward process, including a free trial before committing to the monthly subscribtion.

While subscribed, the user can download (and thus generate a license) for any of the 20 000+ songs in the repertoire. They then use the song and edit it into their video/s.

When publishing the video, the Cora Music application will identify the video and content via APIs, resolving claims via the YouTube algoithm ContentID, ensuring the creative freedom of the (in this case) YouTuber.

The end results is elevated YouTube video content that includes music that you'd hear on the radio - something that enhances emotional connection, storytelling and engagemeng with the content.

Design System

Cora Music powered by STIM 5

The visual brand and guidelines was created by a studio called Perfect Fools

The guidelines was adapted and matured into a web based component system that I've led for the last couple of years. This included creating an ambitious component library that would be easy to work with, maintain consistency and align with the visual and emotional brand of Cora Music.

Sometimes this meant just creating something legible, accessible and straight forward - and at other times it meant the presentation had to be more experimental or engaging in order to differentiate against competitors.

Adjustments to the typography guidelines for mobile

Only minor adjustments was necessary to ensure a more forgiving design with varying title lengths on watch pages in the app.

Cora Music powered by STIM 6

Playful brand, atomic design and functional execution

Cora Music is a creative, playful and friendly brand. The colors are vibrant, bold and represent a wide are in the emotional space.

I've utilized this to tie specific features in the app to specific colors. For example, all Genres have subtly blue hover states, while moods have a different color

Cora Music powered by STIM 7

-> have a look at the interactive Figma prototype for the buttons here

The color interaction of the buttons haven't been implemented yet, but the idea is the bring the same colors into more components in an elegant way.

----------------------------------------------------

One of the main design/web components is the so called "Song Row", as its used in many places in the app and is the main control for actually interacting with the music. It comes with tons of prerequisites from a technical perspective; for example the waveform is not easily displayed however you'd like without commiting to lots of extra development costs.

Cora Music powered by STIM 8

Thusthe overall design has thoughtfully been presented with technical restraints or possibilities in mind, making the entire product very realistic and feasible.

Therefore, its not very chocking its been in production for a long time here.

Awsome project

Cora Music is nothing short of an awsome project.

The team at Cora Music and STIM are very motivated to create an excellent experience for their customers, transforming the music for video production into something more emotional and real.

It's a privilige to be part of that journey as Lead Designer.

Tools used

Figma
Maze
ChatGPT
FlowMapp
Notion

Topics

Share

Share your insights — leave a project review and help others grow their skills

Reviews

1 review


I liked the little colour pops behind the images and it was easy to get to the music at every step along the way which is the main thing after all.

Thanks Kevin, and certainly. A big part of understanding users is just having them reach their goal, which often leads to a less is more approach.

3 Claps
Average 3.0 by 1 person
5 claps
4 claps
3 claps
2 claps
1 claps
<?xml version="1.0" encoding="utf-8"?>