One of the most desired features for educational video content - particularly recorded lecture content - is the ability to speed up playback to 1.2x or 1.4x normal speed. Now, you can easily add this feature to your video website, with a few caveats.

When you increase playback speed, it turns out that it's still quite listenable, and the quicker pace can even enhance the experience. Chit chat, pauses, um's and ah's and other delays that slip by unnoticed when you're live in the room face-to-face with the speaker become unbearable time-wasters when you're watching a recording on your own time.

There used to be two options for enabling this. On the client side, third-party products installed directly by end users, like Encounce's MySpeed plugin, were the way to do it.

On the server side, you could encode the video with the faster timeline baked in, and let the user switch streams at will. Bloggingheads.tv uses this method on most of its videos.

But now, HTML5 video playback offers the same capability (at least on some browsers). Let's take a look at an example. (You'll need to use Chrome, Safari, or IE9 for this example to work - Firefox (at least as of version 8) does not yet support this.)

The key is the <video> element's playbackRate property. Normal playback speed is expressed as a floating point number: 1.0. Accordingly, 2.0 is double speed, 0.5 is half speed.

Here's a code sample for the links above the video shown below:

<script type="text/javascript">

function speed(x){
        var myVid=document.getElementById("streamDiv_video");
	myVid.playbackRate=x;
	$('#pbrate').html(x);
}
</script>

...and then the HTML...

        <a href="javascript:speed(0.5)">.5x</a>
	<a href="javascript:speed(1.0)">1x</a>
	<a href="javascript:speed(1.2)">1.2x</a>

Now the example...
.5x 1x 1.2x 1.4x 2x Video: Just Another Day, NASA JPL.

There are advantages and disadvantages to each method:

Method	Advantages	Disadvantages
Client-side Plugin	Local install for user - no effort on content provider's part.	Can't offer as universal feature of your site, does not work well with RTMP Flash streaming - HTTP only.
Encoding with timeline baked in	Works with RTMP, Flash, any browser	Extra encoding for site owner, custom code to switch streams seamlessly, can't do progressive download, requires streaming (or pseudo-streaming) protocol that provides random access into video
HTML5 playbackRate	Lightweight to implement, just some Javascript on the page, works with progressive download	Works only with HTTP delivery, works only on certain browsers

The W3C has a good HTML5 Video property and event demo tool where you can manipulate playbackRate and other properties, and see the resulting events as they happen.

I’ve been enjoying Jan Ozer’s new book, Video Compression for Flash, Apple Devices and HTML5. It’s the comprehensive how-to tutorial on video encoding you’d expect from Jan, as well as a lot of insight about best practices and all the things you should be paying attention to when you’re publishing video online.

Chock full of examples, test results, tables of useful data, and technical information you can put to use right away – this is a great resource for anyone: novice to expert.

Part of what I like is Jan’s no-nonsense approach as a practitioner. For example, after a detailed analysis of publishing using HTML5, he cuts to the chase:

HTML5’s value proposition today, and for the foreseeable future, is “encode in more formats that offer no advantage over H.264, and play on fewer computers, and distribute your on-demand content to vastly fewer viewers with lower quality of service, less features and a reduced ability to monetize than you can with Flash or Silverlight. Oh, and forget live.”

Don’t get me wrong – he still covers everything you need to know (in great detail!) about targeting HTML5 players. But he explains in practical terms what it really means to do so, and when and why you ought to.

Highly recommended.

Here’s a nice one-stop-shop for comparing HTML5-capable video players: VideoSWS, (where SWS apparently means, “See What Sucks”).

The chart provides a rough view of player capabilities. but clicking the names of each player brings you to a working example of the player. Not extensive analysis of each, but great for a quick survey of what’s out there for embeddable players.

Thanks are due to Philip Bräunlich and Gerrit van Aaken for creating this!

The biggest obstacle I’ve had with live Flash Media encoding with Adobe Flash Live Media Encoder 3.1 is the inability to reliably save a version of the encoded file to disk. It’s actually a huge operational problem that we can’t count on archiving a recording at the encoder!

