登壇する際に意識することは何か

# はじめに
Androidエンジニアのナベです。
自分は2018年9月にand factoryにジョインし、漫画アプリの開発をしながら開発チームのスクラム支援や技術負債について事業部の開発メンバーの助けを借りながらボトルネックを解消してきました。その過程で転職活動や開発業務によって得られた気づきを共有する機会として、弊社初となる外部のエンジニアを招いたイベントを開催する運びとなり2018年下半期は何度か登壇させてもらうような経験をしました。社内のエンジニアも続いてand factoryが開催するイベントや社外の勉強会で登壇する機会が増えてきました。

- [【レポート前編】and factory初イベント！【マンガＵＰ！、マンガPark、GANMA!】漫画アプリ開発の裏側、全部お見せします！ を開催しました。](https://www.wantedly.com/companies/andfactory/post_articles/131656)
- [【レポート】and factory Beer Bash #2 を開催しました！](https://www.wantedly.com/companies/andfactory/post_articles/130326)

今回はイベントなどで登壇をする機会がある方に向けて、登壇を成功させるために意識することをまとめたいと思います。（イベントに限らず社内の勉強会でもスライド資料を作って発表する機会がある方にもみていただけると幸いです)

# トピックの選定

トピックは参加者の傾向や過去のトピックを参考して登壇するイベントの趣旨をあっていることを確認し（当たり前ですが)、まずキーワードを並べ、それをどのように語るかを組み合わせます。

<img width="320" src="https://qiita-image-store.s3.amazonaws.com/0/206165/e231e0de-b292-aa05-6642-ba20b474780a.jpeg">


```
キーワード × どう語るか = トピック
```
基本的にトピックは、この組み合わせによって成り立っています。

# 課題意識を明示する
発表内容には一体どんなモチベーションがあるのでしょうか。
登壇における成功は自分の経験に裏付けされた成功や失敗、技術的なモチベーションを観客に伝えて理解してもらうことです。そして観客はその問題に直面したときに(あるいは直面する前に回避するために）、解決の糸口として発表内容を思い出し行動を起こすのです。

発表において重要なのは要素を絞り込むことで「What(何)」ではなく「So What（だから何)」です。それが課題意識となりポイントが整理され観客の理解をサポートしてくれます。

# 自己紹介
自己紹介のスライドは必要ないという考えもありますが、自分はあったほうがいいと思います。社内の勉強会資料でもコピペでいいので用意しておくと新入社員には助かるでしょう。自己紹介しておくことで登壇後の懇親会などで全く面識のなかった人から声をかけられる可能性がグッと上がるからです。あなたは誰ですか？何の仕事をしていますか？普段何に関心をもって仕事に取り組んでいますか？twitterのIDは？そんなことを書くといいでしょう。

# 文字と箇条書き

TEDなどのプレゼンを見ると画像だけ、もしくは画像に一言テキストがあるだけのようなスライドを見かけますが、それは内容をインパクトを与えて感情によりそう目的があるためです。後ほど紹介しますが感情やエモい話をする場合は良いと思いますが、技術的な内容のスライドにはそれが当てはまらない場合が多々あります。

