メインコンテンツまでスキップ

プロダクトデモ動画の作り方

プロダクトデモ動画を作るには、短い台本を書き、一定のペースで製品を録画してから編集します。無駄な時間をカットし、重要な部分にズームし、見せたくない情報を隠し、字幕を付け、配信先に合った形でエクスポートします。このガイドでは、各手順を OpenScreen で行います。OpenScreen は Windows、macOS、Linux に対応した、MIT ライセンスの無料の画面録画・編集ソフトで、録画、編集、文字起こし、エクスポートはお使いのパソコン上で実行されます。OpenScreen が作るのは動画ファイルです。動画のホスティングや、クリックして操作するウォークスルーの作成は行いません。そのどちらかが必要な場合は、OpenScreen が適さない場合を参照してください。

始める前に​

  • ダウンロードページから OpenScreen をインストールします。各プラットフォームの手順はインストールにあります。
  • 動画をどこで見てもらうかを決めます。それによって形が決まります。ウェブサイトやドキュメントのページなら 16:9、縦型のフィードなら 9:16、正方形の枠なら 1:1 です。
  • 製品を準備します。デモ用のアカウントとサンプルデータを用意し、通知をオフにします。

1. ノートウィンドウで台本を書く​

Windows と macOS では、HUD のノートを開くをクリックします。リッチテキストのウィンドウが開き、内容はセッション間でローカルに保存されます。ここに、1 行に 1 つの操作を書く形で台本を書きます。Linux の HUD には、ノートのボタンがありません。

ノートウィンドウは、プロンプターとしても使えます。自動スクロールを開始で、10 から 100 の速度でテキストがスクロールします。フォントサイズは 14 から 48 px まで変えられ、左右反転でテキストを反転できます。

注意

Windows 11 22H2 以降では、OpenScreen は HUD とノートウィンドウをキャプチャから除外します。それより古い Windows では、ノートウィンドウだけを除外します。macOS ではそれを保証できないため、ノートウィンドウは録画しないディスプレイに置いてください。macOS と Linux では、HUD が録画する画面上にある場合は HUDを隠すを使ってください。

2. 画面またはウィンドウを録画する​

  1. Windows と macOS では、ソースピッカーを開き、画面でディスプレイを、またはウィンドウで単一のウィンドウを選びます。macOS 15.2 以降では、代わりに Apple のシステムピッカーでディスプレイやウィンドウを選びます。Linux にはアプリ内のピッカーがなく、テイクのたびにシステムのポータルがソースを尋ねます。OpenScreen には範囲指定のキャプチャがないため、ウィンドウか画面を録画し、エディターでクリップをクロップします。
  2. マイクをオンにして、レベルメーターを確認します。製品が音を出す場合はシステム音声を、自分も画面に映りたい場合はウェブカメラをオンにします。
  3. カーソルモードは、既定の編集可能なカーソルのままにします。ポインターはデータとして記録されるので、あとからスタイルを変えられます。Windows ではクリックが記録されます。macOS では、クリックの記録にアクセシビリティの権限が必要です。Linux では udev ルール(推奨)か input グループで、ユーザーがマウスを読み取れるようにする必要があり、タッチパッドのタップによるクリックはキャプチャされません(詳細)。
  4. 録画を押します。最初に 3、2、1 のカウントダウンが入り、これはオフにできません。

OpenScreen は 60 fps を目標にキャプチャし、Windows と macOS では最大 3840×2160 です。Linux では、サイズはコンポジターが渡すものになります。録画中は、一時停止、テイクのやり直し、キャンセル、停止ができます。

ズームを意識したペースで。 操作する箇所をクリックし、次に進む前にその結果を見せます。手順 4 の自動ズームはクリックに従います。近接したクリックは、同じズームに一緒に収まる場合に 1 つのズームを共有し、そのズームは最後のクリックのあと 1.5 秒間維持されます。動画の最初の 2.5 秒はズームなしのままなので、最初のクリックの前にテイクに少し間を置いてください。

Linux での長いデモ。 Linux が書き込むのは、停止したときに初めて確定される通常の MP4 です。そのため、テイクの途中でクラッシュすると、読めないファイルが残ります。代わりに短いテイクを何本か録画してください。つなげ方は手順 5 で説明します。

HUD のすべてのコントロールについては、画面録画を参照してください。