It seems a fairly common case that you’d want to archive a copy, and post it to an on-demand server as soon as the live event is done. But my attempts to do that with FMLE have not been successful.

FMLE saves a .f4v version of the encoding. It’s a chunked file format that needs to be converted to .mp4 to be useful for anything else. Using the free f4vpp tool from Adobe, we should be able to do this conversion and get on with our lives. In practice, the conversion seems to result in either .mp4 files with no audio, or .mp4 files with horrendously out-of-sync audio.

A quick Web search doesn’t turn up too many people complaining about the same thing, so I wonder if there’s something obvious I’m missing. Has anyone else had any success with converting FMLE’s .f4v files to something useful?

The hype around HTML5 video is finally getting pierced with a dose of reality.  That reality, as far as I can see, is that HTML5 is a nascent idea of something that will undoubtedly be useful some day. But at the moment, for many of us publishing video to the 'Net, it's more of a problem than a solution. Some great thoughts on the issue have come from Jan Ozer at the Streaming Learning Center, and technical analyst extraordinare at streamingmedia.com. In his article, The Five Key Myths About HTML5, Jan points out that in practice, supporting HTML5 means encoding multiple formats of everything, an inability to do live streaming or on-demand stremaing using a true streaming protocol, working around numerous browser incompatibilities, and no adaptive/dynamic streaming. He summarizes:

• No major media sitepresents HTML5 as their primary viewing optionHTML5-compatible browser penetration is low, and will continue to be well into the future
• Though HTML5 is great for low volume video playback, it lacks many critical features currently available in plug-in based technologies
• Full HTML5 support will require 2 or 3 times the encoding chores of Flash support

Longtail Video's Jeroen Wijering, maker of the popular JW FLV Player and JW Silverlight Player wrote in HTML5 Video: Not Quite There Yet:

The video tag is still in its infancy and misses certain core functionalities. As developers demand these features, browser vendors are tempted to implement incompatible solutions instead of agreeing upon standards. These hasty developments, already underway, are setting HTML video up for the same chaos  as HTML styling in the pre-CSS era.

We remember those days...multiple coding and testing for every possible brower combination, and any web application with an interesting, innovative, or especially responsive UI (using CSS and DOM-manipulation) was fragile and expensive to maintain. Eventually, standards got better and better-supported, and libraries like ExtJS and JQuery provided abstraction that made authoring powerful and reliable applications easier.  Things in a web app that used to be done with a Flash or Java applet UI are now routinely done using these Javascript/CSS libraries.

So there's hope for HTML5 video, but it's not there yet and it won't be there for years. The hype around HTML5 isn't matched by the reality - which is that it's a pain that complicates our work in streaming; and that Flash or Silverlight are going to be better choices for most purposes for some time to come.

In the direction of standard libraries to make life easier for the streaming publisher, Longtail Video has just released a Beta of their JW Player 5.3, which seamlessly integrates Flash and HTML5 support.  It's got a whole new API for embedding and Javascript event handling; and it lets you set the HTML5 failover in either or two options:

1. Use HTML5 wherever it's supported, otherwise failover to Flash
2. Use Flash unless it's not supported, then failover to HTLM5.

I'll be testing the 5.3 Beta player over the next few days and will post my impressions.

Our adventures in live mobile streaming continue. If anyone should happen to read this post on Thursday May 27, you can see the results of this effort at http://harvard.edu/commencement2010/

So what are the lessons learned so far? Here’s a preliminary list in no particular order:

