Capturing Still Images from Videos

Videos in your Brightcove account can have an associated thumbnail image and video still image. You assign these images to a video in the Edit Videos: Basic Presentation dialog for the video. You can create these images from your videos using the Media module's image capture tool. You can also upload your own images using the Media module or assign images to a video using FTP batch provisioning or the Media API.

• The thumbnail image is displayed in the Media module. It can also be displayed in the playlist tabs or video list components of players that include those components, such as the Tabbed Navigation and Widescreen with Horizontal List player.
• The video still is displayed in the playback area of a video player before or after video playback.

Using custom player templates or the Media API, you can also display thumbnails and video stills in other contexts. You can use the same image from your video for both the video still and thumbnail, or you can use different images. Or, you can use an image from another source (such as a graphically-rendered promotional image) for one or both. This topic describes how to create thumbnails and video stills from your videos.

• Using the image capture tool
• Creating images automatically on upload
• Using other software to create thumbnails and video stills

Using the image capture tool

The Media module includes an image capture tool that you can use to create thumbnail and video still images from frames in your videos. The image capture tool works with both progressive download and streaming assets.

To use the image capture tool:

1. In the Media module, select the video for which you want to create an image.
2. In the Details pane, click the Preview & Capture window.
   
   
3. In the Preview window, use the control on the progress bar to scrub to the frame you want to capture, or just let the video play to the frame you want.
4. Optionally, select scale to fit. Use the scale to fit option if your video image does not fill the entire preview window. This adjusts the display of the video preview in the preview dialog to fill the preview screen area, so that the resulting image does not have black borders.
5. Click Capture.
6. Select Video Still, Thumbnail, or both. Optionally, enter names for the image files to be created.
7. Click Save & Close.

Once you click Save & Close, the Preview & Capture window in the Details pane displays the message Processing image.... Your new thumbnail or video still images will be associated with the video when they have finished processing and no further action is required. The newly-captured images will not display in the Media module until you select a different view, like Recently Uploaded, or click the Refresh button. Once processed, your new thumbnail image is displayed in the thumbnail column of the Media module datagrid, the video still is displayed in the Details pane, and both are displayed (and can be deleted or replaced) in the Edit Videos: Basic Presentation dialog for the video.

Image Aspect Ratios

By default, the video still image has the same the aspect ratio as the video you uploaded. So, for example, if you uploaded a 16:9 video, the video still displayed would be 16:9 as well. You can not alter the aspect ratio of the video still image.

You can change the aspect ratio of the thumbnail image. By default, the thumbnail image will be sized at 4:3 aspect ratio for all videos you upload, since this is the image size displayed in Brightcove standard player templates. If you want to generate a 16:9 thumbnail image, click the Crop icon for the sample thumbnail image. Then, use the Ratio control at the bottom of the window to flip between 4:3 and 16:9 aspect ratios for your thumbnail image. When you are finished adjusting the aspect ratio for the thumbnail image, click Done.

Cropping a Thumbnail

You can crop the thumbnail image by clicking the sample thumbnail to bring up the Crop Thumbnail feature. Then, you can drag around the transparent box to choose the area you wish to crop to. To resize the cropping area, use the slider at the bottom left of the window. Drag the slider to the left to minimize the box or to the right to maximize the box. Once you have decided how you would like to crop your photo, click Done. Your resulting image will show up as the sample thumbnail.

Creating images automatically on upload

When you upload a video that is not in FLV format (whether you upload using the Media module, FTP batch provisioning, or the Media API), Brightcove automatically creates a video still and thumbnail image from the video file and assigns it to the video as part of the transcoding process. The image selected is a frame at the 50% mark in the video. You can replace these images with other images you choose, using the image capture tool, the Edit Video dialog in the Media module, or the Media API's add_image method.

Using other software to create thumbnails and video stills

You can also create your own thumbnail and video still images, using your own software. To prepare high-quality images for use in your Brightcove player:

1. Obtain a source image by exporting a frame from your source full-length video using your video editing application or use an image from another source, such as a graphically rendered promotional image.
2. Open the image in an image editing application.
3. Crop the image to remove any extraneous information or unwanted blank space on the edges using the following guidelines:
   • Size - Use the following standard sizes to help Brightcove promote your content to a larger audience. For video stills: Crop to no less than 480x360 pixels. For thumbnails: Crop to no less than 120x90 pixels.
   • Aspect ratio - For thumbnails, use a 4:3 aspect ratio. For video stills, keep the same aspect ratio as the video they are derived from. This will generally be 4:3, unless you use a player that supports scaling to arbitrary video sizes, in which case you can resize for 16:9. If your video has a 16:9 aspect ratio, but displays letterboxed in the player, your video still should still use the standard 4:3 aspect ratio.
4. Deinterlace the image. Many image editing applications feature a deinterlacing filter to eliminate certain artifacts. (Adobe Photoshop users: Choose Filter > Video > Deinterlace > Interpolation and select Interpolation for the deinterlacing method.)
5. Adjust the contrast and brightness to improve the image, as needed. (Most image editing applications can adjust color, brightness and contrast.)
6. Resize the image by disabling "Constrain Proportions" or "Constrain Aspect Ratio" and entering the following height-by-width sizes:
   • For video stills: Scale to 480x360 pixels
   • For thumbnails: Scale to 120x90 pixels
7. Save/Export the edited image. Use your application's Save As or Export command to save a copy of your image as a non-progressive JPEG. (Adobe Photoshop users: The Save for Web option lets you preview the image before saving.)
8. Use the Media module's Edit Video dialog to add your images as video stills or thumbnails.

Thumbnail JPEGs should be smaller than 30K. Video still JPEGS should be under 300K.