Double Rainbows (Blippy Edition)

Between releases and late night coding sessions, the team here at Blippy likes to enjoy the fruits of viral internet labor. Like other folks on the internets, we were witness to the double (sometimes triple) rainbows phenomena (photo of our first viewing). As the photo suggests, we had a grand time with it. To commemorate this fine moment in internet meme’ory, I decided to replace our standard 404 page with something more dandy, cause hey, there’s no reason why error pages can’t be wrapped in fun :).

Go here to see it (and make sure to click on the unicorn… multiple times).

For the nerds out there, I employed a few CSS tricks I learned over the years. First, all the rainbows were built using cropped border-radius‘ed divs with our Blippy colors. Next, combined a healthy dose of jQuery animate queueing, CSS slants for the speech bubble (which I learned from my homegirl Yi MacLeod), PNG8 w/ alpha antics to reduce the file size of the background images and IE support, some childlike wonderment, and a fascination with unicorns to produce this wonky error page.

We had some other ideas to make this error page fancier, like parallax effects and underpants gnomes running about, but we’d rather spend time on Blippy and not on a page you’ll hopefully never see :). Take a gander and let us know what you think @blippy.

– Huy Hong

Update 1: Oops, had 6 rainbows rings initially but Judah Nielsen pointed out 7 is the correct number, fixed 🙂

%d bloggers like this: