HD Screencast Example
March 8th, 2009 | Posted in blog 8 Comments »
Embedding HD video screencasts into a WordPress blog is something I’ve been trying to figure out. The HD quality is key because it allows me to compress the file into a small space without the video looking fuzzy — a necessity for screencasts with small text. I also like the idea of showing video content directly where the reader is, rather than displaying the video in a popup or secondary window.
I learned that if you upgrade your space on a WordPress.com blog (not a self-hosted WordPress blog), you can then upload videos using the Add Video button. If you record in a 1280 x 720 px dimension, the uploaded video will be automatically rendered into HD format. You can then grab the embed code for the video and embed it on your self-hosted WordPress blog, changing the width to 640px and the height to 360px, which is what I’ve done below.
The following video explains a bit about the different files in a WordPress theme. I’m not so much trying to explain this concept as I am demonstrating the HD format for the screencast. Make sure you select the HD On option, since you can’t toggle back and forth from Off to On without restarting the video.
If you expand the view to full mode using the expand button in the lower-right corner, you can really see the difference between HD and non-HD. When it’s small, the difference isn’t that noticeable. Still, either mode is a lot clearer than other non-HD videos compressed to this size.
Youtube is also offering an HQ (for “high quality” — not quite the same as high definition) option for uploaded videos, so soon this may be a default feature with screencasts. The following is a youtube video that looks fuzzy if you don’t select the HQ option. If you expand the video to full size, though, it’s not as clear as my expanded WordPress video.
To overcome fuzziness problems, you usually have to use pan and zoom features to magnify content. This makes it more time-consuming to create the video. I realize, though, that the text in my sample HD screencast is pretty tiny and would benefit from some magnification.
What’s especially cool is that WordPress has made the HD transcoding engine available for use on your own server. The only catch is that it requires some advanced configuration on your part. Still, you could essentially create HD screencasts behind the firewall for your company.
Sponsors
Tags: HD, screencasting, Screencasts
If you liked this post, keep updated with new content: Subscribe to I'd Rather Be Writing.
Both comments and pings are currently closed.

















Looks great! That is a great tip about recording in HD on WordPress.com. I really like the WordPress swf player – it is so much better designed and classy looking than others (like YouTube). That is also wonderful news that they are making the plug-in available.
fyi, YouTube can, in fact, do HD though: http://www.youtube.com/watch?v=ihJd21CMPZQ
Tom,
That’s fantastic. The image quality of your example is great full screen.
A couple of questions:
1) For self-hosting folks like me, assuming I can figure out the transcoding engine (this may be assuming too much!), is the WordPress.com Video Player available to non-WordPress.com WordPress users?
2) I’d love to use this on our Documentation WordPress blog at work, but server space is always a problem (e.g. it’s restricting what we can do with Jing). What sort of file sizes are you talking here? For example, what was the size of file you uploaded for your HD example?
WillsWords, thanks for the note about HD on youtube. I think it’s great that they’re also offering it.
Alistair, I have a WordPress.com site at http://idratherbewriting.wordpress.com. I uploaded the video there and then just grabbed the embed code to insert it on my self-hosted WordPress.org site. This is how the WordPress screencast guy explained to do it (he admitted it’s a bit of a hack). I’m not currently using my own implementation of the Video Framework.
The HD video itself is only 30 MB. At least that’s what I uploaded to WordPress.com.
I’m also looking to use WordPress’s transcoding engine to deliver HD screencasts for documentation in my help at my company. I too am behind the firewall, so I need to figure it out or find someone at my work who can. This is a challenge I’ll face. But the whole video player and skin and everything is part of that Video Framework plugin I linked to in the post. It’s pretty cool that it’s available for free. As far as I know, no other video service makes their HD rendering service and video player available for free like this.
Another option for relatively inexpensive HD self-hosting would be to record using Jing Pro — the pro version ($14.95/year) records directly to MP4 h.264. TechSmith provides a SWF player you can use to embed content (http://blog.jingproject.com/2009/01/use-ftp-heres-some-embed-code.html)
However, Jing does limit you to a maximum of 5:00 minutes in length per video.
I did explore the Jing option in a previous post. The clarity of the Jing player looks pretty good. However, the clarity only shows in the expanded form.
Tom, now that you remind me that you covered this, I’m betting that your blog is where I learned about it.
Forget HD, I’ll bet you’ve never done a screencast like this: http://www.youtube.com/watch?v=I9TtDecveCE&eurl=http://blog.screentoaster.com
Awesome guys, I have been looking for this information all around, there are no online information or any website or articles written about this information. I got an email about this from my friend, it was very important for me. The information you people have given here is really very helpful and will absolutely help in resolving my problem. This has been one of the finest articles about this. I really appreciate your work. Hope you people here keep writing good stuff like this!