狠狠撸

狠狠撸Share a Scribd company logo
綺麗なスライドを作るための
11の原則
Twelve ways to make slide more beautiful
Kazuki Susa | Go odpatc h | 2015.11.10
綺麗な資料を作るのって難しい
Kazuki Susa | Go odpatc h | 2015.11.10
美しいスライドを作るのが難しい理由
1
どうすれば綺麗になるか
わからない
Kazuki Susa | Go odpatc h | 2015.11.10
2 3
あまり時間をかけて
いられない
綺麗にしようとすると
かえってわかりづらくなる
美しいスライドを作るのが難しい理由
1
どうすれば綺麗になるか
わからない
Kazuki Susa | Go odpatc h | 2015.11.10
2 3
あまり時間をかけて
いられない
綺麗にしようとすると
かえってわかりづらくなる
何をどうすればいいの?
美しいスライドを作るのが難しい理由
1
どうすれば綺麗になるか
わからない
Kazuki Susa | Go odpatc h | 2015.11.10
2
あまり時間をかけて
いられない
3
綺麗にしようとすると
かえってわかりづらくなる
あと一時間しかない!
美しいスライドを作るのが難しい理由
Kazuki Susa | Go odpatc h | 2015.11.10
31
どうすれば綺麗になるか
わからない
2
あまり時間をかけて
いられない
綺麗にしようとすると
かえってわかりづらくなる
むしろひどくなった?
確かに難しい
Kazuki Susa | Go odpatc h | 2015.11.10
では、どうすれば解決できるか
Kazuki Susa | Go odpatc h | 2015.11.10
1
どうすれば綺麗になるか
わからない
Kazuki Susa | Go odpatc h | 2015.11.10
2 3
あまり時間をかけて
いられない
綺麗にしようとすると
かえってわかりづらくなる
1
どうすれば綺麗になるか
わからない
Kazuki Susa | Go odpatc h | 2015.11.10
2 3
あまり時間をかけて
いられない
綺麗にしようとすると
かえってわかりづらくなる
素早く、キレイに、わかりやすい
? ? ? ? ? ? ? ? ? ? ? ?
スライドを作る方法があればいい
どうすれば見つかるか
Kazuki Susa | Go odpatc h | 2015.11.10
その方法を見つけるためにやったこと
Kazuki Susa | Go odpatc h | 2015.11.10
素材収集
前例から学ぶため
その方法を見つけるためにやったこと
Kazuki Susa | Go odpatc h | 2015.11.10
共通点を探す
原則を見つけるため
素材収集
前例から学ぶため
その方法を見つけるためにやったこと
Kazuki Susa | Go odpatc h | 2015.11.10
原則を作成
常に使うため
素材収集 共通点を探す
前例から学ぶため 原則を見つけるため
そうして見つかった
11の原則を紹介する
Kazuki Susa | Go odpatc h | 2015.11.10
あらためまして
Kazuki Susa | Go odpatc h | 2015.11.10
綺麗なスライドを作るための
11の原則
Twelve ways to make slide more beautiful
Kazuki Susa | Go odpatc h | 2015.11.10
1. コントラストをつける
Kazuki Susa | Go odpatc h | 2015.11.10
1. コントラスト
?サービス概要
?ペルソナ
?キーファクター
?ネクストアクション
文字のサイズを統一せずに 重要度によって強弱をつける
アジェンダ
Kazuki Susa | Go odpatc h | 2015.11.10
?サービス概要
?ペルソナ
?キーファクター
?ネクストアクション
アジェンダ
2 . 充分な余白
Kazuki Susa | Go odpatc h | 2015.11.10
2. 充分な余白
?サービス概要
?ペルソナ
?キーファクター
?ネクストアクション
?サービス概要
?ペルソナ
?キーファクター
?ネクストアクション
情報をつめずに 余白をとって洗練さを出す
アジェンダ
アジェンダ
Kazuki Susa | Go odpatc h | 2015.11.10
3. 細かい情報を下に
Kazuki Susa | Go odpatc h | 2015.11.10
3. 下に細かい情報
?サービス概要
?ペルソナ
?キーファクター
?ネクストアクション
下に小さく情報を書くと、全体の統一性と安定性が増す
アジェンダ
2015 - 11 - 11Kazuki Susa
Kazuki Susa | Go odpatc h | 2015.11.10
4. 複数項目には①を
Kazuki Susa | Go odpatc h | 2015.11.10
4.項目には①を
丸と数字を組み合わせるとスマートな印象に
2015 - 11 - 11Kazuki Susa
アジェンダ
サービス概要
ペルソナ
キーファクター
ネクストアクション
1
2
3
4
Kazuki Susa | Go odpatc h | 2015.11.10
5. 要素間にラインを引く
Kazuki Susa | Go odpatc h | 2015.11.10
5. 要素間に線
要素間で線を引くと、ひと目で情報を分けられる
2015 - 11 - 11Kazuki Susa
アジェンダ
サービス概要
ペルソナ
キーファクター
ネクストアクション
1
2
3
4
Kazuki Susa | Go odpatc h | 2015.11.10
6. 色を3つ決める
Kazuki Susa | Go odpatc h | 2015.11.10
Kazuki Susa | Go odpatc h | 2015.11.10
綺麗な配色には決まりがある
6. 色を3つ決める
Kazuki Susa | Go odpatc h | 2015.11.10
メインカラー 70%
メインカラー
全体の構成を決める色
賑やかな印象にしたければ暖色系
洗練された印象にしたければ寒色系を使う
6. 色を3つ決める
Kazuki Susa | Go odpatc h | 2015.11.10
メインカラー 70%
サブカラー 30%
サブカラー
メインカラーの補助として使われる色
主にフォントの色に使われたりする
6. 色を3つ決める
Kazuki Susa | Go odpatc h | 2015.11.10
メインカラー 70%
サブカラー
アクセント 10%
アクセントカラー
目立たせたい場所に使われる色
Kazuki Susa | Go odpatc h | 2015.11.10
このスライドの場合
6. 色を3つ決める
Kazuki Susa | Go odpatc h | 2015.11.10
メインカラー 70%
サブカラー 30%
アクセント 10%
Kazuki Susa | Go odpatc h | 2015.11.10
つまり
たとえばこれを
2015 - 11 - 11Kazuki Susa
アジェンダ
サービス概要
ペルソナ
キーファクター
ネクストアクション
1
2
3
4
Kazuki Susa | Go odpatc h | 2015.11.10
2015 - 11 - 11Kazuki Susa
アジェンダ
サービス概要
ペルソナ
キーファクター
ネクストアクション
1
2
3
4
Kazuki Susa | Go odpatc h | 2015.11.10
こうとか
Kazuki Susa | Go odpatc h | 2015.11.10
ん?
2015 - 11 - 11Kazuki Susa
アジェンダ
サービス概要
ペルソナ
キーファクター
ネクストアクション
1
2
3
4
2015 - 11 - 11
Kazuki Susa | Go odpatc h | 2015.11.10
2015 - 11 - 11Kazuki Susa
アジェンダ
サービス概要
ペルソナ
キーファクター
ネクストアクション
1
2
3
4
Kazuki Susa | Go odpatc h | 2015.11.10
文字が明るくて
可読性が少ない
2015 - 11 - 11Kazuki Susa
アジェンダ
サービス概要
ペルソナ
キーファクター
ネクストアクション
1
2
3
4
Kazuki Susa | Go odpatc h | 2015.11.10
文字が明るくて
可読性が少ない
重要じゃない情報にアク
セントがつかわれている
2015 - 11 - 11Kazuki Susa
アジェンダ
サービス概要
ペルソナ
キーファクター
ネクストアクション
1
2
3
4
Kazuki Susa | Go odpatc h | 2015.11.10
文字が明るくて
可読性が少ない
読ませたい文字は
白と黒に近い色に
重要じゃない情報にアク
セントがつかわれている
2015 - 11 - 11Kazuki Susa
アジェンダ
サービス概要
ペルソナ
キーファクター
ネクストアクション
1
2
3
4
Kazuki Susa | Go odpatc h | 2015.11.10
重要じゃない情報にアク
セントがつかわれている
文字が明るくて
可読性が少ない
読ませたい文字は
白と黒に近い色に
v
アクセントは本当
に大事なとこだけ
2015 - 11 - 11Kazuki Susa
アジェンダ
サービス概要
ペルソナ
キーファクター
ネクストアクション
1
2
3
4
Kazuki Susa | Go odpatc h | 2015.11.10
重要じゃない情報にアク
セントがつかわれている
文字が明るくて
可読性が少ない
読ませたい文字は
白と黒に近い色に
v
アクセントは本当
に大事なとこだけ
この2つを意識しながら配色する!
Kazuki Susa | Go odpatc h | 2015.11.10
となると
これだったら
2015 - 11 - 11Kazuki Susa
アジェンダ
サービス概要
ペルソナ
キーファクター
ネクストアクション
1
2
3
4
Kazuki Susa | Go odpatc h | 2015.11.10
こんな感じで強調の時に使うのがよし!
2015 - 11 - 11Kazuki Susa
アジェンダ
サービス概要
ペルソナ
キーファクター
ネクストアクション
1
2
3
4
Kazuki Susa | Go odpatc h | 2015.11.10
7. ボトムアップ
Kazuki Susa | Go odpatc h | 2015.11.10
ここにきて一番重要なことですが
Kazuki Susa | Go odpatc h | 2015.11.10
スライド一枚につき伝えることも一つ
というのが基本です
Kazuki Susa | Go odpatc h | 2015.11.10
そして、ボトムアップの編集をすれば
この基本は達成できます
Kazuki Susa | Go odpatc h | 2015.11.10
7. ボトムアップ
Kazuki Susa | Go odpatc h | 2015.11.10
最初に全体を見せて、その後1つ
1つ紹介していくと理解しやすい
実はこのテクニックは既に
何度も登場しています
Kazuki Susa | Go odpatc h | 2015.11.10
美しいスライドを作るのが難しい理由
Kazuki Susa | Go odpatc h | 2015.11.10
31
どうすれば綺麗になるか
わからない
2
あまり時間をかけて
いられない
綺麗にしようとすると
かえってわかりづらくなる
むしろひどくなった?
その方法を見つけるためにやったこと
Kazuki Susa | Go odpatc h | 2015.11.10
原則を作成
常に使うため
素材収集 共通点を探す
前例から学ぶため 原則を見つけるため
6. 色を3つ決める
Kazuki Susa | Go odpatc h | 2015.11.10
メインカラー 70%
サブカラー 30
アクセント 10%
アクセントカラー
目立たせたい場所に使われる色
8. 流れをかく
Kazuki Susa | Go odpatc h | 2015.11.10
因果関係、原因?結果、変化前?変化後
は矢印を使って表現するとわかりやすい
Kazuki Susa | Go odpatc h | 2015.11.10
8. 流れを書く
Kazuki Susa | Go odpatc h | 2015.11.10
因果関係、原因?結果、変化前?変化後
は矢印を使うとわかりやすくなる
試合に負けたのが悔しくて一生懸命練習したら
次の試合では勝つことができた!
8. 流れを書く
Kazuki Susa | Go odpatc h | 2015.11.10
因果関係、原因?結果、変化前?変化後
は矢印を使うとわかりやすくなる
試合に負けたのが悔しくて一生懸命練習したら
次の試合では勝つことができた!
試合に負けて
悔しい
8. 流れを書く
Kazuki Susa | Go odpatc h | 2015.11.10
因果関係、原因?結果、変化前?変化後
は矢印を使うとわかりやすくなる
試合に負けたのが悔しくて一生懸命練習したら
次の試合では勝つことができた!
試合に負けて
悔しい
一生懸命
練習した
8. 流れを書く
Kazuki Susa | Go odpatc h | 2015.11.10
因果関係、原因?結果、変化前?変化後
は矢印を使うとわかりやすくなる
試合に負けたのが悔しくて一生懸命練習したら
次の試合では勝つことができた!
試合に負けて
悔しい
一生懸命
練習した
試合で
勝った!
9. アイコン化
Kazuki Susa | Go odpatc h | 2015.11.10
アイコンを使うことで文字よりも
綺麗にわかりやすくできる
Kazuki Susa | Go odpatc h | 2015.11.10
9. アイコン化
Kazuki Susa | Go odpatc h | 2015.11.10
アイコンを使うと文字よりも
綺麗にわかりやすくできる
試合に負けて
悔しい
一生懸命
練習した
試合で
勝った!
9. アイコン化
Kazuki Susa | Go odpatc h | 2015.11.10
試合に負けて悔しい
一生懸命練習した 試合で勝った!
アイコンを使うと文字よりも
綺麗にわかりやすくできる
10. 話し言葉を挟む
Kazuki Susa | Go odpatc h | 2015.11.10
違うテーマに移るときは間に
話し言葉を入れるといいです
Kazuki Susa | Go odpatc h | 2015.11.10
その方が読んでる人も違う
テーマに移ったとわかるし
Kazuki Susa | Go odpatc h | 2015.11.10
一息つかせる意味でも役立ちます
Kazuki Susa | Go odpatc h | 2015.11.10
決して手抜きではありません
Kazuki Susa | Go odpatc h | 2015.11.10
コスパはいいですけど…
11. 表紙を作りこむ
Kazuki Susa | Go odpatc h | 2015.11.10
11. 表紙を作りこむ
Kazuki Susa | Go odpatc h | 2015.11.10
表紙を作りこむことでその後の作業が
大幅に簡単になる上、統一性が増す
11. 表紙を作りこむ
Kazuki Susa | Go odpatc h | 2015.11.10
表紙を作りこむことでその後の作業が
大幅にやりやすくなる
メインカラー
が決まる
11. 表紙を作りこむ
Kazuki Susa | Go odpatc h | 2015.11.10
表紙を作りこむことでその後の作業が
大幅にやりやすくなる
メインカラー
が決まる
サブカラー
が決まる
11. 表紙を作りこむ
Kazuki Susa | Go odpatc h | 2015.11.10
表紙を作りこむことでその後の作業が
大幅にやりやすくなる
メインカラー
が決まる
サブカラー
が決まる
アクセント
が決まる
11. 表紙を作りこむ
Kazuki Susa | Go odpatc h | 2015.11.10
表紙を作りこむことでその後の作業が
大幅にやりやすくなる
サブカラー
が決まる
メインカラー
が決まる
アクセント
が決まる
下にくる細かな
情報が決まる
統一性のあるスライドの場合、
表紙が作りこまれていることが多いです
Kazuki Susa | Go odpatc h | 2015.11.10
表紙で使われたデザインを以後の
スライドにも応用してるためです
Kazuki Susa | Go odpatc h | 2015.11.10
終わり!!
Kazuki Susa | Go odpatc h | 2015.11.10
これからもまだまだ更新中!!
Kazuki Susa | Go odpatc h | 2015.11.10

More Related Content

綺丽なスライト?を作るための11の原则