スライド2

猿でもわかるLT~はじめてのライトニングトーク~

このスライドは、2019年1月23日(水)に、会社の同僚のかわいい後輩(昨年新卒)の新井田君(掲載許可済み)がはじめての社内でライトニングトークをするハメ(?)になったので、責任もって、私が恥ずかしくないように見守り、そしてレビューして、一人前の登壇ができるように、個人的に学習用に作った資料です。

そのLT勉強会の資料をnote用に書き起こしました。

画像1

新井田君とやるLT勉強会
~はじめてのライトニングトーク~

画像2

まず最初に、、、

画像3

LT(エルティ)って何?

画像4

LTとは

ライトニングトーク(英: Lightning Talks)とはカンファレンスやフォーラムなどで行われる短いプレゼンテーションのこと。 様々な形式があるが、持ち時間が5分という制約が広く共有されている。(wiki)

画像5

イベントで何をはなしたらいいの?

画像6

イベントの登壇者と言えば…

・〇〇株式会社 代表
・何かすごいエンジニアさん
・何か本書いてる人(著者)
・とにかく有名人!

画像7

LT の登壇者

・はじめて参加する人
・登壇したことがない人
・実務経験ない人
・話したいことがある人

これなら自分でも出来るそうですよね?

画像8

そうです!
LT ならハードルが低いんです!
なにか出来そうじゃないすか?

画像9

・・・のハズだった・・・

画像10

だけど、今は・・・

画像11

ハードルが高くなった気がする!?

画像12

なぜか!?

画像13

どこのLT会も
有名人多い問題!?

画像14

どうしたらいい?

画像15

飛び越せばいい!

画像16

まぁ、ムリっすよね?

画像17

くぐればいい!!

画像18

飛び越す必要はないんです!
というか飛び越せるくらいなら・・・・やってるよね。
でもLTのいいところは、短い時間で自己表現するところ
そう、いつもの自分を出せばOK!

画像19

例えば
・業界あるある
・得意なプログラミングの話
・得意なPotoshopの話
・先日やった話でもいい
・自分のブログネタでもいい
・別に仕事の話だっていい(機密は守ろう)
・個人的な趣味の話でもいい

検索してすぐ見つかる話よりも、自分の体験談や、自分の思いを発表したほうが、聞き手はきっと楽しいはず!

画像20

きっと・・・

自分にしか書けないテーマがきっとある(?)

画像21

じゃあー、どんなLTが好まれる!?

画像22

(1)新しい知識をくれるLT
新しい技術の要約やTIPS、難しくて理解できなかったもの、知らない、苦手な領域の知識など

(2)とにかく話し方が上手いLT
もともと営業系で、トークには自身がある人は、メリハリつけた内容、ストーリー立てがあれば、内容は薄くてもどうにでもなる。スライドすら不要でトークできてしまう人もいますよね。

(3)ライブコーディングがあるLT
エンジニア系だと、ライブラリ、フレームワークの紹介とか、新しいプラットフォームの紹介じゃ詰まらないですよね。それを使って何ができるのか、どうやって作ってるのか、デモも交えてもらえると楽しいですよね。ただ文字が小さくて見えないので文字は大きくしたり、コツが必要なところだけフォーカスして、ソースコードは後日配布するなどすると、聞き手はメモを取らずに済むので聞くことに集中できてよいです。

(4)何か分からないが盛り上がるLT(!?)
もうこれ、キャラですよね。やろうと思ってやれるものじゃないので難しいですが、手法としていくつかのハメ技があるので紹介します。

画像23

LTを盛り上げる「お は し」

画像24

「お」・・・大きな声で話す!
「は」・・・拍手を要求する!
「し」・・・質問を投げる!
この3つのハメ技を紹介します。

画像25

とりあえず大きな声は必須です!
たまにあります、声が小さくて何言ってるかわからない人
ほんと、もったいないです!
自信もって大きな声でハキハキ言えば何とかなるものです。
いきなり登場して「みなさん!こんにちわーーーー!」って言うだけでも目が覚めますね!

画像26

次に拍手を要求
一方的に話し込んでしまって、会場(オーディエンス)を置いてけぼりになってる登壇たまに見かけますが、会場の参加者の顔色をトークの最中に見ることをおススメします。
余裕があるなら、拍手とか参加者にアクションを求めましょう
もう、自己紹介したら「ハイ拍手!」って」行ってしまってもOK!
発表者「みなさん!こんにちわーーーー!
発表者「ハイ!はくしゅーーーー!!
・・・とかね