3. ウェブカメラのレイアウトと背景を選ぶ​

ウェブカメラは独立したファイルに録画されるため、配置は編集の段階で決められ、いつでも変更できます。エディターのインスペクターで、カメラレイアウトパネルを開きます。

  • ピクチャーインピクチャ、縦並び、デュアルフレーム、Webカメラなし。
  • すべてのレイアウトに共通:左右反転と、カメラ映像のクロップ。
  • ピクチャーインピクチャのみ:カメラの形状(既定は正方形。オリジナルはカメラ本来の縦横比を保ちます)、丸み(既定は正方形で 70%、オリジナルで 40%。100% で正方形のカメラは円になります)、15〜60% のサイズ(既定は 40%)、位置(角または辺の中央。既定は右下)、既定でオンのズーム時に縮小。ズーム時に縮小は、ズームの再生中にカメラを小さくして、細部を隠さないようにします。カメラをキャンバス上でドラッグすると、いちばん近い位置に吸着します。
  • カメラ背景:オリジナル、ぼかし、切り抜き、カスタム。切り抜きは、CPU 上で動くセグメンテーションモデルを使い、グリーンバックなしで背景を取り除きます。このセクションは、お使いのパソコンでセグメンテーションのランタイムを読み込めた場合にのみ表示されます。

イントロやアウトロには、C を押してフルスクリーンカメラのセグメントを追加します。その区間では、カメラがフレーム全体を占めます。

コンポジションパネルでは、フレームのスタイルを設定します。背景のセクションには、18 種類の組み込みの壁紙、単色、グラデーション、自分の画像があり、グラデーションにも画像にも同じように動きを付けるアニメーションと、背景のぼかしも設定できます。その下に、影、余白、丸み、モーションブラーがあります。

4. 自動ズームを追加する​

テイクをエディターで開くと、OpenScreen が自動ズームを追加します。記録されたクリックを読み取り、そこにズームインします。ネットワークもモデルも使いません。自動ズームがない状態で開いた場合は、タイムラインのツールバーで自動強化を開き、自動ズームを選びます。何も配置されなかった場合は、その旨が表示されます。よくある原因は、録画にクリックが記録されていない、クリックが録画の最初か最後の数秒にしかない、既存のズームがすでにそのクリックをカバーしているかクリックに近すぎる、のいずれかです。

次に、配置されたズームを確認します。ズームをクリックすると、倍率(1.5× から 3.5× のプリセット、または 5× までの任意の倍率を入力)、フォーカスモード(自動はカーソルに追従、手動は固定した位置を保持)、任意の 3D カメラを設定できます。手動でズームを追加するには Z を、不要なズームを削除するには Ctrl/Cmd+D を押します。

ズームの配置の仕組みについて詳しくは、自動ズームを参照してください。

5. 文字起こしからカットし、無駄な時間を早送りする​

まず文字起こし。 文字起こしパネルを開きます。まだ文字起こしがない場合は、今すぐ文字起こしをクリックします。文字起こしは Whisper でローカルに実行されます。初回実行時には、約 264 MB のモデルを一度だけダウンロードします。

テキストでカット。 文字起こしで単語を選び、Delete を押すと、その区間が再生とエクスポートからカットされます。無音は行内にマーカーとして表示されます。クリックするとカットされ、もう一度クリックすると元に戻ります。カットした単語にマウスを重ねても、元に戻せます。タイムラインで T を押して、トリム範囲を追加することもできます。

カットできない部分は早送り(ページの読み込みや文字入力など)。S を押して再生速度の範囲を追加し、プリセット(0.5×、1×、1.5×、2×、4×)を選ぶか、0.25× から 16× の任意の値を入力します。音声は、速度に合わせてタイムストレッチされます。

複数のテイクをつなげる。 メディアに切り替え、まだ一覧にないテイクはメディアをインポートで追加してから、そのカードをクリップ行にドラッグします。タイムラインの末尾に追加されるので、ドラッグして目的の位置に移動します。メディアライブラリとクリップを参照してください。

自分の LLM プロバイダーを接続していれば、自動強化 → スマートカットで、カットを AI エージェントに任せられます。これは任意の機能で、キーを追加するまではオフです(AI 編集)。元に戻す操作は、エージェントの編集を含めて直近 50 ステップまで保持されます。

6. 見せたくない情報をぼかし、注釈と音を加える​

