デモデータの準備:録画映えするデモ環境をつくる

リアルなデモデータは画面録画の説得力を左右します。デモアカウントの作り方、サンプルデータの命名、撮り直しのための状態リセットを解説します。

デモデータの準備:録画映えするデモ環境をつくる

多くの画面録画は、録画ボタンを押す前にすでに失敗しています。音声や照明、テンポの問題ではありません。画面に映っているものが問題なのです。空のダッシュボード、「asdf テスト 3」という名前の顧客、データポイントが1つしかないグラフ、そして最悪のタイミングで滑り込んでくる同僚からの通知。

デモデータは舞台美術のようなものです。視聴者は良いデモデータを意識することはありませんが、悪いデモデータには必ず気づきます。そしてそれは静かに信頼性を削っていきます。このガイドでは、本物らしく見え、きれいに録画でき、何度の撮り直しにも耐える環境の準備方法を紹介します。

まず専用のデモアカウントを用意する

業務用アカウントで録画してはいけません。日常的に使うアカウントには、やりかけの実験や個人情報、撮影に失敗したときに再現できない状態が詰まっています。

録画のためだけに存在する別のアカウント(あるいはワークスペース、テナント、プロファイル)を作りましょう。

  • 中立的な人格:自分の顔とメールアドレスではなく、それらしい名前と汎用的なアバターを持つデモユーザー。
  • クリーンな権限:一般的な新規顧客が目にする範囲に。管理者専用機能をうっかり見せないために。
  • 再現可能:数分で既知の状態に戻せること。

製品がシードデータやフィクスチャに対応しているなら、このアカウントをゼロから作るスクリプトを書いておきましょう。スクリプトに費やす5分は、3回目の撮り直しで十分に元が取れます。

サンプルデータの名前は意図的につける

プレースホルダーの名前は、質の低いデモで最もよくある兆候です。「テストユーザー1」「aaa」「Lorem ipsum プロジェクト」は、どれも誰も準備に気を配らなかったことを示しています。

良いサンプルデータにはいくつかのルールがあります。

  • それらしく、しかし明らかに架空であること。 「ノースウィンド物流」「ハーバーコーヒー」は実在の企業のように読めますが、特定の顧客を連想させません。
  • 形が揃いすぎないこと。 短い名前と長い名前、1語と複数語を混ぜましょう。均一なデータはレイアウトの問題を隠し、人工的に見えます。
  • 実在の顧客情報を含まないこと。 ぼかしを入れるとしても、実際の取引先名が入ったアカウントは録画しないでください。リアルさが必要なら、CRMではなくフィクションから名前を借りましょう。
  • 文化的に中立か、意図的に多様であること。 グローバルな視聴者が対象なら、一国の名前だけが並ぶリストは視野が狭く見えます。

省略表示されたり、はみ出したりする文字列も確認しましょう。サイドバーで「第3四半期 地域別業績…」のように切れていると、未完成な印象を与えます。

データの密度を適切にする

空の状態はデモではありませんし、400行の羅列もデモではありません。健全に稼働しているアカウントが見せるであろう密度を目指しましょう。

  • リスト:表示領域を満たし、下にまだ続くと感じさせる程度に。ただし目的の項目を探してスクロールする必要はないように。
  • グラフ:成長、落ち込み、回復といったストーリーのあるトレンドを。平坦な線や単一の棒は、機能を無意味に見せます。
  • 日付:最近かつ相対的に。8か月前のタイムスタンプは動画を一瞬で古く見せます。可能ならば録画前にすべてのタイムスタンプを前倒ししましょう。
  • 数値:現実的な規模で。売上1,200円はテストに見えますが、1,284万円はビジネスに見えます。

クリックする予定のレコードは、予測しやすい位置に置きましょう。上のほうが良いですが、常に1行目である必要はありません。作り込みすぎた印象になります。

周辺環境を片づける

デモアカウントは画面の半分にすぎません。録画前に次を確認しましょう。

  • 関係のないタブを閉じ、個人的なリンクの入ったブックマークバーを隠す。
  • おやすみモードをオンにして、メッセージやカレンダーの通知が映り込まないようにする。
  • 中立的な壁紙を使い、デスクトップ上のファイルを片づける。
  • 高解像度ディスプレイ上ではなく、最終的な書き出しサイズで読める倍率にブラウザやアプリを設定する。
  • アバターや自動入力候補が現れる可能性のある個人アカウントからサインアウトする。

Recorded では、全画面ではなく単一ウィンドウをキャプチャするだけで、こうした問題の多くが一度に解消します。ウィンドウキャプチャなら、Dock やメニューバー、2台目のモニターは自動的に画面外になります。

状態をリセットできるようにする

デモは破壊的です。項目を削除し、フォームを送信し、招待コードを使い切ってしまえば、2回目の撮影では見せるものが残りません。

録画前に、開始状態へ戻す方法を決めておきましょう。

  • スナップショットを取る。 データベースのダンプ、複製したワークスペース、コマンド1つで復元できるフィクスチャ。
  • スクリプト化する。 短いシードスクリプトは、深夜に15件のレコードを手作業で作り直すよりはるかに確実です。
  • あるいは破壊の逆順で録画する。 「項目が並んだリスト」のカットを先に撮り、その後で削除フローを撮ります。

リセットできると分かっているだけで、録画から緊張が消えます。データを守ることに気を取られず、ナレーションに集中できるようになります。

ストーリーに合わせてデータを設計する

最良のデモデータは、台本から逆算して設計されます。構成をたどりながら、各場面で何がすでに存在している必要があるかを確認しましょう。

  1. 冒頭のカットには、実際に使われている雰囲気のアカウントが必要です。
  2. 中盤には、中核機能を見せるための特定のレコードが必要です。口に出して言える名前で事前に作っておきましょう。
  3. 締めくくりには、目に見える結果が必要です。完了ステータス、書き出しの終了、動いたグラフなど。

長いアップロード、バックグラウンド処理、メールの到着など待ち時間が発生する手順があるなら、完了後の状態を事前に用意しておき、そこへ切り替えるか、エディターで待ち時間を早送りしましょう。

録画前のデータチェックリスト

  • 個人アカウントではなくデモアカウントで録画している
  • 画面のどこにも実在の顧客名や従業員名がない
  • サンプル名がそれらしく、多様で、架空である
  • リストとグラフに現実的な密度と分かるトレンドがある
  • 日付やタイムスタンプが最近に見える
  • 通知をオフにし、関係のないタブを閉じた
  • クリックするレコードを事前に作り、見つけやすくしてある
  • 2回目の撮影に向けたリセット手順がある

録画前の15分をここに使えば、1時間の撮り直しを節約できます。そしてその差が、製品らしく見える動画と試作品に見える動画を分けます。

環境さえ整えば、あとは簡単です。ウィンドウをキャプチャし、ストーリーをたどり、仕上げはエディターに任せましょう。