UlQuery: A JQuery-powered tribute to Ulquiorra Cifer
Hi, I'm Rachel Nabors. One of my favorite comics (or manga) is Bleach by Tite Kubo. And my hands-down favorite character is Ulquiorra Cifer, a villain. He lives in a place called Hueco Mundo, a place of white sands, eternal moonlight, ghosts and demons. Tite Kubo likes to give each of his characters a theme song. For Ulquiorra, he chose Moonshield by In Flames, a death metal song overpowered by Spanish guitar. I normally don't like death metal, but I fell in love with this song, which, incidentally, you can play using the player to the left there.
I challenged myself to make a music video with this song using nothing but JQuery, my CSS skills, and my mad background as a cartoonist. I made a quick trip to Deviant Art to secure scans of watercolor paper, and after much color-adjusting, compositing, and creating many mockups, lo, this was born, a simulation of the view as you run across the sands of Hueco Mundo. I used JQuery to create multiple background animations with parallax. I have even included a playlist that starts with Moonshield (and I've added a few extra songs to the playlist as well). So kick back, space out, and enjoy the trip.
Resources and Credits
- Animated background image with jQuery by Jean-Baptiste Jung was a great place to start. Nice step-by-step.
- But it was Rebecca Murphey who pointed me in the right direction with objects and arrays (so the script could handle more than just one background).
- I used Changeweaver's watercolor textures to create the sands, hills and sky. I used only two or three of them in the project.
Resources and Credits
- Needs a loading screen to preload all the images.
- Would like the music to start automatically, but I don't know if I can do that with Grooveshark.
- I'm thinking about adding animated whisps of sand mists using this tutorial.
- Might want to add a stop/start animation button.