FIRST CH TOOLS / 画像 / 71 SCREEN RECORD

画面録画+クリック自動ズーム

操作説明やデモ動画の素材を、ブラウザだけで録ります。録りながらクリックした所へ自動で寄るので、小さなボタンや文字もはっきり映り、あとから編集ソフトでズームを付ける手間が要りません。インストール不要で、録画はこのタブの外へ出ません。

1 — 録画の設定

録画の設定
余白色

2 — 録画

録画した映像と音声はこのタブの中(メモリ)にだけ置かれ、サーバーへは送信しません。「動画を保存」を押すまでどこにも書き出さず、タブを閉じれば消えます。

How to Use

  1. 音声とズームを決めるマイクで説明を入れるか、タブの音も一緒に録るかを選びます。寄り方は「2倍・標準」から始め、寄りすぎるなら「控えめ」、ボタンが小さい画面なら「敏感」にします。余白と余白色は、動画の周りに敷く額縁です。
  2. 録画を始めて、画面を選ぶボタンを押すとブラウザの共有画面が開くので、録る画面全体・ウィンドウ・タブのどれかを選びます。あとはいつもどおり操作するだけで、クリックした所へ自動で寄り、しばらく操作が止まるかページが切り替わると全体へ戻ります。
  3. 止めて保存するこのタブに戻って「録画を止める」(またはブラウザの「共有を停止」)を押すと、その場で再生して確かめられます。「動画を保存」で WebM ファイルとして保存します。

About This Tool

操作説明やデモ動画の素材を、編集ソフトを開かずに録るためのツールです。素の画面録画だと、1920px の画面全体が縮んで映り、クリックしたボタンも小さな文字も見えません。このツールは録りながらクリックした所へ寄るので、あとからタイムラインでズームを付ける手間が要りません。トリム・字幕・トランジションなどの編集機能はあえて持たせていません。録れた WebM は、そのまま動画編集ソフトや YouTube・X に渡せます。

寄る先は、録っている映像の変化から決めます。ブラウザは、共有した別のウィンドウやタブの中でどこをクリックしたかをページに教えません(できるのは画面の映像を受け取ることだけです)。そこで 0.1 秒ごとに映像を小さく縮めて前のコマと比べ、ボタンの押下・メニューの展開・入力欄のフォーカスのような一か所にまとまった変化を見つけたら、その中心へ寄ります。マウスポインターが動くだけの小さな変化は拾いません。画面の大半が一度に変わった(スクロール・ページの切り替わり)とき、約2.6秒なにも起きないとき、寄ってから8秒経ったときは全体へ戻ります。寄っている間に離れた場所で変化が起きれば、そちらへ横に移動します。動画の再生やアニメーションのようにクリックと関係なく動く部分にも寄ってしまうので、そうした画面では「控えめ」にするか「ズームしない」を選んでください。

ズームしても文字がにじみにくい理由。映像は元の画面の解像度のまま受け取り、寄るときはその一部を切り出して書き出しの大きさへ描き直します。Retina などの高解像度の画面を「長い辺 1920px まで」で書き出せば、2倍に寄っても元の画素をほぼそのまま使えます。余白を付けると、画面の周りに選んだ色の額縁を敷き、角を少し丸めます。共有中にウィンドウの大きさが変わっても、縦横比を保ったまま余白の中に収めます。

音声について。マイクは初回にブラウザが許可を求めます。画面の音(再生中の動画や通知音)を録れるのは、Chrome・Edge でタブを共有したとき(Windows・ChromeOS は画面全体も)で、共有の画面にある「タブの音声も共有する」にチェックが要ります。Mac でウィンドウや画面全体を共有したときは、ブラウザの仕様で画面の音は付きません。両方を選ぶと、ブラウザの中で1本の音声に混ぜて書き出します。

対応ブラウザと注意点。パソコンの Chrome・Edge を推奨します(このタブを裏に回しても、映像を取り込み続ける仕組みが使えます)。Firefox・Safari でも録れますが、録画中にこのタブを裏に回すとコマが止まることがあるので、このタブを別のウィンドウに分けて表示したまま操作してください。Safari など WebM を書き出せないブラウザでは MP4 で保存します。スマートフォン・タブレットのブラウザは画面の取り込みそのものに対応していません。Mac では最初に「システム設定 → プライバシーとセキュリティ → 画面とシステムオーディオの録音」でブラウザを許可する必要があります。録画はメモリに溜めるので、フルHDで1分あたり数十MBが目安です。長く録るときは、こまめに止めて保存してください。

録画データは送信しません。画面の取り込み・ズームの合成・WebM への書き出しは、すべてこのタブの中(ブラウザの MediaRecorder と Canvas)で行います。映像と音声がサーバーへアップロードされることはなく、保存も「動画を保存」を押したときに手元へ書き出すだけです。なお、このサイトはページの閲覧数をアクセス解析で数えていますが、録画の中身や設定は計測に含めません(プライバシーポリシー)。

関連するツール。動画ではなく静止画のスクリーンショットに背景・余白・角丸・影を付けるなら スクリーンショット枠装飾、動画のサムネイルやOGP画像を作るなら OGP画像ジェネレーター、長い録画の間に画面が消えないようにするなら スリープ防止 が使えます。

Other Tools