Philm Takes

Well my first blog, and you’ve probably found it through my redesigned and upgraded web site, so for my first blog I thought I’d talk about the experience of the upgrading and redesigning the site.

The former design had been around for about 5 years and whilst much of the information about steadicams was still relevant the technology for video delivery over the internet has improved enormously during this time. This area was where I could see the most need to upgrade the design. I used CSS for the layout this time, which went well with standards compliant browsers but not being a web developer I struggled with the necessary patches for correct layout in Internet Explorer, its still not quite right but it’s almost there.

The old site used small Quicktime files only 240px by 180px, as a cinematographer showing his work this was not ideal. Also Flash is a delivery format more widely accessible across browsers and computer operating systems than Quicktime. I had tried using Flash for the video elements 5 years ago but back then the quality of flash video just wasn’t there, the file sizes were bigger than Quicktime and faster internet systems were less common. Flash however has come a way long since then.

The redesign took about six months, busy periods of video production were the main cause of delay and I spent many hours spent experimenting with video compression and Flash to find the best optimal quality video for file size. Looking at the Google Analytics tracker than I run on my website I was able to deduce that most visitors are using Flash 9 or 10, in fact 98.8% of them. This meant I was able to do some comparisons between the flv and H264 Quicktime codecs for the video compression, these are both compatible with Flash 9 and higher. What I found was that, generally, the quality when using H264 was slightly better (and the file size slightly smaller) than flv. For my purposes the quality of the video is a very high priority. Also more and more of my video work these days is for internet delivery so I need clients to be able to see how good the final results can be. Compressing to the flv format I found areas of intense detail in a moving image were more prone to a “fuzziness” or “blockiness”, such as on the road surface at the beginning of the Ben Lee, Something Borrowed, Something Blue clip on my steadicam reel page (last clip on gallery). This is one of only two videos compressed to flv on the site, the other is the ”Wines of Italy” on the cinematography reel page. I’m unsure why, but both these videos displayed glitches when loaded into Flash as H264. It’s interesting that they are the two longest clips on the site and both had to be cropped on left and right sides to remove black edges. The images are now 600 pixels wide, almost five times the screen size of the former Quicktimes, but less than twice the file size.

For creating the H264 files I used Compressor, part of Apple’s Final Cut Studio 2 suite and I used Adobe’s Flash CS3 Video Encoder to create Flash Video. Of the two systems I found Flash Video Encoder a more user friendly system, perhaps because it’s designed to only create a single format, where as Compressor is designed for many forms of video output. Both systems though gave me the ability to crop to the edge of images that were originally letterboxed in a 4:3 frame.

I’m no expert with Flash and being visual creative with so much Action Script coding isn’t my thing. The site went through a couple of layouts that I wasn’t happy with before I found SlideShowPro. This Flash based application made it easy for me to create the video and still image slide shows you see on my site. Online information is very good and I was able create customized slide and video galleries easily. Considering the hours it saved me and the formatting options the price of SlideShowPro was extremely good value.

Now I just need to work on the blog design.

Last but not least, I’d like to thank my partner Alison Ray for her encouragement, her expert knowledge of all things on the internet and her writing and creative contributions to the design of the site.