プレゼンで使うスクリーンショットは、一つの事実を見つけやすくするためのものです。ボタンを探すためにブラウザー画面全体を読まなければならないなら、発表者がすべき説明を聞き手に任せてしまっています。どの画面か分かるだけの情報を残し、必要な箇所を拡大して、そこから何が分かるのかを説明しましょう。
まず、その画像で裏付けたい一文を書きます。たとえば「すでに元の文章がある場合は、Paste Textを使う」です。その文の意味が伝わるように、切り抜く範囲と注釈を選びます。これは単に画像を大きくすることではなく、スライド全体のレイアウトや見せ方を整える作業の一部です。
スクリーンショットで何を示すかを決める
スクリーンショットには異なる役割があります。位置を案内する画像は製品内のどこにいるかを示し、操作説明の画像は次にすることを示します。結果の画像は、操作後に何が起きたかを示します。役割ごとに、見せる範囲も変える必要があります。
- 位置の案内:ページタイトル、選択中のセクション、画面を特定する助けになる周囲の操作項目を残します。
- 操作の説明:対象の操作項目を読める大きさにし、似た項目と区別するための周辺情報を示します。
- 結果の説明:実際に表示された出力や状態と、それが何によって生じたか分かるだけの情報を示します。
「Generate」ボタンの画像が示せるのは、その操作項目が存在することです。プレゼン資料が正常に生成された証拠にはなりません。同じように、空の編集画面は完成ファイルの証拠ではありません。実際に撮影した状態に、主張の範囲を合わせてください。
実例:Presentiの二つの入力方法を説明する
Presentiの公開テキストからプレゼン資料を作る機能を例にします。この例で確認した英語の入力画面には、「Enter a topic」と「Paste Text」が表示されます。すでにメモを持っている人にとって重要なのは、短いテーマだけでなく、用意した文章を入力する方法もあることです。
ページ全体を撮影すると、ナビゲーション、機能紹介、例、フッターまで入ります。これらは状況を伝える情報ではありますが、全体を1枚のスライドに収めると入力項目が小さくなります。この例では、スクリーンショットそのものが説明の対象です。入力方法の選び方を示すのであって、資料を生成済みだと主張するわけではありません。
画面1:操作場所が分かるだけの範囲を示す
ページの見出しと入力方式の切り替え部分が入る、少し広めの画面を使います。関係のない下部のセクションは、このスライドには含めません。聞き手がどのページかを認識し、次に説明する領域を見つけられることが大切です。
製品名や操作項目のラベルは、撮影した状態を保ちます。きれいに見せるためにUIを描き直したり、画像内にはない日本語ボタンを作ったりしないでください。別の言語で説明する場合は、英語のラベルの意味をキャプションや口頭説明で補います。
画面2:重要な選択肢を拡大する
二つの入力方式と入力欄の上部が入る範囲を切り抜きます。両方を残すことで、「Enter a topic」はアイデアから始める方法、「Paste Text」は元の文章を渡す方法だという違いが分かります。「Paste Text」という文字だけに切り詰めると、この比較が失われます。
選択した方式は、一つの囲み線か短い矢印で示します。読者が見分ける必要のある文字を隠さないよう、注釈はラベルの外側に置きます。既存の操作項目を指し示すものであり、新しい項目を追加したように見せないことが重要です。
画面3:説明に必要な場合だけ、入力済みの内容を見せる
次に伝えたいことが有用なメモの渡し方なら、その作業に合った短い指示文を入力した画面を撮ります。対象読者、伝えたいメッセージ、保持すべき事実を含めます。例を読めるだけの面積を確保し、文書全体を画像に詰め込んで読ませようとしないでください。
読者がコピーする必要のある指示文は、選択可能なスライド内の文字や、併記する記事の本文として残します。スクリーンショットはどこに入力するかを示し、再利用する情報は文章が担います。入力方式の選び方だけを説明する資料なら、3枚目の画像は不要です。
意味を変えずに、不要な部分を切り取る
切り抜く前に、周囲のどの要素が画像の解釈に影響するかを考えます。無効になっている操作項目、未保存を示す表示、選択中のフィルター、警告などは重要な場合があります。その一つを取り除くことで、正しく撮影した画像が誤解を招く証拠になってしまうことがあります。
設定の手順なら、選択中のセクションと設定名を残します。グラフなら、関係する軸、単位、凡例を残します。検索結果なら、その結果を説明する検索語とフィルターを残します。条件を示す情報よりも、まず余白や無関係な画面枠を削ってください。
元のキャプチャーは編集後の画像とは別に保存します。仕上がりを確認できる画像編集ソフトで切り抜き、その画像をスライドに配置します。装飾枠を埋めるために縦横に引き伸ばす必要があるなら、別のレイアウトを選びましょう。円、文字、操作項目は元の縦横比を保つ必要があります。
読めない画像は、シャープ化より見せる範囲で直す
完成したスライドを、聞き手が実際に見る大きさで表示します。ビデオ会議中のノートパソコンでは、画像単体を原寸で見れば鮮明でも、スライド内に収めると読めないことがあります。
重要な操作項目を判別できない場合は、次の順で試してください。
- 必要な周辺情報を保ちながら、関係のない領域を切り取る。
- 装飾で囲むのではなく、スライド内で画像に使う面積を増やす。
- 全体像の後に詳細を示すか、全体像と対応関係が分かる拡大図を並べる。
- 読む必要のある文章を編集可能なスライド本文に置き換え、画像は補足の根拠として残す。
シャープ化や拡大処理でも、元から記録されていない情報は取り戻せません。元画像が小さすぎる、または圧縮が強すぎる場合は、元の画面で撮り直します。一部を拡大するなら、全体と詳細の関係を明確にしてください。同じ画面の二つの切り抜きを、別々の製品状態のように見せてはいけません。
注釈で視線を導く
1枚の画像を大量の矢印で埋める必要はほとんどありません。一つの操作なら、通常は一つの印で十分です。手順を示す場合は順番が分かるように並べ、UIの状態が変わったら新しい画像を撮ります。
入力方式を選び、文章を貼り付け、生成された下書きを確認するチュートリアルを考えてみましょう。空の入力ページに番号を付けただけでは、この三つを完了した状態は示せません。実際に実施した各段階を別々に撮るか、図解は入力準備ができたところで止めます。実画面が用意できるまでは、その後の手順を文章で説明してください。
キャプションは、「Paste Textが選択され、用意した説明用メモが入力されています」のように、情報を加える短い文にします。「スクリーンショット」と繰り返すだけの文や、「ワンクリックで完璧な資料」といった根拠のない約束は避けます。
共有前に個人情報や機密情報を取り除く
作業領域の中だけでなく、その外側も確認します。ブラウザーのタブ、アカウントメニュー、通知、文書名、アドレス、サイドパネルから、説明と無関係な情報が見えることがあります。可能なら安全な例示用ワークスペースを使い、撮影前に不要なパネルを閉じます。
情報を隠す必要がある場合は、加工済みの別画像を作り、書き出した画像のピクセルを確認してください。編集可能な資料の中で、元画像の上に動かせる四角形を重ねるだけでは不十分です。受け取った人が図形を移動したり、下の画像を取り出したりできる可能性があります。機密の文字列には、文字が読める余地のある弱いぼかしではなく、不透明な塗りつぶしを使います。
情報を隠しても、説明の意味は変えてはいけません。アカウント名を消すことと、操作できない理由を示す警告を消すことは違います。警告が重要なら残し、安全な例示用アカウントを選ぶか、その制約を説明します。
画像を見なくても理解できる手段を用意する
重要な指示は、スクリーンショットの中だけでなく、文章でも示します。簡潔な代替テキストなら、画像の目的と該当する状態を説明できます。たとえば「元の文章を入力する欄の上で、Paste Textが選択されているPresentiの入力方式切り替え部分」です。すべてのナビゲーション項目を列挙したり、キャプション全体を繰り返したりする必要はありません。
キャプションとコピー可能な例文は、画像の近くに置きます。小さい画面で読む人、画像の細部を確認できない人、後から資料を見直す人の助けになります。密度の高い表が画像に含まれるなら、必要な数値を本文やアクセスしやすい表でも提供し、同じデータの画像をもう1枚下に置く方法で済ませないようにします。
画像ファイルだけでなく、スライドを確認する
最終資料を、実際に使う発表モードや書き出し形式で開きます。枠によって画像が切れていないか、注釈が意図した操作項目を指しているか、次の操作が読めるかを確かめてください。「変更前」と「変更後」を比べる場合は同等の縮尺にし、サイズの違いが製品の改善と誤解されないようにします。
最後にスライドタイトルを読み、画像が本当にその内容を裏付けているか考えます。元の文章を貼り付ける場所を説明するタイトルなら、入力画面で示せます。使える資料が生成されたと述べるタイトルなら、実際の結果と、その結果の適切な確認が必要です。良いスクリーンショットのスライドは、観察した内容を明確にしつつ、画像が示せる以上のことを主張しません。