画像27

質問を投げる!は若干ハードルが高いかもです

・頭の中で考えてもう
・手を上げてもらう
・答えを言葉で言ってもらう

質問を投げるにもこのように、実際に投げなくても、
考えてみましょう!
と投げかけてもいい。
話の中で「この中で今スマホをお持ちの方挙手!」って手を上げるジェスチャーしてあげてもいい。
この数字わかる方います?」など質問やクイズだしてもいい
会場との距離感つかめるかもしれません

発表者「みなさん!こんにちわーーーー!
参加者「こんちちわー!」
発表者「ハイ!はくしゅーーーー!!
参加者「パチパチパチパチ」
発表者「突然ですがこれ(何か登壇ネタ)わかる人いますか?そこの人!

とマイクを向けて話させちゃうとか良いかもしれません
心配であれば最初の質問だけサクラを用意しておくとかでもいいかもです。
うまく引き出せなかったら、自分で言っちゃってもいい。

画像28

ウケるLTの傾向、ネタをいくつか
LTするにも興味を持ってもらう必要はありますよね。

画像29

1.トークの内容がシンプル
2.時事ネタを絡ませる
3.デモが面白い
4.期待を裏切る(予想外な事)

画像30

伝わるスライドのコツ

画像31

情報を登壇の場で伝えるってどういうことか

情報 × デザイン(スライド)=伝わる(伝える)

情報を正確にかつスムーズに相手に伝えるには、情報をデザインすること、文章を読みやすく整えたり、図表を見やすく作ったり、内容を反映したレイアウトを作ったりすることが不可欠です!

画像32

フォントを考える

Windows PowerPoint の場合
「メイリオ」
「游ゴシック」
で揃える。和文欧文は別OK!
※Mac は「ヒラギノ角ゴ」とか

画像33

文字のレイアウトを考える

フォントサイズで強弱を!ホワイトスペースで見えないブロック!改行、折り返しを工夫しよう!

画像34

1.フォントサイズ で 強弱
2.余白で グルーピング
3.改行、折り返し を 工夫

伝えたいものの強度が文字の大きさに比例するように、どこを見てよいのか迷わないように、余白で情報のグルーピングをしましょう。
見出しもない、隙間もない文字だらけのスライドとか見せられても何を診ていいのかわかりませんよね?

画像35

・フォント強弱
・余白
・文字の長さ
・コントラスト

画像36

同じことをスライドで見せるにも、全然違いますよね?
・文章で読ませる。
・文脈を省略するために、箇条書きにする
・そもそも数文字程度、単語で見せて、トークで説明する

いずれかで説明を受けた際、自分だったらどのスライドがいいか?
一目瞭然ですよね。スライドには文章は極力避けて、トークで説明したほうが人には伝わります。

画像37

情報を整理するうえでも、原則に基づいた配色をしましょう
何を強調したいのか、色がたくさん混在してると要点どころかそもそも伝わらない。

画像38

KISSの法則

Keep it simple, stupid.

一般的には Keep it simple, stupid (シンプルにしておけ!この間抜け) と解釈されますがジョンソン氏本人は Keep it short and simple(簡潔に単純にしておけ)という意味で使っていたようです

画像39

1スライドに1メッセージ
強く伝えたいものは、ここぞとばかりに使いましょう

画像40

スライドにもブロック
文章の章立てのようなもの、はじまりから終わりまで、ノンストップでスライドまわされたら疲れますよね?最初に伝えたいことを章立てがわかるように伝えて、現在第2章を見ていて、最後3章で終わるとわかるようにしておくと、「これいつまで話すの?」「今何はなしてるんだっけ」が解消されます。

画像41

間には扉で息継ぎ
章立てしたら、見せ方の工夫として、扉ページを設けると、ストーリーが変わったのかなと理解してくれます。起承転結でいうなら、最後にまとめの「結」がない話だと、「結局何が言いたかったのか」がわからなくなり、またはじまるときに「起」がないと、突然粒度が細かい話になってるけど何を話したいのかわからないまま「あれ?終わっちゃってる」となりかねない。

テクニックとして、敢えてタイトルはわからないものにして、起承転結の「起」が無い状態で、さぐりさぐり話を進めて、「結」でネタ晴らしという手法もあるが高等テクニックなので慎重にストーリー考えてからにしよう。

画像42

コントラスト

画像43

写真でいうコントラストと言えばわかりやすいですよね

