APF Manual

How do I load videos on my site?

You can use the video upload tool just like you would with photos but any videos over 50MB need to be uploaded using an ftp client (fetch, cyberduck, transmit). Your FTP access was sent you in the welcome email. Videos go in httpdocs and then the videos folder.
NOTE: Video names can only have letters, numbers, underscore and dash in them. Try to keep it simple to avoid problems.

How do I upload a thumbnail?

Videos must be assigned to a gallery first then you browse your desktop for a thumbnail (make a screenshot of the movie beforehand) and hit upload.

How do I get videos to display on my site?

Create a category then add a gallery to it. Hit the anchor button if you want clicking the category to open the gallery or add as many galleries as you want. If you want a space create a blank category.

What are the recommended settings for video?

Around 650 pixels wide (smaller for faster playback and larger if you want a bigger picture).
The video should be exported as either a mov, mp4 or m4v and MUST have h.264 compression enabled.
800 - 3000 kbits/sec is the recommended data rate and keep in mind the higher you go the better quality the video but the slower the playback will be depending on the viewers connection speed.
Audio should be 48.000 kHz AAC.

Make sure you select “Prepare for Internet Streaming” and Fast Start so the video will begin playing immediately.

If you are using Final Cut Pro and Compressor there an excellent article about encoding (here).

What video formats are supported?

mov, mp4, m4v and flv (you must use h.264 compression or it will not play). NOTE: We do not recommend flv because it does not play on the iPad or iPhone.

Can I add more than one video to a gallery?

Yes, you can add as many as you like. Visitors will hit the next button to see the next video or look at the thumbnails to decide which one to watch.

Common Problems With Video

I have the video on the page and can hear it but there’s no picture: You must have the latest codec and use the h.264 compression or you will not see the video picture. The easiest way to do this is to encode your videos using quicktime pro and choose h.264 compression. Also, sometimes with very large videos there is a delay with the picture loading and if you hit pause and try again it will correct the problem.

I uploaded the video using the video upload tool but it doesn’t appear in the video bank: Your video is too large to use the upload tool please use ftp to load the video into the videos folder on your site.

Video is playing but there is no sound:
Audio should be 48.000 kHz AAC. Other formats will work but we’ve found this always works.

How Do I Add Captions To Video

Adding Captions at Cue Points:

To add captions at specific cue points, use minutes:seconds in the 00:00 format. Each caption must be delimited with a vertical pipe ( | ). To add only one caption you still need a time stamp. To have it appear at the beginning, use 00:00 Caption…

Example:

00:15 This is a first caption example. |01:25 And this is a second caption. |01:45 This is a third caption.

Note 1:

To end your captions place a pipe, then the end time code, then a pipe (|01:35|)

Note 2:

To use the new caption customizations each customization string must be inserted for each caption directly after the space before each caption

Advanced Video Tips

I asked Ben Van Hook how he encoded his excellent looking directors reel and here’s what he had to say:

First I would consider this article by Ken Stone to be a must read for anybody trying to get video to look good on the apf site. :

http://www.kenstone.net/fcp_homepage/compressor_h-264_movies_fcp.html

He says at the end of the article that getting good video for the web is a bit of a black art, and I agree. Even after reading the article you have to test small pieces of video (by setting in and out points on the timeline in Final Cut Pro) and see how the video looks played back after compressing it.

H.264 compression is the way to go and I really like compressor for performing this task as opposed to just using quicktime conversion out of Final Cut. Compressor allows you to save custom settings, and has something called frame controls and filters that let you tweak the video even further.

I’ve attached 4 screenshots that are looks at the settings I use for HD material I’m saving for the web. Notice I’ve gone into frame controls and set the resize filter to Better, the output fields to Progressive, the deinterlace to Better, and the rate conversion to Better. All this keeps the size down, but the video still looks good. Notice also i’ve gone into the filter pane and clicked on blackwhite restore and moved the slider to 7.5 on the black, also gamma correction is checked and it should be set to 1.2 (this really helps keep the punch in the video because the compression sometimes washes out the color/look of the vid.

I know the whole compression thing is a lot to bite off for most folks, but if they methodically just go through the steps, you can get good results… in my mind it should really be simpler, but unfortunately it’s not!

iPhone/Android Video

Because mobile phones have a limited screen size and bandwidth any videos you would like to appear on the iPhone/Android version of your site must be re-encoded and placed in a special folder on the server.

NOTE: If you don’t re-encode the videos the video tab simply does not show up (no big deal).

Here are the instructions:

Important: Video cannot have special characters (#,&) or spaces in the name. Must be named exactly the same as the video on your site except the extension will be different (.mp4).

Mobile encode settings:

video
file format: MP4
compression: h.264
data rate: 1000 kbps or less
frame rate: 24 (key frame 24)
optimized for: streaming (max packet size 1450 / 100 bites/ms)
size: 640 x 480 *preserve aspect ratio

audio
format: AAC-LC
data rate: 128 kbps
channels: Stereo
sample rate: 44.100 kHz

Newly encoded videos will be uploaded to the server using your ftp access (check your welcome email if you don’t have this). Inside the httpdocs folder (root) you will see a folder called videos_mobile. Place the videos inside that folder.

How Do I Embed Vimeo Videos?

You can now embed your vimeo videos on your APF Website. They will also play on the iPhone/Android and iPad versions of your site (Note: you must have the latest version of your design, after 11/6/2011)

Here’s how you do it:

1. Create a new text page and call it whatever you want

2. Visit the vimeo page of the video you wish to embed.

3. Grab the url of the video

4. Put the following as the only text on the page you created:

vimeo:http://TheVideoUrlYouCopied

5. Visit your template settings page to adjust the width and height of the embed (Note: it will scale to fit the screen up to this limit).

That’s it!

If you need additional help submit a support ticket.