Macのスクリーンショット・タイムラプスで進捗を非同期共有する方法

この記事では、Macでの作業セッションを短い非同期の進捗共有にまとめる方法を紹介します。一定間隔でスクリーンショットを撮り、フレームを確認してMP4に書き出し、1行の要約を添えて共有します。

見せたいのが視覚的な進み具合で、正確な時間、ナレーション、すべての判断に対する説明までは必要ない場面に向く形式です。

要点: 作業ウインドウを一定間隔で撮影し、非公開情報や不要なフレームを外して短いMP4にします。共有時には、そのセッションの内容を説明する一文を添えます。

タイムラプスが非同期共有に向く場面

判断、進行を妨げている問題、次の作業を伝えるには文章が向いています。一方、変化の中心が見た目にある場合、文章だけでは伝わりにくくなります。「ヒーローセクションのレイアウトが完成した」と書けば結果は分かりますが、そこに至るまでの試行錯誤は見えません。

スクリーンショットも役立ちますが、Slackのスレッドに15枚を並べると、受け手は1枚ずつ開き、順番を組み立て、時間の流れを推測しなければなりません。

短いタイムラプスなら、一連の変化を1ファイルにまとめられます。受け手は動画で進捗を確認し、画面に現れない判断や背景は添えられた文章で把握できます。

特に役立つ人

フリーランスや業務委託のメンバー。 週次のタイムラプスがあれば、クライアントに見た目の進捗を示せます。フィードバック時に特定のフレームを指してもらうこともできます。

リモートのエンジニアリングチーム。 非同期スタンドアップは、画像があると状況をつかみやすくなります。「ダッシュボードをリファクタリングした」と文章だけで伝える代わりに、変更前、途中、現状を40秒で見せられます。

投資家やアドバイザーへ近況を伝える創業者。 60秒の製品タイムラプスなら、文章だけでは伝わりにくい進展を見せられます。

デザインチーム。 最終モックアップだけでは分からない、途中の案や変化を共有できます。

非同期共有用のタイムラプスを作る

ステップ1：撮影間隔を決める

適切な間隔は、作業中の画面がどのくらい速く変化するかで決まります。

間隔を短くすると再生は滑らかになりますが、確認するフレームが増えます。長くすると要約度は上がりますが、途中の状態を逃すことがあります。多くの非同期共有では、まず10秒から試すと調整しやすいでしょう。

ステップ2：対象ウインドウを選ぶ

フルスクリーンキャプチャには、アプリの切り替え、通知、ほかの表示中ウインドウも含まれます。作業から注意がそれるだけでなく、非公開情報が見えるおそれがあります。

Figma、ブラウザ、コードエディタなど、作業中のウインドウを1つ指定すると、内容に焦点を絞れます。

複数のアプリをまたぐ作業なら、キャプチャセッションを分け、それぞれ共有することも検討してください。Figmaの30秒とVS Codeの20秒に分けたほうが、アプリを慌ただしく行き来する1本の動画より理解しやすくなります。

ステップ3：普段どおりに作業する

キャプチャを開始したら、いつもどおり作業します。ナレーションを入れたり、カメラ向けに一つひとつの操作を演出したりする必要はありません。

見やすく撮るためのポイントです。

• 開始前に通知パネルを閉じる。 ウインドウキャプチャでも、システム通知が対象アプリの上に重なることがあります。
• フルスクリーンまたは最大化したウインドウを使う。 構図が揃い、変化を追いやすくなります。
• 意味のある途中案を残す。 採用しなかったデザインや書き直したコンポーネントも、作業がどう進んだかを伝える手掛かりになります。

ステップ4：書き出す前に確認する

書き出す前に全フレームを確認し、共有したくないものを外します。

• 作業画面の上に出たSlackメッセージやメール通知
• パスワード入力画面やログイン画面
• 個人的な内容を表示したブラウザタブ
• 誤って別のアプリへ移動したときのフレーム

これは、画面収録と比べたときのスクリーンショット方式の利点です。画面収録なら、その部分を切り取るために動画編集が必要です。スクリーンショットなら、不要なフレームの選択を外すだけで済みます。

ステップ5：書き出して共有する

選んだフレームをMP4に書き出します。メールやチャットに添付する前に、ファイルサイズを確認してください。セッションが長いほど、また撮影間隔が短いほど、フレーム数は増えます。

共有先の例：

• Slack／Discord： MP4をチャンネルにドラッグし、投稿前にプレビューを確認します。
• メール： プロバイダの上限に収まる場合は添付します。大きい場合は共有ドライブへアップロードし、リンクを送ります。
• Notion／Confluence： プロジェクトページに埋め込み動画としてアップロードします。
• Loom／Google Drive： 直接送るには大きすぎる場合、アップロードして共有リンクを発行します。
• GitHubのPR： PRの説明に添付します。レビュアーはコード差分と一緒に、見た目が変わる過程を確認できます。

非同期共有の例

フリーランスのWebデザイン

デザイン作業中のFigmaウインドウを撮影し、ほかのクライアント案件が見えるフレームを外します。「今日のセッションで検討したヒーローセクションと料金表の案」のような一言を添えてMP4を共有します。

リモートチームのスタンドアップ

目に見えるUI変更を作業している間、ブラウザまたはコードエディタを撮影します。スタンドアップ用チャンネルでは、判断や進行を妨げている問題を記した通常の文章に動画を添えます。

クライアント案件の節目

スプリント中の代表的なセッションをいくつか撮り、節目の報告に最も合う1本を選びます。見た目の進捗は動画で示し、範囲、判断、問題、次の作業は文章で説明します。

確認しやすい進捗共有にする

共有メッセージで背景を添える

背景のないタイムラプスは、単に速い動画です。共有時は必ず1行の説明を添えます。

• 「ログインフローの再設計。2時間で検討した4つの案」
• 「パフォーマンスダッシュボード。試したグラフ案を含む」
• 「バグ#423の修正。APIレスポンスから描画レイヤーまで」

短くまとめる

目安は30〜60秒です。90秒を超えると、見る側の負担が増えます。セッションがとても長い場合は、全体ではなく重要な区間だけを書き出すことも検討してください。

一定のペースで共有する

毎週金曜日にタイムラプスを送れば、チームやクライアントもその更新を見込めるようになります。少ない手間で状況を共有し、信頼を積み重ねる習慣になります。仕上がりを凝ることより、継続することが大切です。

ごく短い更新にはGIFを使う

作ったUIの操作を5秒ほどで見せるような短い更新なら、GIFが向いています。Slack上で自動的に繰り返し再生され、受け手が再生ボタンを押す必要もありません。ただし、再生時間が10秒ほどを超えるとファイルサイズが急増するため、長い更新にはMP4が適しています。

タイムラプスを使わないほうがよい場面

タイムラプスは、あらゆる連絡手段の代わりになるものではありません。

• 話し合いが必要な判断： 文書にまとめるか、打ち合わせを設定します。タイムラプスが見せるのは進捗であり、判断の理由ではありません。
• 時間順が重要なバグ報告： 正確な流れを残せる特定のスクリーンショット、または短い画面収録を使います。
• アーキテクチャの議論： 抽象的な概念には文章と図を使います。
• 緊急の問題： 問題を動画の中に埋め込まず、担当者へ直接連絡します。

タイムラプスが最も得意なのは、時間とともに変わる見た目の進捗を示すことです。その用途に絞り、それ以外には適した手段を選びましょう。