色・トーン・形などの差違のことで、視覚効果、デザイン、イメージなどに役立てられるもの。視覚的な特徴の差。写真だけではなく文字の色や背景にわたって、見易さを考慮しましょう。

画像44

(WCAG) 2.0 に基づいた、最適な文字色と背景色の組み合わせを見つけるためのウェブサービス。

で、スライドにおいて、文字の良い安さは大事です。
そのスライドはどこで写されるものですか?
PCではなくて、会場のプロジェクタとか、大モニタじゃないですか?

そのモニタ、もしプロジェクタだとしたら、コントラスト比は気を付けないと白飛びしてるかもしれない、視認性がなくて文字が読めないかもしれないことも疑ってみるといいでしょう。

基本的な考えは、WCAG でもあるように、Webのコントラスト比 と同等以上のコントラスト比があるといいです。

また暗い会場でのスクリーンに投影するタイプのプロジェクタの場合、背景が真っ白だとまぶしく感じてしまうかもしれないので、背景は、FFFではなくて、若干の色をつけてあげると目に優しいかもしれない。

実際に発表する環境も下調べしておきましょう。
・部屋の明るさ
・投影するのがモニタなのかプロジェクタなのか
・投影する画面のサイズ(遠くまで見えそうか)
・投影する画面のアスペクト比(ワイド画面なのかVGA画面なのか)
たとえば自立式(スタンド)のスクリーンの場合、高さが無いので、画面の下の方は、客席の後ろの人には見えないことが多いです。その場合重要な要素はやや上に寄せるとか、そもそもワイド画面にして横長のスクリーンで表示するとかも検討の余地あり

画像45

もしこのスライドを見ているのがPCの場合
どの程度が読みやすいと思いますか?

画像46

黒背景に、黒文字だと、50%程度までじゃないでしょうか
余裕を持った見やすさにしましょう
同じ会場でも後ろのほうの人はそもそも文字見えるか?も考慮しよう

画像47

同じ帯背景と文字でも、周りが暗いか明るいか、もしくは会場の明るさでも見やすさは変わります

画像48

コントラスト以前に、その文字、痛くないですか?
チラチラするような配色も避けましょう

画像49

スライドの見せ方ができたら次はPowerPointの使い方もいくつか
Macの場合でもおよそ似たようなことは可能なハズです

画像50

このアイコンは、かわいい後輩 新井田君のアイコンなのですが
Photoshop でトリミングせずともPowerPointだけできれいにトリミングできます。

画像51

あらかわいい!ハートにだってなっちゃうんだから!!

画像52

きれいなスライド作るには、余白や整列、グルーピング
見せるものとしては大事ですよね
PowerPointで簡単に整理できます

画像53

出来上がったら、スライドを俯瞰してみてみましょう

画像54

スライド一覧から全体のスライドを見渡せます

画像55

スライドマスターは使いこなそう!

画像56

新規にPPTを作成すると

画像57

初期スライドはしょぼいです!!
テンプレート使ったとしても、ろくなものがありません
もちろんネットで拾えるひな形もあるけど、いまいちほしいのが見つからない。

画像58

そんなに悔やむのではなく
自分でスライドマスターを作ればいい!

画像59

人によりスタイルはあるが、基本は章扉と本文の2種類1セットを作れば、最低限LTはできると思います。
章ごとに今回あえてスライドを作りましたが、章のスイッチするのにそのパターンを数種類作って置くのもよいし、自分用にスライドマスターを事前に作っておいていつでも書式だけ変更するという使い高もできる!

画像60

いくつかのパターン作っておけば
次の登壇は、テーマ的にこっちかな?とか思えば
過去作ったスライドの終了時に原稿はそのままで、書式(マスタ)だけ変更というテクニックが使える(時短できる)

ざっとここまで話しました。
では実際に先ほど予備知識なしに作った自分のスライドに取り入れられそうなテクニックを盛り込んで、もう一回リハーサルしてみましょう

画像61

*本内容は、下記イベントでの登壇内容の書き起こしです*
2019/01/23(水)  LT勉強会
新井田君とやるLT勉強会
~はじめてのライトニングトーク~
猿でもわかるLT(えるてぃー)
参加者:Niida、Murakami、Noda、Kurita

【スライド】猿でもわかるLT
~はじめてのライトニングトーク~


Webのお仕事、元phpプログラマ、今主にWebディレクタ、たまにエンジニア、UXディレクタ、LTのネタ探ししてます。