HowTo Create A Screencast: Difference between revisions
(2 intermediate revisions by the same user not shown) | |||
Line 60: | Line 60: | ||
* There are numerous ''Advanced Options'' that can be adjusted before starting your capture. If you are only intending on capturing a single window, you may want to consider turning off the ''Include Window Decorations'' option (especially if your window contains a Virtual Machine, VNC, or RDP session). | * There are numerous ''Advanced Options'' that can be adjusted before starting your capture. If you are only intending on capturing a single window, you may want to consider turning off the ''Include Window Decorations'' option (especially if your window contains a Virtual Machine, VNC, or RDP session). | ||
* After adjusting your options and selecting a window (if not recording the entire desktop), you can press the ''Record'' button to start the recording. '''NOTE''': If you right click on this button you can temporarily ''pause'' your recording. | * After adjusting your options and selecting a window (if not recording the entire desktop), you can press the ''Record'' button to start the recording. '''NOTE''': If you right click on this button you can temporarily ''pause'' your recording.'''HOWEVER''', be aware that if you pause and then continue your recording you may find it difficult to work with the recording in a video editor once the pause point is reached (I struggled for a couple of hours trying to remove a section of video after a ''pause point'' and finally gave up and re-recorded the ending of my screencast). | ||
* The small red record button on the GNOME panel will turn into a small gray square stop button. At this point you can start talking and using the application. | * The small red record button on the GNOME panel will turn into a small gray square stop button. At this point you can start talking and using the application. | ||
Line 89: | Line 89: | ||
= Publishing = | = Publishing = | ||
Once you are done editing and have exported your final screencast, you will need to upload it to [http://www.youtube.com/ YouTube]. This requires a account (mine is linked to my Gmail account). | |||
After uploading, you will be given a URL containing a link to the uploaded video. For example: | |||
http://www.youtube.com/watch?v=Uqk7iGYMvbE | |||
From the URL, you should be able to identify the [http://www.youtube.com/ YouTube] ID of your video (''Uqk7iGYMvbE'' in the example URL shown above). If you would like to embed the video in a MediaWiki page, you can use the following markup: | |||
<nowiki>{{#ev:youtube|ID|WIDTH|HEIGHT}}</nowiki> | |||
The ''WIDTH'' and ''HEIGHT'' are optional, but I've found that if you omit them, the MediaWiki extension assumes a 4:3 aspect ratio (which is not good for showing a 720p HD video in). Since specifying a width and height of 1280 by 720 seems a bit large for a web page, I tend to halve both dimensions to embed the video in a 640x360 window. Even though the video is embedded in the page, the user has the option to view it in full screen mode, or play it back at different resolutions. | |||
Here's an example: | |||
<nowiki>{{#ev:youtube|Uqk7iGYMvbE|640|360}}</nowiki> | |||
This results in the following: | |||
{{#ev:youtube|Uqk7iGYMvbE|640|360}} | |||
You can also embed a YouTube in a [http://www.networksecuritytoolkit.org/nstpro NST Pro], [http://www.networksecuritytoolkit.org/ NST], or NST WUI web page using the following JavaScript command: | |||
NstDom.appendYouTube(domNodeOrId, youTubeId, width, height); | |||
For example: | |||
NstDom.appendYouTube(document.getElementById("myVideo"), "Uqk7iGYMvbE", 640, 360); | |||
The @embedYouTube(YOUTUBEID,WIDTH,HEIGHT) @macro() is also available for this purpose: | |||
@embedYouTube("Uqk7iGYMvbE", 640, 360); |
Latest revision as of 07:08, 15 August 2011
This page provides some notes on creating Screencasts using a NST system.
Installing Packages
We have found that the gtk-recordmydesktop provides a simple and free method for capturing screens and producing a screen cast. The totem package provides a viewer for the Ogg Video format screencasts (the VLC media player is also capable of playing back these files). To install these packages:
yum install gtk-recordmydesktop totem
Sound Card Configuration
Configuring and choosing the sound card for gtk-recordMyDesktop can be difficult on systems with multiple sound devices. Here are some tips:
ALSA sound sources are used by gtk-recordMyDesktop and by default, the ALSA sound source of hw:0,0 is used if you leave the sound device set to DEFAULT. To see what sound devices you have available, use the following command:
[pkb@rice ~]$ cat /proc/asound/cards 0 [SB ]: HDA-Intel - HDA ATI SB HDA ATI SB at 0xfe024000 irq 16 1 [HDMI ]: HDA-Intel - HDA ATI HDMI HDA ATI HDMI at 0xfdffc000 irq 19 2 [Headset ]: USB-Audio - Logitech USB Headset Logitech Logitech USB Headset at usb-0000:00:12.0-2, full speed [pkb@rice ~]$
From the output above, there are 3 ALSA sound sources available. To use the Headset, I needed to change the sound device in gtk-recordMyDesktop from DEFAULT to hw:2,0.
To adjust the recording levels, I used alsamixer.
Set Up Area To Capture
Prior to starting your screencast, you should think about your final output. Here are some things to consider:
- YouTube limits video uploads to 15 minutes.
- YouTube permits HD video uploads up to 720p (1280x720). NOTE: 1280x720 corresponds to a 16:9 aspect ratio (wide screen format) and is known to work. I am not sure if YouTube permits 4:3 aspect ratio, but if it does, this would correspond to a screen size of 960x720.
So, my theory is that to get the best rendering on the final HD video, it's best to start with a screen size that matches the 720p resolution. You basically have three options to do this if you want to capture the entire screen:
- Resize your screen to 1280x720 and capture your full screen.
- Pull up a 1280x720 VNC desktop of a system you want to capture and select this window as the source to be captured (sans window decorations).
- Use the rdesktop command to create a 1280x720 desktop view of a remote system and select this window (sans window decorations).
- Set up a virtual machine running in a 1280x720 window and capture this window (sans window decorations).
VNC Set Up
The following command will setup a 1280x720 VNC desktop on a NST system (you might prefer to use the WUI instead).
nstvncadmin --mode setup -display 1 --width 1280 --height 720
RDP Set Up
The following command can be run from the NST command line to launch a 1280x720 RDP viewer of a RDP server (typically a Windows box).
rdesktop -g 1280x720 192.168.1.8
Capturing
To create your screencast:
- Launch the gtk-recordMyDesktop application. From the GNOME Desktop, it should be found under the Applications | Sound & Video menu.
- There are numerous Advanced Options that can be adjusted before starting your capture. If you are only intending on capturing a single window, you may want to consider turning off the Include Window Decorations option (especially if your window contains a Virtual Machine, VNC, or RDP session).
- After adjusting your options and selecting a window (if not recording the entire desktop), you can press the Record button to start the recording. NOTE: If you right click on this button you can temporarily pause your recording.HOWEVER, be aware that if you pause and then continue your recording you may find it difficult to work with the recording in a video editor once the pause point is reached (I struggled for a couple of hours trying to remove a section of video after a pause point and finally gave up and re-recorded the ending of my screencast).
- The small red record button on the GNOME panel will turn into a small gray square stop button. At this point you can start talking and using the application.
- When you are done press the small square button on the GNOME panel.
- At this point the raw screen capture data will be encoded and the output file will be saved. By default this will be save to the file $HOME/out.ogv unless you press the Save As button before recording.
It's highly recommended to make a short test screencast to verify your settings (it's easy to have the wrong sound device selected).
Editing
For editing the captured video, I came across a program called OpenShot. However, the installation was a bit tricky. Here are the steps I followed:
Download and install the OpenShot RPM for your system.
yum install openshot-1.2.2-1.fc13.noarch.rpm
Install the following packages (if they are not already on your system):
yum install blender freeze frei0r-plugins
After starting OpenShot, open up the preferences panel and change the Melt Executable from melt to mlt-melt.
Once you finish with your edits, you can Export your final screencast from the File menu. The following screen shot shows the settings I used for HD output for YouTube uploading.
Publishing
Once you are done editing and have exported your final screencast, you will need to upload it to YouTube. This requires a account (mine is linked to my Gmail account).
After uploading, you will be given a URL containing a link to the uploaded video. For example:
http://www.youtube.com/watch?v=Uqk7iGYMvbE
From the URL, you should be able to identify the YouTube ID of your video (Uqk7iGYMvbE in the example URL shown above). If you would like to embed the video in a MediaWiki page, you can use the following markup:
{{#ev:youtube|ID|WIDTH|HEIGHT}}
The WIDTH and HEIGHT are optional, but I've found that if you omit them, the MediaWiki extension assumes a 4:3 aspect ratio (which is not good for showing a 720p HD video in). Since specifying a width and height of 1280 by 720 seems a bit large for a web page, I tend to halve both dimensions to embed the video in a 640x360 window. Even though the video is embedded in the page, the user has the option to view it in full screen mode, or play it back at different resolutions.
Here's an example:
{{#ev:youtube|Uqk7iGYMvbE|640|360}}
This results in the following:
You can also embed a YouTube in a NST Pro, NST, or NST WUI web page using the following JavaScript command:
NstDom.appendYouTube(domNodeOrId, youTubeId, width, height);
For example:
NstDom.appendYouTube(document.getElementById("myVideo"), "Uqk7iGYMvbE", 640, 360);
The @embedYouTube(YOUTUBEID,WIDTH,HEIGHT) @macro() is also available for this purpose:
@embedYouTube("Uqk7iGYMvbE", 640, 360);