How To Post Video on the Net; Part 1: De-Interlacing

20 03 2008

A huge amount of the video produced nowadays is going to be posted to the net. Video sharing services like YouTube make it simple and free to get video out to the world and on to your webpage. It’s pretty easy to do it well and make it look good if you know what you are doing.

So, you edited a 10 minute clip to advertise your up and coming film and you want to post it to the net. If you try to post the highest quality version you will find that most video posting sites will bounce it back at you because it is simply too large. You would think fixing the problem would be as easy as doing an output in a lower quality, and, that will work.. however, there are a few tricks to doing it so that your video is small enough to post, AND, still looks good.

To help out we will be doing a three part article on understanding the basics of how web ready video works. Starting this week with an article on ‘Interlace vs. progressive’ Video, and followed by a look at compressiona and we will wrap it all up in a couple of weeks with an article on pixels and size issues.. including how to letterbox your video.

Interlacing? What is it… and for that matter.. what the heck is ‘progessive scan’??

Before you output your video (using quicktime or compressor or whatever software you use to make the file) there is a simple step that will solve a whole heck of a lot of problems. You need to ‘De-interlace’.

We can go in to a lot of detail here, and there are huge primers out there that help explain this in detailed technical terms for you… but lets try to explain this whole ‘interlacing’ debaucle simply.

TV screens (traditionally) work different than computer monitors. TV screens use a system called ‘Interlacing’. Simply, interlacing uses two lights to scan an image on to a screen, and before it is finished scanning the first image, the second ‘light gun’ starts on the next image in the series, and before that second ‘gun’ is finished it’s job, the first ‘gun’ starts on the next image.. and so on and so on. By weaving (or ‘interlacing’)those two images together TV’s can scan up to 29.97 images on the screen per second giving the illusion of motion. This is all due to that ability to ‘interlace’ (or at least it was until the technology changed in the last 20 years). Film accomplishes the same feat by flicking 24 full screen images per second on the screen. 24 frames per second (or FPS in film terms) is pretty much the minimum required to fool the human eye in to seeing things move. Although interlacing allows us to put more images up on the screen in a second, film is more ‘true’ to nature, and in the process of interlacing we take away the clarity of the image by spacing it out with the next image in the series. Televisions work like a printer, printing one line at a time, and there are only so many lines it can put on a screen, when we interlace it we use half those lines for one image, and half for the next… if we could use all the lines everything would be higher definition.

A computer monitor on the other hand , doesn’t use interlacing. When computers where developed the technology had improved and the computer didn’t need to show that many images a second. Computers used a different type of technology called ‘progressive scan’. In this case, it worked more like a film, it put up a new image as it was needed, at a maximum speed of about 30 fps. Once again, we can go in to a lot of detail here, but this simple explanation will do what is required.

Interlaceing at work

That technology was slowly improved upon over the years and as it got better we could squish more and more lines on the screen and more and more colors, eventually the ‘progressive scan’ computer monitor could show television images. Eventually video could be shown on a computer monitor the same as film.. and now we have cameras that can shoot in progressive scan. However… the problem is that most video technology, hasn’t caught up, and we are left with some of the relics of the TV age. On top of that, HD video also uses interlacing, so that it can show 60 images per second, giving HD superior image quality. Now we have a huge variety of camcorders and screens that all use different image standards… NTSC video is shown at 29.97 fps interlaced, HD video can be shown at 30 fps progressive (30p) or at 60 fps interlaced (60i) or even at 60 fps progressive (the holier than though 60p!). When you shop for televisions they will tell you how many lines of resolution (the printer analogy again here.. think of it as light guns printing on the screen) and whether it is a progressive or interlaced device. Confused yet?? Ignore that for now, all you need to know is that most video, including your HD video is shot interlaced. If it isn’t, you have probably already done the research or read one of my other articles on progressive scan HD camcorders.

Note: There is an ongoing debate whether 30p (30 fps progressive scan) image quality is better than 60i (60 fps interlaced) and I will leave that up to you. (although personally I find 30p looks nicer on screen… more like film)

Great.. now what does all this have to do with YouTube?

You will notice the difference if you throw a dvd in to your computer and watch it on your computer monitor, it will look like little lines appear whenever someone on screen moves too quickly. We call all these extra lines and any glitches left behind ‘artfacts’. These particular artifacts are because the computer is showing two interlaced images at a time on a progressive computer screen. The computer screen was never designed to handle it and just shows both images at once! It is tolerable when watching a dvd on a plane, but you run in to issues when you pass interlaced footage on to YouTube to post for you… or take this image and try to compress it down in to a smaller frame or file size.

We will talk about compression types in more detail in the next article, but for now all you need to know is that when you compress an image that already has extra, unneeded lines of screen junk.. such as those artifacts left over from the interlaced image, the compression gets worse… it has to deal with the artifacts and it usually does it badly.

So how do we fix it?

The best way is to use a ‘de-interlace’ filter. Every decent editing program has one. In Final Cut you will find it under ‘Video Filters-Image Control’ and you should definatly keep it in your favorites box if you plan on doin a lot of video for the web. I would be hard pressed to imagine that any other decent video editing software wouldn’t contain the same sort of filter. It may take a bit of hunting, but I assure you.. it is there.

(edit: You will need to pay for a video editing program to do this. iMovie and windows movie maker DO NOT come with this option. However, Final Cut Express or Adobe Premeir Elements will have the filter. You can also find a few free programs out there that will do the trick, but at the cost of quality)

All you do is drag it on to your video clips like any other filter and render. No fuss, no muss. This Filter takes out the extra lines from the image and turns it in to a progressive scan image with a 30fps framerate, just like your computer screen. It literally takes one of the two images on screen and tosses it away. Tada! Now your footage is really at 30fps! Suddenly.. your clip will look that much better… and if your original image is clearer, it will look clearer when you compress it in to a web ready version.

before and after!

The other option (but not nearly as good) to fix the problem is de-interlace when you compress the video. Most video compression software will have a ‘de-interlace’ option that will do much the same thing as the filter for you. However, for the best results, use the filter in your editing software and then export (compress) the file. The compressor has enough to work on without having to deal with the interlacing, and the filter in your editing software is generally a higher quality.

So remember… rule of thumb. If your video is going to the internet, make it web ready by de-interlacing it. One simple step that makes it all that much clearer.

If you want to learn more about how all this interlacing/progressive/web video stuff works, I recommend starting with Adobe’s video compression primer. I really tried to keep the information simple here, so there is a lot more to it, and I changed a few numbers to make things clearer. If you really want to know how it all works, Read the primer. (Note: As Mr.Hollyn Pointed out in his blog… this primer is pretty dry stuff. Only read it if you really want to know the nitty gritty or have a good nap. W.R.)

Next week we will talk about compression and how it works.

The Animal

Advertisements

Actions

Information

4 responses

20 03 2008
Administrator.1

Found through WordPress recent items. I will make sure I look back. An interesting blog!

21 03 2008
Interlacing « H o l l y n - w o o d (Norman, that is)

[…] His most recent posting is the start of a new series entitled How To Post Video On The Web.  This part is all about interlacing, and describes how to get rid of it.  His approach to defining “interlacing” is a […]

25 03 2008
7 12 2008
SGBoise

I should have read your post before posting my video on youtube. http://www.youtube.com/watch?v=Ephp09I41yU

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s




%d bloggers like this: