見てすぐ真似できるターミナル・CLIデモの録画方法

ターミナルのデモは、開発者が作れる動画のなかでもとくに役立つものです。そして同時に、とくに見づらいものでもあります。小さな等幅フォント、流れ続ける出力、誰かが読み終える前に画面の上へ消えていくコマンド。視聴者は2分で離脱します。

解決策はほぼすべて準備にあります。読めるターミナル録画は、録画ボタンを押す前に作られるものであって、あとから救済するものではありません。その手順をひと通り見ていきましょう。

ターミナル録画が見づらい理由

GUIの画面録画には、ボタンやアイコン、レイアウトといった視覚的な手がかりがあります。ターミナルにはそれがありません。すべてが同じ大きさ、同じ色で、しかも速く動きます。問題はいつも同じです。

• 文字が小さすぎる: 目の前では快適なフォントサイズでも、1080pの動画を小さなウィンドウで再生すると読めません
• コントラストの低いテーマ: ほぼ黒の背景に薄いグレーはモニターでは上品ですが、動画圧縮後には消えてしまいます
• 流れ去る出力: 肝心の1行が、コマンドの説明をしている間に通り過ぎてしまいます
• 見えない入力: 視聴者にはキー入力が見えないため、素早く打ったフラグは魔法のように映ります
• 空白の時間: インストール、ビルド、テスト実行は、何も起きない30秒を生みます

いずれも5分以内に対処できます。

録画前にターミナルを整える

デモ用のターミナルは、普段の作業用ターミナルとは別物として扱いましょう。多くのターミナルアプリはプロファイルに対応しています。「Recording」プロファイルを作り、一度だけ設定しておけば済みます。

• フォントサイズは18〜24pt: 普段の約2倍です。モニター上でばかばかしく大きく見えるなら、たいてい動画にはちょうどよいサイズです
• 高コントラストのテーマ: 単色の暗い背景に明るい文字。透過や背景画像は使わないでください。圧縮に弱く、視覚的なノイズを増やすだけです
• 全画面ではなくウィンドウサイズで: 大きすぎる全画面ターミナルは、フレームに対して文字を小さくします。90〜100カラムほどのウィンドウが16:9のフレームにきれいに収まります
• 紛らわしいリガチャはオフに: -> や != を矢印記号に置き換える機能は、コマンドを書き写そうとする視聴者を混乱させることがあります
• 行間をわずかに広げる: ほんの少しの余白で、密度の高い出力がぐっと読みやすくなります

シェルを片付ける

プロンプトと履歴には、思っている以上の情報が載っています。録画の前に。

• プロンプトを簡潔に: gitブランチ、Nodeのバージョン、タイムスタンプ、2行のパスが入った長いプロンプトは横幅を食い、注意をそらします。短い ~/project $ が理想です
• ユーザー名とホスト名を隠す: 公開するかもしれない動画で、あなたとあなたのマシンを特定できてしまう情報です
• スクロールバックと履歴を消す: 過去のコマンドから顧客名、社内ホスト名、無関係な作業が見えることがあります
• 環境変数を確認する: 動画内の env の出力は、どんなコード片よりも多くのAPIキーを流出させてきました
• 使い捨てのディレクトリを使う: きれいなプロジェクトフォルダなら、ls の出力に無関係なファイルが混ざりません
• 通知を切る: ターミナルのベルもデスクトップ通知も、テイクを台無しにします

デモで実際の認証情報が必要なら、ダミー値を使いましょう。あとから隠す作業は、事前に API_KEY=demo-key-1234 と設定しておくよりずっと手間がかかります。

コマンドの流れを設計する

録画前に、打つコマンドを記憶に頼らずメモファイルに書き出しておきましょう。何を、どの順で打つかを書いた短い台本には三つの効果があります。緊張下でのタイプミスを防ぎ、デモを一本の線に保ち、そのままナレーションの下書きになります。

そのうえで、録画せずに最初から最後まで一度通してみてください。キャッシュがすでに温まっていた、足りない依存関係があった、忘れていた確認プロンプトが出た——こうした想定外がここで表に出ます。実行後はディレクトリを元に戻し、本番も同じ状態から始められるようにします。

ターミナル作業向けの録画設定

ターミナルの内容はほぼ静的なテキストなので、ある面では寛容で、ある面では厳しくなります。

• 画面全体ではなくウィンドウをキャプチャ: ウィンドウキャプチャならフレームがターミナルに収まり、デスクトップの他の要素が写りません
• 30fpsで十分: テキストに60fpsは不要です。フレームレートが低いほど、同じビットレートで文字が鮮明になります
• ディスプレイのネイティブ解像度で録画: あとから拡大した瞬間にぼやけます
• ウェブカメラは省くか小さく: ターミナルデモの主役は出力です。大きなピクチャ・イン・ピクチャは画面下隅を覆いますが、新しい出力が現れるのはまさにそこです