A を押して注釈を追加し、種類を選びます。

  • ぼかし:ガウスまたはモザイク、長方形または楕円。メールアドレス、API キー、顧客名などの上に配置し、それらが映るすべてのフレームに範囲を広げたら、スクラブして確認します。
  • テキスト:任意でアニメーション(フェード、上昇、ポップ、左へスライド、タイプライター、パルス)を付けられます。
  • 矢印:8 方向。線の太さと色を調整できます。
  • 画像:JPG、PNG、GIF、WebP(ロゴなど)。

音を加えるには、V を押してタイムライン上でナレーションを録音するか、M を押して音楽(mp3、wav、m4a、aac、flac、ogg、opus)を読み込みます。各トラックには、個別のゲイン、フェード、ループ、ミュートがあります。

カーソルパネルでは、手順 2 で記録したポインターのスタイルを変えられます。すべてのツールは、編集とタイムラインに一覧があります。

7. 字幕を焼き込む​

文字起こしパネルで字幕をクリックし、字幕を表示をオンにします。字幕は文字起こしからリアルタイムに描画されるため、手順 5 のカットは追加の作業なしで反映されます。フォント、サイズ、太字、色、背景の下地、位置、1 行あたりの単語数(1〜12)を設定します。フレームの形を変えたあとは、プレビューで配置を確認してください。

Whisper は話されている言語を検出します。メディアステージのこの言語で再生成で、100 言語のいずれかを指定することもできます。別の言語で公開するには、15 の翻訳先のいずれかに翻訳し、エクスポートの前に表示でその言語を選びます。翻訳は自分の LLM プロバイダーを経由するため、キーが必要です。

字幕は動画に焼き込まれます。OpenScreen は .srt や .vtt のファイルを書き出さないため、プレーヤーで字幕をオフにすることはできません。詳しくは、字幕と文字起こしと、字幕機能の仕組みを参照してください。

8. エクスポートする​

形を選ぶ。 コンポジションパネルのフォーマットでは、録画、カメラレイアウト、余白にフレームを合わせる自動(新規プロジェクトの既定)のほか、16:9、9:16、1:1、4:3、4:5、16:10、10:16、またはクリップの元の形を選べます。

エクスポート。 トップバーのエクスポートをクリックします。

  • MP4:720p、1080p、Source。24、30、60 fps。H.264。映像のビットレートは調整できず、1080p60 で約 18.7 Mbit/s、30 fps ではその半分です。
  • GIF:15、20、25、30 fps。サイズは Small、Medium、Large、Original。ループのオン/オフ。GIF はディザリングありの 256 色なので、フラットなインターフェースを映した短いクリップに向いています。

透かしは入りません。別の形でエクスポートするには、フォーマットを変えてもう一度エクスポートします。

プロジェクトを残す。 Ctrl/Cmd+S で .openscreen ファイルとして保存しておけば、製品のインターフェースが変わったときに、クリップを差し替えて再エクスポートできます。プロジェクトはメディアを埋め込まず、参照するだけです。openscreen pack を使えば、すべてをひとつの持ち運べるフォルダーにまとめられます(CLI)。詳しくはエクスポートを参照してください。

ファイルを公開する​

OpenScreen は、動画のホスティング、共有リンクの作成、再生回数の集計を行いません。エクスポートしたファイルを、視聴者が見る場所にアップロードしてください。

OpenScreen が適さない場合​

  • 視聴者の分析やコメント機能が付いた共有リンクが必要。 動画をホスティングする録画ツールのほうが適しています。たとえば Loom は、各録画を loom.com のリンクとして共有し、料金ページには、すべてのプランに視聴者のインサイトと動画へのコメントが記載されています(2026 年 9 月時点)。OpenScreen が適する、より限られたケースについては、Loom の代替としての OpenScreenを参照してください。
  • 視聴者がクリックして進めるインタラクティブなデモが必要。 OpenScreen がエクスポートするのは動画と GIF だけです。
  • 動画プレーヤーに、別の字幕ファイルが必要。 OpenScreen は字幕を焼き込むことしかできません。
  • スマートフォンやタブレットで録画する。 OpenScreen は、Windows、macOS 13 以降、Linux 向けのデスクトップアプリです。

出典​

Loom は、その所有者の商標です。OpenScreen は Loom と提携していません。