Make a Simple Music Player in 15 minutes!

Alex · May 24, 2019, 7:40am

Hi Intuifacers,

I’m sharing an experience that shows how to quickly make a simple music player.

The structure is pretty light:

mp3 files are hosted online (I’m using free files from https://www.mfiles.co.uk/)
references to this files are stored in an Airtable database, like this

In the Intuiface Experience, we have:

a Carousel, positioned out of the scene, using Airtable as data feed and just displaying name and url on each element
an Audio Interface Asset, out of the scene too, that will play the music on focus in the Carousel
a music player, made with Toggle Buttons for controls, with triggers and actions

When the Experience starts, first track is played, you are able to Play/Pause, go Next/Previous, and as we are using a Carousel for sequencing, they will cycle and after the last track, it will “automagically” move the first one.

Here is the Experience, enjoy the music!

Community-JukeboxHostedMP3.zip (6.0 MB)

bomee.lafitte · May 24, 2019, 8:40am

Wow! is this how you made this one?

Alex · May 24, 2019, 8:44am

Oh no, this old one was a loooot more complex and using Google Youtube API (to get the sound/video) + Last.fm API (to search Artist/Albums/Tracks).

Unfortunately, as these API evolved (with quota limits, advertisement etc), I had to dump this personal project.

But I’ll be back, my dream is to have a version fully based on Spotify

Frank.Yoder · May 24, 2019, 2:51pm

Super job Alex. I love it!

AlexB · May 28, 2019, 7:34pm

I had no idea the audio asset could play links/stream audio! This is something I’ve really needed for a long time lol. For some reason I thought it would only play local files…

Thanks so much for sharing this, I’m going to download and save this IMMEDIATELY. Nice job!

abijaudi · August 24, 2020, 5:11pm

Any update on that Spotify integration? I tried using IFTTT but its not working.

Promultis · August 24, 2020, 5:29pm

You could have a go at integrating the Rest API for Spotify in the API explorer?

Alex · August 25, 2020, 7:52am

I confirm Spotify API can be integrated in Intuiface using API Explorer, unfortunately, it “only” allows to make search and find data about artists, albums and tracks but the main purpose, i-e play music is not simply available.

Sometime, Spotify provides a 30sec audio sample, and not for all tracks, even with a Premium Account

Promultis · August 25, 2020, 8:15am

I’ve seen something on which you can embed an Iframe from Spotify this can be a play list or from an artist, this could be one solution?

Alex · August 25, 2020, 8:17am

Actually, that’s exactly what I did in my test XP
But even there, you will only get 30sec sample, unless you want user to authentify in the HTML Frame Asset or Web Browser Asset.

Promultis · August 25, 2020, 8:20am

Okay upon some more digging Deezer according to the documentation should allow what we want? Here’s what it can apparently do:

The Deezer API allows developers to:

Discover over 30 million tracks
Create playlists
Share favorite songs

Search songs by:

Album
Genre
Artist
and other details

So it’s got to be with a shot?

Alex · August 25, 2020, 8:21am

Be my guest and tell us what you found