It's a problem when I lack the proficiency to even create gradients in photoshop! However, I can create gradients all day with CSS.

Don't read too far into this comment though, this was purely something fun I wanted to attempt.

If you're finding Photoshop difficult try Fireworks. It's easier for basic web stuff like gradients and simple shapes.

Hah, that looks incredibly sad. They look a lot better on IE9 though! (besides IE9 not having radial gradients for the Apple logo)

Thank you for the kind words! For each one I started off pinpointing the toughest areas/curves to create, and then worked off that. There's a lot of thought behind which layers to place first so that subsequent layers can mask over spills or imperfections, but beyond that the rest is pure trail and error.

heh, here's a hacky idea ;) Take a PNG, base64 encode, compress and gzip your js template into it, let it create the same css3 code, but by using javascript. This works by putting the png into a canvas... here's a guide ;) http://creativejs.com/2012/06/jsexe-javascript-compressor/ and http://iamcal.github.io/PNGStore/

haha, you could save angular.js, your css,html and image sprites into two or three png's. :P

Hey are you still with me? We could theoretically go further, there are no guarantees though. We'll use "Multiphase Compression". Uncompression is slow, but we only care about space, let's hope we save more than we use.

Step 1: Store css/html/js into the png as mentioned above. Then look for a "minimal" fractal image compression library written in C. Run the png through the fractal compressor.

Step 2: Save the output into a Javascript ArrayBuffer

Step 3: Now convert the minimal fractal compression decoder to javascript using Emscripten. And store the output into a png again. Then decode the javascript from the png and let the fractal decoder create a png out of the ArrayBuffer. Then extract the js/html/css from the png that we just generated on the client-side. We now have the final data. We can let it remove all unnessary js after saving the extracted data into html5 localstorage.

Awesome work.

My only disappointment was not seeing the Twilio logo in there.. but realized it would be too easy to be challenging. :)

yeah, amazing work ++

Hah! I've been building something similar for personal use: http://bchanx.com/jukebox

I also like your interface, props!

Your's is pretty slick too. Are you going to keep working on it? Why did you create your particular player?

I give it some love whenever I have some spare time!

Mostly built it so I could generate playlists purely with songs that I enjoy, and be able to easily access that from anywhere and on any computer. I figure you're coming from a similar angle? :)

Yup! Same idea. Easily create playlists and share them. I decided to go with updating the address-bar instead of storing playlists server-side. That has it's limitations but saves me from storing anything on the server, for now.

Yours looks like you're going with accounts creation instead, which might end up being something I'll have to do.