イベント登壇時に画面投影で気をつけていること

## この記事の概要

私はそれなりの頻度で勉強会などのイベントに参加しています。
聴衆としても、登壇者としても、どちらもあります。

登壇者が投影した画面を聴衆が見る、という構図ですが、この投影の仕方 1 つで結構満足度が変わります。
内容は良いのに映し方がもったいない人も多いので、この記事をもとに投影の仕方を考えていただけたら幸いです。

:::note warn
私が Mac を使っている関係で、Mac だけの話になっている箇所も多いです。ご了承ください。
:::

## 絶対やった方が良いこと

「より良くする」ための話ではなく「できていないとダメ」に近い内容です。

### マウスカーソルをスライド上の目立つ位置に置かない

画面の目立つ位置に置いてあるのをよく見ます。

以下のようなイメージで、スライドが読みづらくなるので避けましょう。

![](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/214677/721d4664-4054-d354-1368-74affe5914cc.png)

:::note warn
分かりやすいように、上の図ではカーソルをかなり大きく描画しています。
:::

わざわざカーソルを消すためのユーティリティソフトを入れる必要はなく、画面右端に置いておくだけで良いと思います。
左端だとカーソルが画面内に見えるので右端の方がおすすめです。

### 不必要な場面でマウスカーソルを動かさない

前の項目と似ていますが、非常によく見ます。

説明のためのポインターとして使う分にはもちろん良いですが、手元が暇なのかクルクルフラフラしているだけのマウスカーソルは美しくありません。

### 適切な文字サイズや画面解像度、UI の拡大率にする

スライドの文字サイズを意識している人は多いと思いますが、ディスプレイの画面解像度やソフトの表示拡大率は触っていない人も多い気がします。

ハンズオンで、かつ高解像度ディスプレイを使用している場合、聴衆からするとかなり見づらいこともあります。
オンライン配信だと画質も落ちがちなので、なお問題になるでしょう。

Mac の場合でしたら、`System settings > Displays` から変更できます。
個別に表示倍率を変えられるソフト（Visual Studio Code など）もありますが、ここで設定してしまった方が一括で変えられるので楽な気がしています。

![](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/214677/2beb97bd-3dc5-5fea-b0dc-b554c0da135f.png)

試しに 2560 x 1440 と 1920 x 1080 で比較してみました。
一度に表示したいコードの量などにもよるので一概には言えませんが、メジャーである 1920 x 1080 で表示すればよっぽど良い具合になると思います。

| 2560 x 1440 | 1920 x 1080 |
| --- | --- |
| ![](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/214677/82792370-044b-8b5b-6dfd-258eee6e61d2.png) | ![](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/214677/eb0fb459-fbe9-ed34-5585-3ca9e3818e90.png) |

## プラスアルファのこと

気にしない人も多いかもしれませんが、私は細かいことが気になるタチなので、こういったことも意識しています。

あくまで参考程度にどうぞ。

### ブラウザのタブを開き過ぎない

ブラウザ自体を投影する際、開いているタブ数が多すぎる人をよく見かけます。

個人的な感覚として美しくないですし、そうでなくてもタブが多いと「えーっと、どれだっけ」という時間が発生しがちです。
数秒のラグではありますが、聴衆として気持ちの良いものではありません。

発表に使うタブだけを開くようにすれば、3 - 5 つくらいで済む場合が多いと思います。

### 余分なソフトは落としておく

切り替え時に間違えて表示してしまうとか、目当てのソフトにたどり着くまでに時間がかかるとかしてしまうのは美しくありません。

### デスクトップを綺麗にしておく

画面切り替え時にデスクトップが映ることはよくあるので、余分なファイルが無いようにしておきます。
また、壁紙も余分な情報にならないように、一面 `#000` にしています。

画像をダウンロードしてからどうのこうの、みたいなハンズオンの際は、ダウンロードフォルダも綺麗にしておくと美しいでしょう。

### Dock を小さくしておく

Mac を使っている場合、デフォルトの位置、サイズの Dock だと画面占有率がかなり高いです。
ある程度小さくしておく方が親切だと思います。

:::note warn
ちなみに私は小さくどころか完全に隠しています。
`Dockを自動的に表示/非表示` を有効にしても、うっかりカーソルを近づけると出現してしまいノイズになるので、以下のコマンドで実質的に画面に映らないようにしています。
```sh:shell
defaults write com.apple.dock "autohide-delay" -float "1000" && killall Dock
```
:::

### キーストロークやクリックを可視化する

ハンズオンの際のみで、スライド表示の際は実施しません。

何かしらのユーティリティーアプリを入れて、自分が打っているキーや、クリック・右クリックしている箇所を分かりやすくします。

私が使っているものも紹介しておきます。

https://apps.apple.com/jp/app/keystroke-pro/id1572206224

https://apps.apple.com/jp/app/cursor-pro/id1447043133

Cursor Pro に関してはカーソルのある位置を拡大して表示することもできるので「ここにカーソルを合わせるとツールチップが表示されます」みたいな説明のときにも便利です。

### メニューバーのアイコンを最低限にしておく

先ほどの Keystroke Pro と Cursor Pro を使用しているときでも、メニューバーにはこれだけのアイコンしかありません。

![](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/214677/939b6067-6afe-2e95-7839-27a64f67b5ce.png)

コントロールセンターなど消せないものは仕方ないとして、できるだけ最低限にしています。

オフラインだと、発表中に充電ができないこともたまにあるのでバッテリー残量確認のために表示。
話している時間を把握するために時計も表示。
Wi-Fi はよっぽど大丈夫な気がしつつも、いきなり切れたときに把握するために念の為表示。

コントロールセンターは消せないはずなのでそのままにしています。

常駐型のアプリは、アイコンを消しておくか、発表時は落としておくかします。
こんな部分まで気にしている人はよっぽどいないと思いますが、どうせなら美しくスクリーンショットを撮って欲しいのでこうしています。

## 最後に

後半の項目なんて「実施したからどうだというのだ」みたいな内容かもしれません。
ただ、細かいことの積み重ねで視聴体験が良くなるのも事実です。

共感していだける範囲で真似ていただければ幸いです。