Skip to content

A podcast for those who design, develop and run websites.

Boagworld is the blog of web strategist Paul Boag who lives in the heart of rural Dorset (hence the cows). He produces a weekly podcast with UX consultant Marcus Lillington on building and running websites. They also run the web design agency Headscape.

Latest Shows

216. Thanks for all the fish
This week on Boagworld: Chris Coyier talks CSS and more, we say goodbye to the boagworld podcast and ask what can you listen to now?
215. Web Directions
This week on Boagworld: Emerging trends at Web Direction @Media, playful web design and death to design by committee.
214. When to hire a web designer
This week on Boagworld: When to hire a web agency, user testing on disposable websites and a need for speed.
213. Getting all emotional
This week on Boagworld: Stephen Anderson on emotional design, I review the iPad and we talk fonts, flash and fotos.
212. More skills to learn
This week on Boagworld: 5 new skills every web designer needs to know and how to be inspired while maintaining focus.

or view all shows

Have your say

Become a part of the Boagworld community...

Creating screencasts

Posted in Tech/Development on: Thursday, June 12, 2008 by Paul Boag

Video is becoming an intrinsic part of the web and not just dumb ass videos on YouTube. Video can be used to show off products and provide online presentations. But how do you create a high quality screencast on a budget?

I seem to be creating a lot of screencasts lately. Whether it is recording a keynote presentation or demonstrating some web work, it is a useful way of communicating information.

Here are a few tips that I have picked up along the way.

Add talking head

Most screencasts are either a powerpoint style presentation or video of your desktop. However, if you want more impact and to better engage with your , add yourself talking to camera. This really grabs attention.

Image of a presentation I recorded using myself speaking to camera

Have a clean background

If you are recording yourself in-front of a busy background it looks unprofessional. Think carefully about what is behind you. If in doubt record against a plain wall. Also, remove all unnecessary icons from your desktop and make sure your wallpaper is simple and appropriate.

If it’s important, script it

If you are demonstrating an idea to a work colleague then by all means record it spontaneously. However, if it is something more important, write a script that you read. It is surprisingly hard to record live to camera and a script helps a lot.

Try an online teleprompter to prevent your eyes continually flicking down to read your script. I have the following setup to ensure my eye line is as close to the camera as possible.

Photograph of recording setup

Use decent equipment

Do not rely on your laptops inbuilt mic and webcam. The quality will suffer. Instead, I plug in my camcorder via firewire and record from that. I capture through a Samson C01U mic.

Check out screenflow

By far the best screen recorder I have found is Screenflow for the mac. It is amazingly easy to use and can capture full screen video. If you are a Windows user then take a look at Camtasia. Unfortunately it is considerably more expensive and not as good but it is the best I have found for Windows.

A Screenshot of Screenflow

Normal presentation techniques apply

As with any presentation it is important to be enthusiastic, clear spoken and engaging. Avoid becoming monotone as you speak and make sure you don’t sound as if you are reading.

Choose your player wisely

Think about how you are going to add the video to your website. Not all online video services are equal. Personally I like Vimeo. It places few limitations on file size or length. That said, all of these services compress the hell out of your video. If the quality is poor I suggest hosting the file yourself and using the JW FLV Media Player. Despite the name can play a variety of video formats.

That is what I have learnt so far. Do you have any additional tips you could share? I would love to hear your thoughts.

Post to Twitter Post to Delicious

What did you think about this post?

9 Comments

Comments are for the discussion of this post. If you have other questions / comments then post them to the forum or send me an email

  • James says:

    How would you go about recording yourself as well as your screen like the example without screenflow? At £65 I think that is a bit steep for a screencast program, also Leopord only.

  • paul Boag says:

    @James… steep? The Windows program I mentioned is $299! £65 is a bargain! As for how you would achieve this without a program like Screenflow; I don’t think you can. That is why its a bargain.

  • Rob Feature says:

    What timing! We just recently did an episode about screencasting on the Mac on our podcast. (I think Paul is spying on us ;) )

  • Todd Dietrich says:

    Thanks for the post. I’ve been giving some thought recently to doing some screencasts, but I never really got around to researching the best screencasting software. After reading your post I read over at MacWorld that Apple awarded ScreenFlow “Best Mac OS X Leopard Graphics and Media Application” and “Best Mac OS X Leopard Application.” I’ll definitely have to give it a try. Thanks again and keep up the good work!

  • Andrew Pryde says:

    Nice post. Myself I have always used camtasia to create my screencasts as I am a poor old XP user. Why don’t we get the same price as our americans get on apple hardware? :’(
    Andrew

  • Hey Paul, I want to first of all thank you for some of the helpful resources and tips I have found on your site, real cool. About Screen capturing, this small program might be useful for what you want to achieve. It has worked for me on several projects. I am not sure if it works for Mac. It is free too.
    http://camstudio.org/

  • Ben Dunkle says:

    For screen capture, check out the (free?) Jing:
    http://www.jingproject.com/
    I’ve always used Snapz on my mac, but I’m giving this program a try.

  • Hey thanks for the Jingproject link. It has a great tutorial video and looks like it works well. I love that we can get a whole of good stuff these days for free.
    Richard

  • wendy phillips says:

    Some time ago I used Cam Capture Pro for screen casting; the smoothness, ease of use and audio quality was superb. I haven’t used it for a while but here is the link http://www.capturecampro.com/

Leave a comment

Additional Information

Produced by Headscape

Boagworld is produced by the web design agency Headscape founded by Marcus, Paul and Chris Scott. Headscape also has a number of other talented guys who blog. Check them out.

  • Craig Rowe is one of our amazing developers and writes some superb posts on everything from .net to AIR apps.

  • Ed Merritt is a Headscape designer who's blog contains examples of his work and a number of free Wordpress themes.

  • Dave McDermid is a Headscape developer who has an excellent blog. He blogs on everything from AJAX to security.

  • Rob Borley is one of our project managers and blogs regularly on client and project management issues.

  • Leigh Howells is our multimedia design guru (whatever one of those is). He blogs on a mixture of design and music.

You can now download my video presentation of 40 better ways to work with clients for only £9.25.