Recommended settings for EX-1 Web Video Delivery
 

I've pulled this piece together to show the compression/encoding settings I use for EX-1 web video (after 2 years of hard slog getting the optimum setting with various clients)

Encoding and compressing HD footage for the web- recommended settings - Spacedust Films

Hope it's helpful

Jon

Nice basic overview.
Do you have the link to the survey data that states the average internet connection is 2Mbps?
Interesting comments on Flash 8 vs Flash 9. One advantage of Flash 9 (H.264 video AAC audio) is that one often doesn't need to buy any Flash exporter at all. Flash 9 is often also called Quicktime 7.

You can hand someone an H.264/AAC file and it can be used in Flash, Silverlight, Quicktime. Flash 9 software is extension agnostic.

Here's Flash 9 H.264 info from Adobe
Flash Player:9:Update:H.264 - Adobe Labs
and here's the bit about extension agnostic
Flash Player:9:Update:H.264 - Adobe Labs

Flash Player will also support files derived from the standard MPEG-4 container format such as MP4, M4A, MOV, MP4V, 3GP, 3G2 if they contain H.264 video and/or HE-AAC encoded audio.

Flash 8 On2VP6 (Flix) is good but you can't beat not having to pay for the export software if you already have means to export H.264 AAC.

This is interesting to me as I now have a website created in an old Dreamweaver MX2004 (MAC) , and the video samples all use a Quicktime plug in , into which I put H.264 QT .mov files created in Compressor.
After reading this I scoured the web and found that all you have to do with those H.264 .mov files is change the file name to .flv, and they will play in Flash 9.

Furthermore what I read is that Flash 9 has is much universal on the web now.

