Here is a brief “how to” instruction in adding a transparent text, or image logo (jpeg instructions are at the bottom) to the lower right corner of your video using Quicktime Pro. These are also known as “bugs”.

How to add transparent text or a logo to your video in Quicktime

The following steps are the same for windows and OSX, the tutorial is for OSX users.

First, create a transparent image in photoshop choosing the size you want. Be sure you have a transparent background as shown
How to add transparent text or a logo to your video in Quicktime

Next, choose the type tool in photoshop, and type the text you want in the box as shown. You can change the color to any color, I have chosen white here:
How to add transparent text or a logo to your video in Quicktime

Then Choose “Save for Web & Devices” in photoshop

How to add transparent text or a logo to your video in Quicktime

When the next window pops up, choose png, and check the transparency box as shown:

How to add transparent text or a logo to your video in Quicktime

Then open the newly created png file with Quicktime as shown:

How to add transparent text or a logo to your video in Quicktime

Once you have the png file open in quicktime, then choose “movie properties” as shown:

How to add transparent text or a logo to your video in Quicktime

Then select the video track:

How to add transparent text or a logo to your video in Quicktime

Select the visual settings button, then choose “straight alpha” from the bottom left drop down menu:

How to add transparent text or a logo to your video in Quicktime

Close the window, then you should still have the image opened in quicktime in front of you. Click on the video anywhere (not play, just make the window active) to make it active, then select edit>select all (command a in osx), then edit>copy (command c in osx). Now close that quicktime window entirely.

Now open the target video (the video that you want to add the logo to) in quicktime, select edit>select all (command a in osx), then choose “edit>add to selection & scale” as shown:

How to add transparent text or a logo to your video in Quicktime

The text will then appear in the upper left as shown:

How to add transparent text or a logo to your video in Quicktime

To move the text into the desired position, you will need to complete a few more steps.

First select “Movie Properties” as shown:

How to add transparent text or a logo to your video in Quicktime

Then select the video track with the image in it, and click “visual settings”

How to add transparent text or a logo to your video in Quicktime

Now, to the right, play with the numbers in the offset boxes until you have the desired position

How to add transparent text or a logo to your video in Quicktime

After you have the desired position, click “straight alpha blend” in the drop down menu to the left:

How to add transparent text or a logo to your video in Quicktime

Now, you should have the completed video with the logo you just added.

How to add transparent text or a logo to your video in Quicktime

We still need to save the video, so choose file>save as:

How to add transparent text or a logo to your video in Quicktime

Name your new video, and choose the location you want, and save the movie as self contained:

How to add transparent text or a logo to your video in Quicktime

At this point, your video will play with the new logo in the entire video. Anyone can remove this track, so to make it permanent you need to export it using any compression method you might like. It is important to add the logo to the highest quality copy you have, so when you compress it, the quality will be better.

Please comment on any mistakes that I may have made in these steps, so I can correct them as necessary. Please link back to this page for future users. It took me a while to find how to do this on google, and I think this is now the best page to link to.

You can also add any image to the corner of your video (jpeg file etc) using the same steps, except skip the first straight alpha step, and use normal blend. Just use the normal image, no need to setup transparency in the beginning.

Use the comments for questions.

Dog out the window at Oceanside BeachI took down around one hundred of my own blog posts today because of the insecure nature of Flickr. Even with my recent addition of those pesky watermarks, there were around three hundred images that had no watermark.

Some of you think this is no big deal, and I understand. I still plan on selling my images at some point in my life, and with my images out there running around, I was a bit nervous after reading this article.

I simply marked my entire flickr account private from about April 2008 (that is when the watermarks started) back to when I signed up for flickr. I don’t blame this on flickr, but the nature of the internet in general. Now all my images will carry a watermark, and if they are posted elsewhere, then I will just consider that an ad for my site.

Thanks for understanding, I will repost much of my previous content with some meaningful articles, and new content.

Thanks,

Tony

High def video for the web is at least 960×540 in my opinion. DVD resolution is 720×480, and that is considered standard def.

There are several programs that will encode high def source video for little or no cost. I use VisualHub, and iMovie on Mac OSX to encode most of my video. I use iMovie to edit when necessary, then I compress with VisualHub, I think it does a better job than iMovie.

On Windows there is a free compressing program called MeGui. For editing on Windows, I recommend Adobe Premiere Express.

Here is an example of my current work flow on Mac OSX Leopard 10.5.3:

Computer: MacPro Quad
Software: Quicktime 7.5, iMovie 7.1.1, VisualHub 1.33.1
Camera: Panasonic HDC-SD9

Step 1: Import the raw video from the SD card (I use a card reader, not the camera) into iMovie at full size (it gives you the choice of 540p). iMovie will detect the reader as a camera after a few moments, be patient.

Step 2: Edit in iMovie as needed.

Step 3: Export with the following settings; Share>Export using Quicktime>Movie to Quicktime Movie

Video Settings: Apple Intermediate Codec, current fps, HDV 720p (use whatever size you like), no filters, size set to current.

Audio Settings: Linear PCM, Stereo 44.1, normal quality, sample size 16.

Step 4: Encode with VisualHub set to the settings in the images below:

VisualHub


visualhub2

You can use whatever size in VisualHub you want, but make sure it is the same or smaller than the source video that came out of the edit process.

VisualHub will also encode flash, but here you see h264 settings for mpeg4. Flash is more widely used, but mpeg4 via Quicktime player is higher quality.

I will cover how to write the code to embed all types of video on your site in a few days, stay tuned.

Tags: high definition, SD9, VisualHub, embed

Hosting may not be the first thing that runs through your mind when you think about putting video on your website, but I can assure you it is very important, and that is why I consider it a critical step in the process. Video files can get quite large, and high definition video is even worse in terms of file size.

The two concerns with hosting are storage space and bandwidth. I use Libsyn to solve both of these problems. Libsyn does not have any bandwidth limits, and they only limit storage space to “so much per month”, but no limit to the accumulated storage space. Their servers are also set up as a content delivery network, so the speed is always pretty good. This works fine for me because I don’t upload tons of video every day, and the monthly limit works out well for me. When the file reaches 30 days old, it goes into the archive folder and remains on their servers indefinitely. You might have unlimited bandwidth and storage on your web server, but I guarantee that in your terms of service there is something along the lines of “we reserve the right to shut your site down if it takes up to many resources”. The unlimited bandwidth and storage are just come-ons. If your site is not very busy, then you should be fine, but if one of your videos becomes popular, then you may get shut down regularly. There are other solutions to bandwidth and storage, but I believe that Libsyn is the way to go. Maybe try your own web server first, and just keep an eye on it.

Stay tuned for step two, encoding your video.

I promised to explain how to post high definition video to your blog, or website, so here goes.

There are three basic steps or “pieces to the puzzle”, if you will, to embedding, or posting high definition video to your blog or website:

1. Hosting

The first thing you need to solve is the bandwidth concern. If you have an unlimited bandwidth and storage plan from your webhost, then you are good to go, otherwise you will need to find a place to host the actual file, and be aware of their bandwidth limits, or rules.

2. Encoding the video file

In my opinion the most important thing to video on the web is the quality, and size. Now being a photog, my tolerance for bad video is pretty low, so I have to admit, I am pretty picky, and I will tell you how to be picky, and quality minded.

3. The code itself

Once you have solved the hosting, and have the video ready to go, then you obviously need to post the video to your website. I will be showing you how to do that as well.

I need to break up this article in several steps mostly because I don’t have the time to bite this off in one article, and your attention span is only a couple of paragraphs anyway, so stay tuned over the next week or so, and you will become a high definition video posting expert.

Next Page →