• Setting up the server side of things is the easiest part. Configuring for FMS delivery from Limelight, and for Wowza on Amazon EC2 was a breeze. Multiple bitrates, the RSS playlist for JW Player, the SMIL playlist for Wowza….once you figure out the moving parts, it works almost just like it’s supposed to.
• Adaptive streaming from Limelight and other CDNs that use the ‘fcsubscribe’ method for load-balancing can cause a problem when switching to a streams that comes from a new edge node. More on this later…
• Mobile devices: Make sure you’re encoding H.264 with Baseline profile level as low as you can go.  iPhones and iPads turned out to be the easiest to support fully.  Blackberries and Droids work…or they don’t. It seems to depend on the model phone, and on the network you’re on.  My personal Blackberry gets the RTSP stream just fine.  Others around the office with different Blackberries can’t play the stream. Same with Droids – some people are able to play it, some not. I haven’t discovered why just yet.  Codec issues are a likely possibility, but it’ll take some digging to find out. I have not found any useful documentation on the differences between Blackberry models, in terms of live video streaming support.
• Encoders – this has been the headache of all headaches and took many many man-hours to get right.
  • Encoding three bitrates (100k, 500k, 1000k) to two different CDNs (Limelight, Wowza/EC2) takes a lot of horsepower.
  • One brand new 8-core Cisco machine with a brand new Osprey 240 proved unsuitable for capturing video at all.
  • Adobe Flash Media Live Encoder (FMLE) and Telestream Wirecast on Windows both depend on your display hardware and drivers. If you’re planning a headless encoding system, plan extra time to get it all working.
  • A 2-core IBM/Windows/Osprey system running FMLE gave us better encoding performance than an 8-core Mac Pro/AJA system running Wirecast.
  • All of the above systems had issues with audio/video sync, either being off from the start, or drifting as the webcast went on. Only on the Mac/AJA system were we able to resolve these in time for a successful webcast.
  • Ordinary desktop PC running consumer USB video capture devices are easiest to set up and are the machines most likely to work right off the bat.  No audio/video sync issues occurred with these, even though we were capturing video on one of a couple $50 USB
    devices and audio using the built-in audio support on the PC.  The more expensive and industrial-grade the hardware, the more trouble it gave us.
  • Our final encoding configuration included an 8-core MacPro/Wirecast for the 1Mbps and 500kbps streams, a single-core desktop PC running FMLE for the 100k streams, and a dual-core desktop PC with FMLE for capturing a 1.2Mbps H.264 archive file.
  • Some of our partner schools are using our infrastructure for mobile streaming. They’ve got Digital Rapids TouchStream appliances, and have had no encoding issues doing multiple bitrates from HD down to 3G/mobile. I’m quickly becoming a big fan of purpose-built appliances for encoding.

That’s about it for now…I’ll follow up on some of these as we do some analysis and learn more.

For an upcoming university commencement, I’ve been looking into doing live streaming in H.264/Flash, as well as http streaming to Apple iPhone/iPad/iPod devices (herein referred to as iP* devices) and rtsp streaming to Droids and Blackberrys. It’s been an experience piecing it all together, and I’ll be writing about some of the surprises and pitfalls as we figure out how to best do it.

In a nutshell, we’re using Limelight Networks’ Flash Media Server 3.5 for delivery to browsers on PCs and Macs. For mobile streaming, I provisioned and started up an instance of Wowza on Amazon EC2. One stream in (or several, for multiple bitrate support) via RTMP, and Wowza delivers in all the right formats – whether it’s chunked HTTP (Apple devices), RTSP (Droids and Blackberrys), or RTMP (Flash).  Setting that up involved an awful lot of moving parts, but half a day later, it was up and running and has been flawless in testing. We’ve been streaming multiple bitrates (100kbps, 500kbps, 900kbps) from Adobe Flash Media Live Encoder on a PC, as well as from Telestream Wirecast on a Mac.

We’ve developed a page that uses the JW Player (Flash) as the default, and falls back to HTML5 if it’s an iP* device, or provides an rtsp:// link if it’s a Droid or a Blackberry. Yes…Flash is the default for all browsers that will allow it, as it provides a uniform experience for all users, and a single thing to worry about from a user-support perspective.

What’s been interesting to me is how quickly it all went together. In a couple of days, starting with no deep mobile experience, we’ve provisioned infrastructure in the cloud, configured it, and are up and running with live Flash and mobile streaming for short money. More details to follow in the coming days…