多くの人が外すポイント：テンポ

良いターミナルデモのリズムは、あなたが実際に作業するリズムとは違います。

1. 打つ前にこれから何をするかを言う: 「ではCLIをグローバルにインストールします」
2. 一定のはっきりした速度で入力する。普段より遅く、しかし不自然にならない程度に
3. Enterを押す前に一拍おく。コマンド全体が見えて読める時間を作ります
4. 出力が流れている間は黙り、そのあとで解説します
5. 出力を全部読み上げず、大事なところだけ指し示します

長いコマンドは、まず基本のコマンドを打ち、次にフラグを足すという二段階で見せながら、各フラグの意味を説明するとよいでしょう。40文字の行が一度に現れるより、はるかに追いやすくなります。

時間のかかるコマンドの扱い

90秒の npm install を眺めたい人はいません。良い選択肢が三つあります。

• スピードランプ: コマンドは見せたまま、待機部分を4〜10倍速で流し、実行されたことは伝えつつ待たせません
• 待ち時間をカット: コマンド開始から結果が出る直前までを切ります。プロンプト行でカットすれば編集点は見えません
• キャッシュを温めておく: 録画前に一度実行しておけば、本番では自然に数秒で終わります

どれを選ぶにせよ、実際にどれくらいかかるかは口で伝えましょう。「通常は2分ほどかかります」と言っておけば、自分で試す人が驚かずに済みます。

エディターで出力を読みやすくする

まずまずのターミナル録画を良い録画に変えるのが編集の工程です。

• 重要な出力にズーム: 肝心の3行へズームインするほうが、ログで埋まった画面を目を細めて見てもらうよりずっと効果的です
• 主要なコマンドにテキストオーバーレイ: コマンドを字幕のように画面に出すと、ナレーションを聞きながら読むものができます
• エラーメッセージに注釈: 意図的に失敗を見せるときは、原因を説明している行を強調しましょう
• チャプターを付ける: インストール、設定、初回実行、トラブルシューティング。ターミナルデモは手を動かしながら見るものなので、巻き戻しが頻繁に起きます
• 無音を削除: 自動無音除去は、話し方に手を加えずコマンド前後の間だけを詰めてくれます

ターミナルと他のウィンドウを混ぜる

現実のデモはターミナルだけでは終わりません。コマンドを実行し、ブラウザーを確認し、設定ファイルを編集します。

• 録画前にレイアウトを決める: ターミナルとブラウザーを並べるか、全画面で切り替えるか。どちらかに決めて最後まで通します
• ウィンドウを切り替えるときは一拍おく: 視聴者が変化に気づく0.5秒を与えてから話を続けましょう
• フォントサイズをそろえる: 大きなターミナルフォントの隣の小さなエディターフォントは読めません
• 範囲キャプチャも検討: 2つのウィンドウ配置が固定なら、その領域をキャプチャすると動画全体の構図が安定します

録画前チェックリスト

[ ] 録画用プロファイル適用：大きなフォント、高コントラストテーマ、透過なし
[ ] プロンプトを簡潔化、ユーザー名とホスト名を非表示
[ ] スクロールバックと履歴を消去
[ ] 秘密情報をダミー値に置き換え
[ ] コマンドの流れを書き出し、1回リハーサル
[ ] 作業ディレクトリをきれいな状態にリセット
[ ] 通知とターミナルベルを無効化
[ ] ウィンドウキャプチャを選択、30fps、ネイティブ解像度
[ ] 10秒のテスト録画で読みやすさを確認

最後の項目がいちばん重要です。10秒だけ録画し、視聴者が実際に見るサイズで再生して、文字が無理なく読めるか確かめてください。読めないならフォントを大きくして再確認してから、12分の本番に入りましょう。

よくある失敗

• 4Kディスプレイで全画面録画: 書き出した動画で文字が極小になります
• 画面を消しすぎる: 直前に何が起きたかの文脈が失われます
• 録画中にターミナルをリサイズ: テキストが再配置されて見づらくなります
• 出力をそのまま読み上げる: 「テストは12件すべて通りました」のように要約しましょう
• 静止画面でカーソルだけ点滅: その尻尾は切りましょう。動画が止まったように感じられます
• 自分のエイリアスを知っている前提: gs と打つなら、それが git status だと伝えてください

まとめ

ターミナルデモの成否は読みやすさで決まります。フォントを大きくし、高コントラストのテーマを選び、プロンプトを整え、流れをリハーサルし、Enterの前に一拍おく。そのうえで編集ではズーム効果とスピードランプを使い、視線を重要な出力に留めます。そこまでやれば、あなたのコマンドライン解説は「耐えて見るもの」ではなく、ターミナルを隣に開いて一緒に手を動かすものになります。