Warcraft Video: Hit the Road, Jack

Posted by Richard on

Another weekend project from World of Warcraft’s Azeroth Film Institute, my second video (to the tune of “Hit the Road, Jack” by Buster Poindexter) took about a day from start to finish to create — barely in time for my 24-hour deadline.

I am quite proud of the strong pairing of character animation to the lyrics that I managed to achieve in this video.

These are really fun to create, and they also serve as an interesting enhancement to the creative side of my online résumé.

Unlike my most recent “Another Girl” video, this one was created the more traditional way: the song was selected first, and then the video was captured and created to match the song. I like the results much better this way!

Production Notes

  • The off-beat timing of the footsteps that actually brings character and soul to Jack as he trundles off was at first unintended, or at least unconscious. It just seemed to fit.
  • The repeated scenes with black or white backgrounds were originally added as part of the storyboarding process. Normally, once storyboarding is compete, I replace the scenes with “live” shots from within WoW. The few fully black scenes hadn’t been storyboarded because I had no concrete ideas what to put in those places! I spent so much time playing with various camera angles of Jack hitting the road (like at 0:55 and 2:13) that I simply ran out of time for my self-imposed deadline. So I just left the blank areas and storyboards. In the end, I actually preferred the final result over my original vision.
  • Continuity issues: there were four identical scenes (at 0:16, 0:52, 2:09, and 2:22) that were unintentionally imported at double-speed. I forgot to readjust the timing before I duplicated the scenes, and there they stuck.

Fixing UNMOUNTABLE_BOOT_VOLUME Error

Posted by Richard on

I arrived home from work a week or so ago and discovered the oh-so-friendly and wondrous Blue Screen of Death on my Windows XP x64 Dell Precision 470, which bore the foreboding phrase: STOP 0x000000ED UNMOUNTABLE_BOOT_VOLUME.

Photo © Sean Galbraith

A reboot eventually returned the same error, but not before the (non)operating system at least pretended to start up and display the Windows OS logo. That made me somewhat hopeful since it was a sign that the hard drive wasn’t completely hosed. It was at least partially functioning, unlike the marquee at Toronto’s The Bay department store.

Dell has an extensive diagnostic utility included on a separate partition on the hard drive. If you are lucky enough to be able to access the partition, you can get a good sense as to what the problem is. I was lucky. The suite of tests (that ran through the night and well into the next day) only came up with two bad sector errors on my main C partition. One full day gone.

I determined that I needed to run chkdsk /r at a shell prompt to hopefully fix the problem. How lovely that the Windows operating system doesn’t natively self-diagnose problems when it boots up like every other major operating system does. A ding against Dell or Microsoft (whichever you choose), the OEM version of WinXP does not include the repair utility from the “advanced” startup menu. Worse, the PC also didn’t come with the OS install disks (Dell’s fault this time), so I lost another potential gaming night because I had to go to work to burn a bootable ISO from the MSDN.

Popped the disk in, reconfigured my BIOS to boot from the CD drive, rebooted, got my shell prompt, ran chkdsk /r, rebooted again, and everything worked just fine.

Oh, by the way, I bought a new Mac Mini the other day. A noob, I screwed up something, and the Mac rebooted and fixed itself. Nice!

Fixing IE6 Alpha Layers

Posted by Richard on

I generally prefer using PNGs to display images. They look better than GIFs because of the alpha-channel transparency, they compress much better than GIFs, and the color range is significantly wider and allows for smoother transitions and greater color precision. Plus, if you can live with the larger file size, they don’t have that lossy ghost pixelating of JPGs.

The problem is (what else?!) Internet Explorer, specifically version 6.X as it doesn’t support 24-bit PNG images with an alpha layer — which, of course, is what everyone wants on their web pages! So far, just about everybody and their grandmother creates “png.htc“, an IE-specific “behavior” component that fixes the alpha channel with an overlay. Then they apply a style class to the img (class="png") and then add a style to their stylesheet (.png { behavior: url('png.htc'); }).

Since I often use Firefox for development and testing, I sometimes forget to look for those easily overlookable details in IE. I still use png.htc files, but now I include a small script that searches the DOM for PNGs and applies the behavior style automatically, activated with an onload action (<body onLoad="fixBrowsers();">). It uses something called a Conditional Comment, a technique created by Microsoft, so it is sometimes praised and sometimes vilified.

Now I don’t have to remember to include the class for each image, and IE behaves the way I expect it to. Simple!

<script type="text/javascript">// <![CDATA[
function fixBrowsers() {
    /*@cc_on
    /*@if (@_jscript_version == 5.6)
      // add fix-alpha-layer behavior to all PNG images
      var array_images = document.getElementsByTagName("img");
      var array_pngs = new Array();
      var x;
      for (var i=0; i<array_images.length; i++) {
        x = array_images[i];
        if (array_images[i].src.substring(array_images[i].src.length -3,
            array_images[i].src.length) == “png”) {
          array_pngs.push(x);
        }
      }
      for (var x=0; x<array_pngs.length; x++) {
        array_pngs[x].style.behavior = ”url(’png.htc’)”;
      }
    /*@end
    @*/
  }
// ]]></script>

Now, if only the fixBrowsers function would magically fix everything that is wrong with IE6. Now THAT would be the most sought-after JavaScript function ever!!

Author’s Note: By now, given that even IE7 and IE8 are hopefully soon to be on the distant horizon, pretty much anything to do with IE6 is now hopelessly obsolete, as is my snippet of code above.

For any of you still interested in developing for IE5 and IE6 for some strange reason, check out the awesome IE7-JS library which pretty much does magically fix everything wrong with IE5 and IE6. (Thanks to Brett for pointing out that library.)