Screencast Creation

This page details the process I perform to create screencasts.

Screen Capture

I use the CamStudio application to grab the screen.
http://camstudio.org/.

CamStudio Screenshot

Screenshot 1: CamStudio Software

The CamStudio application will create an avi video file which is then loaded in to the Video Editing software.

Video Editing

I use the Corel VideoStudio Pro X4 product to perform Video Editing on Windows 7.
http://en.wikipedia.org/wiki/Corel_VideoStudio.

To save money I download from the Corel US store (not the Australian Store).
Video Studio Pro X4 Home Page on US Store

Asrock Screencast in VideoStudio

Screenshot 2: Corel VideoStudio

Video Conversion

I created a shell script called webvideo.sh to take an input video and output the 4 video files for hosting on my website. This runs on Ubuntu Linux.

Source Code 1: Video Conversion Script

Source Code 2: Updated Video Conversion Script 2013

The script is run by passing two parameters.
Parameter 1: the video filename (without extension),
Parameter 2: the video file extension.

To process an mpeg video file called AsrockDemo.mpg you type:
webvideo.sh AsrockDemo mpg

This will create 4 video files:

  • AsrockDemo.mp4
  • AsrockDemo.ogg
  • AsrockDemo.webm
  • AsrockDemo.flv
  • Hosting

    I upload the 4 video files using WinSCP to my website.
    http://winscp.net

    WinSCP Screenshot

    Screenshot 3: WinSCP

    I follow the following HTML 5 "Video on the web" instructions to present my screencast.
    http://diveintohtml5.info/video.html

    Here is the HTML code for the AsrockDemo screencast:

    Source Code 2: HTML for Video

    This web hosting process has been tested on:

  • Windows 7 - IE, Firefox, Chrome
  • OSX - Safari, Firefox
  • Linux - Firefox, Chrome
  • iPad, iPhone, iPod Touch
  • The flv (or flash) version of the screencast may be used with Facebook. See my hobby page regarding my Social Networking Website Enhacements for more details.