Amazon MP3 Player, Google Music, SugarSync, Spotify—it truly seems like it’s the year of the cloud-based music player. But oddly enough, Dropbox, our favorite cloud backup / storage / filesharing service, doesn’t natively support streaming music. I spent weeks looking for something that would let me stream music from my Dropbox folder but didn’t find anything truly satisfying. So, I decided to make my own Dropbox cloud player. I call it groovyBox. Check it out.

Update 9/25/2012: Hey folks, sorry to say, there have been some updates to Google Chome, Firefox and Internet Explorer and Dropbox that have temporarily broken groovyBox. A fix is pending, but for now, it looks like groovyBox is down. If you’d like to be notified when a fix is available, go ahead and Hey folks, sorry to say, there have been some updates to Google Chome, Firefox and Internet Explorer and Dropbox that have temporarily broken groovyBox. A fix is pending, but for now, it looks like groovyBox is down. If you’d like to be notified when a fix is available, go ahead and sign up for our newsletter . We’ll make a new post and update this page when everything is shipshape. Sorry for the inconvenience.

Introducing: groovyBox Cloud Music Player

groovyBox is a very simple, lightweight web app that is designed for Dropbox, but will work on any web server.

Feature highlights:

Supports: .mp3, .m4a, .ogg, .wav, .webm

It’s free as is Dropbox (First 2 GB is free and you can get up to 10 GB of free space)

Dropbox (First 2 GB is free and you can get of free space) You don’t have to give your Dropbox credentials to a third-party service

International-friendly. Works in any country that Dropbox supports.

It’s portable. Something better than Dropbox comes along? You can take your groovyBox with you.

Works on the iPhone . You can even play it in the background, pause or play by double-pressing Home.

. You can even play it in the background, pause or play by double-pressing Home. No invitations required. Come one, come all!

Works from any browser. No plug-ins required.

The idea for groovyBox came from an earlier tip I discussed: How to Host a Website on Dropbox. groovyBox is essentially a webpage that pulls music files from your Dropbox Public folder. Once you setup groovyBox, you’ll get universal access to your songs from any computer with a web browser. No logins, no plugins, no nothing. Keep the link private or share it with your friends. It’s up to you.

But enough preamble. Click here to see my groovyBox player in action:

Another important aspect of groovyBox is that everything remains in your control. You don’t have to give your Dropbox password to a third-party. All the moving parts of the groovyBox player are contained within your Dropbox folder and can be edited, removed or copied at your discretion.

As for storage space, it all depends on how much Dropbox storage you’ve got. If you’ve upgraded to a Dropbox Pro account, that’s great. But I also have it on good authority that you can get at least 10 GB of Dropbox space for free.

Streaming Music from Dropbox with groovyBox

There are two main parts to groovyBox: the player itself (an HTML page) and an XML file that tells the player where your MP3s are. I did my best to make the process of getting these two gears to mesh as user-friendly as possible, but this is a groovyPost, so you’re going to get step-by-step instructions anyway.

Step 1

Download and install groovyBox. Important: Make sure you that you install it to your Dropbox Public folder. Oh, and I guess I should mention that you should have Dropbox installed already. Use my referral link if you feel like it.

Step 2

Copy music files into the groovyBox folder. I created a music folder for you to use, but you don’t have to. groovyBox scans the root and subfolders for the location where you installed it.

Step 3

Run groovyBox.exe. You have to do this locally from a computer with Dropbox installed, obviously.

There are a number of settings here, but leave them as they are. In later versions, you’ll be able to make multiple playlists, but for now, changing the XML output location will break it. Click Generate XML.

If all goes well, it’ll put a file called songs.xml into the guts folder. Click OK.

A quick note: What you’ve just done is told groovyBox where your music files are. So, if you add MP3s or move them around within the folders, you’ll have to complete this step again. I know that’s a bummer, but it’s for security purposes—if groovyBox could alter your Dropbox files via the web, then who knows what could happen. The web accessible portion of groovyBox is read-only.

Step 4

Right-click groovyBox.html and choose Dropbox > Copy public link.

Step 5

Paste the public link into your browser. Go ahead and bookmark it while you’re at it. (You have to view it on the web, otherwise it won’t work. If you just open it from your hard drive, you’ll get an error.)

Now, you’re good to go. There are two modes: Play All (with shuffle) and Play Album.

If you guys like groovyBox, I’ll work on making it a bit more full-featured. But for now, try it out and tell me what you think!

Tips and Known Issues

Your music will not play until all your music has been synced with Dropbox. Your wait may vary depending on your internet connection speed and the number of songs you sync.

Your music will not play until all your music has been synced with Dropbox. Your wait may vary depending on your internet connection speed and the number of songs you sync. You can bookmark specific albums for quick access.

The groovyBox guts are very small. So, if you want to create shareable playlists or mixes, you can just install multiple instances of groovyBox into your Dropbox folder and bookmark the public links.

The XML generator is heavily reliant upon proper music file information. You want to have the Artist, Title and Album filled in otherwise it may not work properly. Also, avoid having multiple contributing artists since this fudges things up. If you experience difficulties, you can just change the info from Windows Explorer by Right-clicking and choosing Properties and then going to the Details tab. This is the most reliable way to get the information squared away.

and filled in otherwise it may not work properly. Also, avoid having multiple contributing artists since this fudges things up. If you experience difficulties, you can just change the info from Windows Explorer by Right-clicking and choosing and then going to the tab. This is the most reliable way to get the information squared away. Make sure that all of the files are synced to Dropbox before trying to use groovyBox. Then, make sure you refresh the page. You may need to clear your cache or close and re-open your browser.

If you want to use groovyBox via your mobile phone, I would recommend shortening the link first.

The groovyPost team has been having a blast playing with groovyBox and we hope you enjoy it as well. It’s a work in progress and far from perfect so if you find any issues or you need help, feel free to drop a note below in the comments.

groovyBox Links: