Sharify

Sharify your Spotify

content

• Disclaimer
• Motivation
• Capabilties
• Product Design
• Auth
• How to gain Access ?
• Demo
• Preview
• Future Work

Disclaimer

• To be able to login with spotify and use the app, your email should be added to the app's allowlist that's because Sharify currently on development mode.
• To add your email to Sharify's allowlist reach out to Ahmed Ghonim.
• To get a glimpse of what Sharify has to offer, here are my Top Tracks as recorded on Apr 23.

Motivation

I've always loved the Spotify wrapped at the end of the year to get reminded of my top tracks and artists of the year. What's even more fun is sharing your top tracks and artists with your friends.

Sadly, Spotify Wrapped comes out only once a year, so I thought it would be fun to build a tool that gets your Spotify top tracks and artist of the last month all year and allows us music freaks to share, preview and save these tracks seamlessly.

Another thing I always wished that Spotify allows sharing is your liked tracks In your library. Currently, you can't share them or even save them to a separate playlist.

Capabilties

Sharify offers the following :

• Get your top tracks and artists from your last month on Spotify.
• Get your all-time liked tracks on your Spotify library.
• Preview your top tracks, top artists, and liked tracks seamlessly on Sharify.
• Save and remove specific tracks to your Spotify library.
• Follow and Unfollow specific artists.
• Sort different tracks on the release date, popularity, and affinity.
• Sort different artists on affinity and popularity.
• Save your top tracks from last month to a separate playlist on your Spotify library.
• Save your liked tracks from last month to a separate playlist on your Spotify library.
• Share your top tracks, top artists, and liked tracks. Sharing is achieved by generating a preview link that your friends could open to preview and save your top tracks, top artists, and liked tracks seamlessly.
• Preview link works with any user even if they're not registered on Sharify.

Product Design

I'll sum up the most important design thoughts in the following points :

• The tracks are displayed in wide cards inside a n*4 grid to embrace the ease of use and add an aesthetic look to the page.
• The logo is inspired by the DJ CDs. it even has a rotate animation to mimic the movement of the DJ CDs
• I used the same Circular fonts that Spotify use along with their heart icons to add familiarity to the user experience.
• The preview zone is placed on the left side to inform the user about the current card they're hovering on along with some info about it like the genre, release date, and the popularity measurement.
• the background color of the preview zone gets changed as the user hovers over different cards to mimic a very known Spotify practice.

Auth

How Sharify Authorizes the users?

• Spotify offers different options to authorize users, but since Sharify is a serverless app, I went with the Implicit Grant Flow.

• The implicit grant flow is carried out on the client side and it does not involve secret keys. Thus, you do not need any server-side code to use it. Access tokens issued are short-lived with no refresh token to extend them when they expire.

• Once the access token is expired, the user gets prompted with a modal to refresh the access token.

How to gain Access ?

Currently, the app on development mode and only 25 people can log in and try it out but the generated sharing links is available for any number of users.

To gain access to Sharify reach out to me on Instagram .

Demo

As stated above the generated preview links are available to any number of viewers, so here are my Top Tracks as recorded on Apr 23 to get a glimpse of what Sharify has to offer.

Preview

• The website is currently hosted on netlify at https://sharify-gh.netlify.app/

Future work