![Dec-02-2018 17-37-44.gif](https://qiita-image-store.s3.amazonaws.com/0/206165/cf856d08-8b22-9061-1779-b6e9b9f127b8.gif)

事実をきちんと伝えたい場合、テキストを箇条書きにするのが良くあるアプローチです。余白を残しすぎないように、文言を出来るだけ短く、文字を大きくします。小さすぎるよりも大きすぎる方に誤っているほうが全然良いです。文言を短くするということはシンプルにするということです。コードを書くときと一緒で難しい作業ですが単純にすることとシンプルにすることは違います。情報は多ければ多いほど良いという考えは（多い理由があることはわかるけれど）受け手に意図を汲み取れと丸投げしていることになるので、文言をデザインして伝えることに手を抜かないことがプレゼンにはとても大事なことです。

１つのスライドには６行を目安にテキストの長さを調節するのが良いです。２３インチのモニターをつかっているのであれば５mくらい離れても見えるかどうか一度チェックしてください。６行以上あるとちゃんと読めないかもしれません。


# 視覚的な表現

![Nov-21-2018 01-12-40.gif](https://qiita-image-store.s3.amazonaws.com/0/206165/ded8ce7d-851f-f53c-1cb1-eb157ad884d3.gif)

箇条書きのスライドにアニメーションをつけることは有効です。文字がたくさん書いてあると観客はそれを読んでしまい、登壇者の話している内容と観衆が読んでいるテキストの内容が同期せず登壇者の話に集中できないからです。１つ１つ表示させながら話すことで観衆と足並みを合わせることができます。

![Nov-21-2018 01-46-43.gif](https://qiita-image-store.s3.amazonaws.com/0/206165/355e19f1-2e5a-fd02-f0a6-996043836318.gif)
(The Future of Dependency Injection with Dagger 2より)

アーキテクチャやDependency Injectionなど抽象的で複雑な内容をテキストのみで伝えるのは難しいことです。図やアニメーションを駆使してビジュアルで訴えることはより、スライド資料は観客に内容を伝えることをサポートしてくれます。

# EYE CANDY
EYE CANDYとは見る人の目を喜ばせるような人や物事を意味するスラングなのですが、スライド資料を作る際には、図表や写真、絵柄を入れたほうが良いです。そうすることでより観衆のビジュアルに訴えかけることができます。

<img width="360" alt="スクリーンショット 2018-12-02 17.26.36.png" src="https://qiita-image-store.s3.amazonaws.com/0/206165/7a7792f8-1b39-fea0-52b1-12d119ed5be2.png">


事実を羅列するだけではなく、自分の意見や感情を話したりスライドで表現することで登壇者の個性がスライドに反映され、登壇者にしか話せないような内容になり、ぐっと面白くなります。あるあるLTでは弊社エンジニアのスライドで「😂（悲しい）」というページがありました。感情を伝えるだけでなく、「ここは笑ってもいいところですよ」という内容も伝わり、観客をリラックスさせることもできるでしょう。

<img width="320" src="https://qiita-image-store.s3.amazonaws.com/0/206165/468533b2-4202-d2cb-26c1-b86a61d34e47.gif">

上図は二者択一な選択肢を「金の斧、銀の斧」に登場する女神に見立てた内容のスライド資料ですが、文字だけで表示するよりもグッとオリジナリティのある資料になります。

内容にあったイラストを探すには「[いらすとや](https://www.irasutoya.com/)」がおすすめです。


# Code

コードがない技術のプレゼンテーションはあまりみたことがないと思います。コードをスライド資料で説明するのは実は難易度が高いです。スライドの表示領域に本質的な処理を抽出して言語のスタイルを維持しないといけないためです。

![Dec-02-2018 17-44-55.gif](https://qiita-image-store.s3.amazonaws.com/0/206165/8f527c4d-6212-2f8a-a4ee-f516753faedf.gif)

プログラマはハイライトによってコードブロックの全体を把握する特殊な訓練を受けています。

コードスニペットは画像よりもハイライトシンタックスを使って文字列を記載するほうがおすすめです。IDEのスクショ画像でコードを紹介するようなスライド資料も多いですが、その場合「思ったより見辛いな」と思ったときに作業のやり直しが面倒な場合が多く、その点文字列の場合はサイズを調節できることに加えて、強調したい箇所以外をグレーにすることで観客の注目を集めることができます。コードの変更箇所を強調することで観客の変更内容の理解をサポートする狙いもあります。

ハイライトシンタックスによって２０行くらいまでならプログラマは内容を理解することができると思います。

# デモンストレーション

<img width="320" src="https://qiita-image-store.s3.amazonaws.com/0/206165/1a4dddfd-1a43-be87-115c-1f7805737330.gif">
![preview.gif](https://qiita-image-store.s3.amazonaws.com/0/206165/8036b434-e37b-2e7b-0a42-9ff3a1572dac.gif)

アニメーションなどの動作をテキストでは説明できないでしょう。そんな時、モバイル開発者の場合はエミュレーターで動かしたりすることで観客の理解を深めることができます。エミュレーターを使用する場合はあらかじめアプリを起動しておきましょう。その場でビルドを行うとテンポが乱れてしまいます。gif画像としてスライド資料に貼り付けて置いたりするのも有効です。gifのキャプチャーツールとして自分は[GIPHY Capture. The GIF Maker](https://itunes.apple.com/jp/app/giphy-capture-the-gif-maker/id668208984?mt=12)を使っています。


# 観客に刺激を与える
「自分が観客の時は良く話を聞いているから、自分が登壇者の時観客も聞いてくれているはずだ」と思っていないでしょうか。意外とそうではありません。勉強会などに行くと前の方に座っているのにslackを眺めている人を見かけたりしたことはないでしょうか。
自分の伝えたい内容をなるべく多くの観客に伝えるためには対話型のプレゼンテーションが有効です。実際に話すということではなく、例えば

「UIテストは書いているよーって方はどれくらいいますか？」
と挙手を頂戴したり。
<img width="320" alt="スクリーンショット 2018-11-21 10.02.57.png" src="https://qiita-image-store.s3.amazonaws.com/0/206165/4e12fbf0-5fe9-69c7-9a45-a60dc2601822.png">
KotlinConf2017のKotlin Puzzlers by Anton Keks(キャラクターの癖がすごい)のセッションでは観客に考えさせるようなスライドを用いて観客とコミュニケーションしています。

<img width="320" src="https://d2v9k5u4v94ulw.cloudfront.net/small_light(dw=1440,da=l,ds=s,cc=FFFFFF)/assets/images/3192672/original/a7be96bf-8798-4238-98b3-2e77f02155dc?1540809195">

上の写真はand factoryが開催する[BeerBash#4(スマホアプリ開発あるある編)](https://www.wantedly.com/companies/andfactory/post_articles/140728)でのワンシーンですが、発表LTのあるあるに共感した場合「あるある札」をあげてイベントにおける登壇社と観客の一体感を作ると同時に会場の雰囲気を和らげる狙いです。

# 話し方
人前で話すのが苦手だという方は少なくないと思います。自分もそうです。

意外かもしれませんが、登壇する際の話し方として重要なポイントは「自然体」であることです。かしこまる必要はありません。「ワタクシ」のような普段使い慣れていない一人称などを使うと噛み倒します。弊社のイベントをした際に学びとして得たのは１００点満点で完璧なスピーチをする必要はどこにもなかったということです。会場に足を運んで雰囲気を肌で感じようとしている観客（エンジニア）のほとんどはとても寛容で楽しもうと思ってくれています。逆に完璧すぎると単調すぎて面白くないとさえ思ってしまいます。

懇親会で話しかけてくれる機会も増えます。自然体でいいのです。

# まとめ

今回、登壇する際に意識することをまとめましたが、登壇経験のない人にとっていきなり素晴らしい登壇をすることは難しいでしょう。自分もまだまだ不慣れですし、もっとこうすればよかったかなといつも思います。ただ大事なのは、急がずに少しづつ経験を積み、改善を続けていくことだと自分に言い聞かせています。

弊社が行うイベントでも「はじめてのLT枠」を用意していますのでぜひ興味がある方はいらしてください。

- [and factory compass](https://andfactory.connpass.com/)

今後もエンジニアのための情報交換の場を用意し、それぞれの所属を超えて協力し合うエンジニア文化に貢献していく取り組みです。


ご静聴ありがとうございました！ :thumbsup:


### 参考
- [シンプル・プレゼン](https://www.amazon.co.jp/%E3%82%AC%E3%83%BC%E3%83%BB%E3%83%AC%E3%82%A4%E3%83%8E%E3%83%AB%E3%82%BA-%E3%82%B7%E3%83%B3%E3%83%97%E3%83%AB%E3%83%97%E3%83%AC%E3%82%BC%E3%83%B3/dp/4822230546)
- https://www.youtube.com/watch?v=ukwVzLq_pHk
- https://www.youtube.com/watch?v=j9Vr8B5OQpU&t=1153s
- https://jakewharton.com/the-conference-speaker-investment/