There’s few things as delightful as being surprised by outstanding customer service and perfect execution of something difficult. Specifically, I’ve been wanting to move my website to a new hosting provider for a while now. My old host was becoming increasingly unreliable, particularly with respect to email. But the pain of switching hosts creates a powerful inertia – it’s easier, for a while, to deal with the problems than it is to move everything. I have a WordPress installation, MovableType, several busy email accounts using IMAP, a few databases, etc. I just didn’t have the time to deal with it.

Which leads to my experience with GreenGeeks hosting. I found them doing the usual Googling around and reading reviews. I liked the price. I liked the green idea of buying wind credits to offset power use (although how much of that represents a real net effect on the environment, I have no idea. It, at least, feels like doing something good.) I loved the idea that they will do your site migration for you.

I had absolutely no expectation that they would be able to migrate everything. I expected to spend some hours/days tweaking this and that to get it all up and running as on my original host. But just moving the files across and setting up users, etc….that’s helpful, anyway, right?

Well, it was perfect. There were a few emails as they asked questions and came to understand my environment, and then two days later I get an email that says “It’s ready.” And darned if it wasn’t. WordPress, MovableType, all my symlinks and apache config, all the email accounts with all the content intact. My migration effort consisted of updating my domain registrar’s DNS record. Period.

I can’t say much yet about reliability of the service (although it’s been 100% so far!), but I can say that the migration service and the general customer service I’ve received in my three days on GreenGeeks hosting has been outstanding. AFter starting to write this post I realized that they have an affiliate program, so yes, I signed up and these are affiliate links. But that was an afterthought. My enthusiasm for the service, and my delight at how easy it was to switch, is genuine.

Flash security constraints can prevent a SWF hosted on one domain from reading data hosted on another domain. Users trying out the SlideSync and SlideScroller plugins might encounter this issue if the XML data file that contains the slide URLs and timing is on a different website from the one that hosts the JW FLV Player itself.

The solution is to add a crossdomain.xml file to the root directory of the web server that hosts the XML file. There’s official Adobe docs on crossdomain policy files, and here’s a pretty good tutorial on crossdomain.xml files.

In short, you create this simple file using any text editor, and set up a rule describing which other sites may access data hosted on the site where the crossdomain.xml file lives.

<?xml version="1.0"?>
<!DOCTYPE cross-domain-policy SYSTEM "http://www.adobe.com/xml/dtds/cross-domain-policy.dtd">
<cross-domain-policy>
   <allow-access-from domain="*.learningapi.com" />
</cross-domain-policy>

sbs!

My Dynamic Streaming article on streamingmedia.com generated some follow-up over at Longtail Video, home of the JW FLV Player.  In an email exchange, JW himself, Jeroen Wijering, explained how the JW was handling stream switching, and that in response to my test results, they'd made some changes for the next release (5.2).  You will find excerpts of the ensuing email discussion in the comment section of the article page, appearing shortly.  In that discussion, Jereon offers a terrific explanation of how it works, and confirms two of the rules of thumb I deduced in my testing:

1. Encode with a fixed keyframe interval, ideally every 2 seconds or so
2. Use a bufferlength about 2x the keyframe interval

To quote Jeroen:

Herein lies the tradeoff to be made for dynamic streaming. Higher bufferlengths decrease the likelihood of playback stuttering, but slow down any responses to screensize / bandwidth increases. Hence the rules of thumb for short keyframe intervals and "2x keyframe" bufferlengths.

I've updated the Dynamic Streaming example page to load a build of the player that contains the fix. My testing shows that it performs beautifully - on par with the 1080p player at switching both up and down, with seamless playback during the switch.  This will be part of the next release of JW Player, 5.2, now scheduled for around the end of May.

I haven't had any communication from anyone involved with Flowplayer. Their dynamic streaming implementation as tested for this article (bandwidth-check plugin 3.1.3) remains not really useful for during-playback streaming, although it was fine a selecting the correct stream at startup.