So my question is, how do get a Flash 9 plugin for Dreamweaver MX2004? Is that possible? Can I just use the old Flash plug-in that came with Dreamweaver?( I've never even tried it - if its there at all actually.)

Lenny Levy

You don't even need to change the extension.

Please read this again:

Flash Player will also support files derived from the standard MPEG-4 container format such as MP4, M4A, MOV, MP4V, 3GP, 3G2 if they contain H.264 video and/or HE-AAC encoded audio.

ALL the above extensions work. Even MOV.

You did need to build a player for it. That's the way Flash works. There are free players available.

I like this because they have cut and paste code and a "wizard" for customization of that code.
LongTail Video | Home of the JW Player

There's also this
Flowplayer - Flash Video Player for the Web
Whose instructions are a bit harder to follow.

You can certainly import the H.264 and build a player in Adobe's Flash.

OK this may be stupid, but are those players that work with my browser for playing flash that I find on the web, or are they code ( plug ins?) that I can put in the HTML of my web page so it will play on someone else's web page when they click on my address?

I guess i am confused by the term "Flash player".

Lenny

It's code (JW Player and Flower Player) that you use to build a player in your web page.

Adobe Flash Player is a plugin that you have in your browser to play Flash files.

Craig, I'm trying to figure this out, but as with many things I find on the web, there seems ot be some basic information that is completely left out of the tutorials.
I downloaded the player from Longtail and placed the player in the same folder I have all my other web files in - so its the folder that is my practise for placing things on my server.

I follow there instructions and can embed the player in my page, but it is a player without any video in it. I don't see any way to link or otherwise get video ( whether its named .mov or .flv) into the player.


Obviously I'm missing something major here

And longtail is the EASY one!

s1.addParam('flashvars','file=video.flv');

video.flv is your video file. It doesn't have to be flv especially if it's an H.264 file.
This assumes the vide file is in the same directory as the web page. That's the easiest way to do it.

If it's in a folder called media it would be
s1.addParam('flashvars','file=media/video.flv');

<script type='text/javascript' src='swfobject.js'></script>
You've got to put the file
swfobject.js
in the same director as the web page as well. That's the javascript.

var s1 = new SWFObject('player.swf','player','400','300','9');
player.swf
which is the "Shockwave Flash" player also goes in the same directory as the web page.
The other part describes the frame size of the player.

Here's an example of a player I did with a skin. Note that the file is actually a Quicktime MOV file which now plays in Flash if it's H.264.
______

<script type="text/javascript" src="swfobject.js"></script>
*
<div id="player">This text will be replaced</div>
*
<script type="text/javascript">
var so = new SWFObject('player.swf','mpl','400','284','9');
so.addParam('allowscriptaccess','always');
so.addParam('allowfullscreen','true');
so.addParam('flashvars','&file=FrankMorrisMix_FL9_480x270.mov&image=FrankMorrisSmall.png&frontcolor= ffffff&lightcolor=cc9900&skin=bekle.swf');
so.write('player');
</script>

Here's the primitive web page. The video was shot with EX1 (of course). I compressed it to H.264 .mov in Telestream Episode.

I used a "skin" which is actually very similar to Vimeo's.
It's called "Bekle"

The page with the Flash video player.
Elect Frank Morris

That's what this is in my code above
&skin=bekle.swf'
flashvars list the variables
so.addParam('flashvars','&file=FrankMorrisMix_FL9_480x270.mov&image=FrankMorrisSmall.png&frontcolor= ffffff&lightcolor=cc9900&skin=bekle.swf');

You'll see the name of the file (.mov), the poster frame (.png), the color of the skin (all those color followed by letters and numbers), skin (bekle.swf).

They have a wizard page which allows you to enter in the parameters you want and it generates the code.

Setup Wizard | LongTail Video | Home of the JW Player

I'm sorry to be a blockhead, but never having taken courses in this tuff I just have kind of learned it on my own.
If I'm too much of a novice tell me to forget it. However I do have a page with lots of quicktime video on it that I can change myself so I'm not a total moron.


I don't understand where this code goes.

For example, I have a table with a cell and in that cell when I was using quicktime the code read like this (BTW its 480 by 380 for a 480x360 video with room for the controller underneath , the video is in a folder called "movies demo versions" - I guess I shouldn't use spaces to avoid the 20% messing things up):

<td align="left" valign="top" bgcolor="#FFFFFF"><embed src="movies%20demo%20versions/broadband%20demo.mov" width="480" height="380" align="right"></embed></td>

Now when I tried to put the Flash player in from longtail i ended up with this:

<td align="left" valign="top" bgcolor="#FFFFFF"><embed
src="player-viral.swf"
width="480"
height="380" loop="false" align="right"
allowscriptaccess="always"
allowfullscreen="true"
/></td>


But that just puts an empty Flash player in that cell

I also tried this from another tutorial on the Longtail page, but this didn't give me anything useful.

<td align="left" valign="top" bgcolor="#FFFFFF">
<p id='preview'>The player will show in this paragraph</p>

<script type='text/javascript' src='swfobject.js'></script>
<script type='text/javascript'>
var s1 = new SWFObject('player.swf','player','400','300','9');
s1.addParam('allowfullscreen','true');
s1.addParam('allowscriptaccess','always');
s1.addParam('flashvars','file=video.flv');
s1.write('preview');
</script></td>

Now your telling me to add something else, but I don't know where to add it.
Should I just forget the whole damn thing and hire someone?

Lenny

Try This:

<td align="left" valign="top" bgcolor="#FFFFFF">
<p id='preview'>The player will show in this paragraph</p>

<script type='text/javascript' src='swfobject.js'></script>
<script type='text/javascript'>
var s1 = new SWFObject('player.swf','player','400','300','9');
s1.addParam('allowfullscreen','true');
s1.addParam('allowscriptaccess','always');
s1.addParam('flashvars','file=movies%20demo%20versions/broadband%20demo.mov');
s1.write('preview');
</script></td>

I would definitely get rid of the spaces though. Some servers don't like them.
Make sure you've uploaded to the directory your web page is on:
swfobject.js
player.swf

You need those for the javascript (.js) and for the actual player (.swf) to work.
Make sure the .mov is H.264.

Why not post the link to the page?
I create my pages in Freeway (Mac only)
but any web authoring program will allow you to embed the code.
Sometimes you have to make sure you're uploading
swfobject.js
player.swf
to your website and not just the code you've written.
The script actually uses the above two to run.

Preview the page on your desktop first to make sure the authoring is working

Thanks Craig, I'll try that next, but the download i got from longtail didn't have

player.swf"

Instead it had

player-viral.swf

If you click on that a it plays opens a "Live type" page.

now hears something else i don't understand .
I copied the file player-viral.swf by using duplicate in the Mac file menu. So I could put one copy in my web folder and leave the other in the downloaded folder with everything else that came form longtail. I intended to just delete the letters "copy" from the file as soon as I moved the original to the web folder. The weird thing is I cannot edit that file name now - I can't delete the word " copy" from that filename.

Lenny

player-viral.swf
has additional features for linking to viral video sites. I'm trying to keep this simple. Just uncheck the viral version when you download it and you'll get the non viral version.

Sounds like you have a permissions issue if you can't change the name. If they were in the same folder you would have problems changing the name since you can't have two files with the same name in the same folder but you said one copy was in the download folder so that shouldn't be an issue.

There's some strange file identifier/creator issues that causes it to think the file was created with Live Type. I've also had .xml files that think they should open in Color. Don't worry about it. You shouldn't be double clicking on the player.swf file anyway.

Hey by gum , it almost works.
I'm getting picture but no sound and the frame rate is slow. By that I mean it looks like 15f /sec or so maybe even lower.

Actually - perhaps it is stuttering but whether its frame rate or stuttering it happens in Safari, but not in Firefox. In Firefox the speed is fine, but still no audio

Correction:
Rebooted, reinstalled the newest Flash, and emptied cache - now the speed is OK but no sound in either firefox or safari.
The problem with not being able to change a file name disappeared on the reboot .

All would be fine if I had sound. No quick start either though.

Craig - SUCCESS - Thank you so much, I thought this would be much harder and would require purchasing Flash.

I went on the forum at Longtail video and discovered that i was using the wrong codec for my audio. I was using MC4 instead of AAC. Actually I'm not sure how that happened as I thought I was using AAC all the time.

Anyway that got me the audio and also on the forum there were many complaints about "no autostart" and after going through about 5 possible solutions one of them worked.
So this is my final code ( I substituted "movie.mov" for the actual video and location:

<p id='preview'>The player will show in this paragraph</p>

<script type='text/javascript' src='swfobject.js'></script>
<script type='text/javascript'>
var s1 = new SWFObject('player.swf','player','480','380','9');
s1.addParam('allowfullscreen','false');
s1.addParam('allowscriptaccess','always');
s1.addParam('flashvars','file=movie.mov&autostart=true');
s1.write('preview');
</script>

You were right it plays the same whether I have a suffix of .flv or.mov.

So here are my final questions:

I have a web page with about 15 pieces of video. It is all set up now for quicktime player instead of Flash.

Should I simply redo every page and use the Flash player instead so that I have better coverage among users? is this Flash 9 pretty much ubiquitous now?

Also can i set this up to have multiple versions of same piece for different speed connections. I haven't tried that with Quicktime but it is supposed to work right.

Lenny

Hi Jon

Thanks for that info on encoding for web and especially on the idea of having frame sizes in multiples of 16.

Personally I still use Flash 8 and not Flash 9 as I believe there is more likelihood of people having it installed on their computer and one of those might just be a paying customer! (Also not everyone constantly upgrades their computer software / hardware - especially if they're over 40 - but are happy to just leave it how it is if it works)

I'll probably start using Flash 9 at the end of the year
Best wishes
Steve

In my neck of the woods, Flash 9 is pretty much there with some audiences - like us. If you see what I mean. But not all. I've been testing it out for some time now, and H.264 in the JW player is a go/no-go experience, and I'm still concerned that my audience is predominantly in the no-go camp. They don't like it.

Look at us... We've updated our Flash player, we've got fairly decent hardware, and you can pretty much assume 'better than 512k' bandwidth.

But for B2B, I have to stick to Flash 8 (On2's codec) as if you're pinning your hopes on your video being watched at the desktop from within big companies, the IT departments don't usually allow updates to software from websites.

So... B2C, go for it. H.264. A megabit per second if your audience is 'People Like Us'. 640x360.

But for B2B, Flash 8, sub 512kbps, 480x270* seems to be a fair lowest acceptable common denominator.

Multiple versions in different bandwidths and formats? Been there, done that. Didn't work for the majority. Keep the 'high end' version as a treat for people who sign up to you, and give them either 960x540 or 1280x720 at 2 Mbits. Or a downloadable version.

For what it's worth, regarding business use of stuff like YouTube, Vimeo, Viddler and so on - you need to know why you're there, and play by their rules. I can't name names, but publishing on an ad-supported channel can have bad side-effects, and selling in an altruistic community is bad mojo. BrightCove charges a pretty penny to replicated what they do for the business community. I'd recommend self hosting where possible.

But hey. At least we're not streaming!

* Yes, I know 480x270 breaks the cardinal rule of web video dimensions being cleanly divisible by 8 to assist the macroblock issues, but quite frankly if a PC can do H.264, it can jolly well get on with 480x270. We're far better off concentrating on getting the compression, scaling and the aspect ratio right, as it seems that's the current bugbear.

Adobe Flash Player Market penetration by version. Note that one needs version 9 or 10 to play Flash 9

By December 2008 Flash Player 9 is 98.1% to 98.9%
http://www.adobe.com/products/player...netration.html
and the methodology
http://www.adobe.com/products/player...s/methodology/
They don't seem to break down home vs work so it's certainly possible work computer penetration could be lower but the overall numbers on Flash 9 is very high.

This from April 2007 says Flash 9 at 84.3% so the above December 2008 numbers are in line with growth.
http://www.noobflash.com/flash-playe...on-march-2007/

And see the current growth of Flash 10 (which of course plays Flash 9)
http://venturebeat.com/2009/01/29/fl...platform-race/

And on a final note, note that H.264 playback was added in Dec 2007 and given the above growth rates I can only imagine the inability to playback Flash 9 H.264 as rare
http://labs.adobe.com/wiki/index.php...9:Update:H.264

I don't have to imagine it. Come to Europe, work in the B2B market where, thanks to little issues with operating systems, browsers, et al, IT departments are running scared and locking their platforms to prevent malware, phishing, all sorts of things.

Sorry I can't name names, but my client roster is pretty much all Blue Chip and most are banned from moving up to Flash 9.

IMNSHO, If you want market share in B2B, you'll hold off H.264 for the moment. Not for ever, not even 12-18 months, but it's not prime time yet. I've offered it for 18 months, most of my clients can't even see the movies in my /cb site (which is 75% H.264).

Adobe are publishing white papers and poll results to push the new version of Flash, not to reflect the current (rather tardy) uptake in the business community.

WGR, I listen to clients more than I listen to Adobe when it comes to Flash uptake - but bless Adobe's cotton socks, Fl8 is there, and Fl8/On2 isn't bad. Maybe next year I'll have everything in H.264 is all.

Note in the above methodology it says they included people who responded from businesses but they do not break down the home vs business difference so I don't at all doubt the veracity of your experience.

It's actually one of the problems with surveys like these. They really need to break out the demographics.

Many businesses may be completely limited to WMV and I even had one with a known international client that was still asking for MPEG1 as they couldn't handle WMV9!!!

BTW H.264 works in Microsoft Silverlight as well but until enough computers are bought with it installed many businesses are Windows Media Player only. Some also are locked in to WMP because banning Flash entirely prevents people from spending time on YouTube and some of the social network sites.

BTW all this gets even more complex when you consider iPhones and Blackberries in the business market too.

Matt,
Thanks, that's very valuable info and it does concur with what others have told me.

For me that means - for demo reel I'm probably fine with H264 Flash 9 or maybe even just stick to Quicktime player altogether since it is nearly always going to media savy producers.
For stuff designed for corporate clients though stick to Flash 8 as it will be shown on B2B computers.

Lenny