JavaScriptで動画からサムネイルを作成する

概要

動画からサムネイルを作成するプログラム。
動画から任意のシーンを選んで画像として保存します。

使い方

1. 動画ファイルを開く
2. サムネイルにしたいシーンを選択する
3. セーブボタンを押すと、サムネイルを保存できます

サムネイル画像の仕様は1280×720のJPEG。YouTube向けです。

動作サンプル

画像編集機能

このプログラムには画像編集機能があります。
テキストエリアにSVGを入力することでサムネイルを編集できます。

例えばサムネイルに文字を入れたいなら、次のようになります。

サムネイルに文字を入れる例

<text x="100" y="200" font-family="Meiryo" font-size="90px" fill="#fff" stroke="#000" stroke-width="12px" paint-order="stroke">テスト</text>

サムネイルに画像を加えたいなら、画像ファイルをD&Dすると追加できます。

ソース

ソースはHTML1枚です。クライアントサイドですべて動作します。
自分用のプログラムなのでノーデザインですが、よければご自由にお使いください。