Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
「見せる」登壇資料デザインの極意
Search
takanorip
February 20, 2026
Design
1k
4
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
「見せる」登壇資料デザインの極意
takanorip
February 20, 2026
More Decks by takanorip
See All by takanorip
Design System Documentation Tooling 2025
takanorip
3
2.7k
デザインエンジニアの延長にデザインマネージャーとしての可能性を探る
takanorip
1
1.1k
Tools for Design Engineers other than LLM in the LLM era
takanorip
1
770
Bulletproof Design System with TypeScript
takanorip
7
5.2k
Eleventy3.0 で始める爆速個人ブログ開発!
takanorip
0
290
Webフォント選定の極意!フォントの基本から最新トレンドまで徹底解説
takanorip
6
1.1k
効果的な管理画面を デザインをするために 避けるべき5つの罠
takanorip
15
7.9k
社内管理画面のデザインもプロダクトデザイン
takanorip
5
2.3k
早わかり W3C Community Group
takanorip
0
610
Other Decks in Design
See All in Design
広い関与の可能性に どう向き合うのか? 私たちは。|Timee MarketingDesign 2026-06-18
bebe
0
170
全員がアウトプットを出せる時代、 誰を採用する?
nishame
0
580
デザイナーとエンジニアで 同じ山に登ろう
moco1013
0
260
デザイナーが主導権を握る、AI協業の本音と実践
satosio
7
3.3k
Drawing_for_Anim_Final_PDF.pdf
lynteo
2
160
図面資産×AI 眠れる資産を起こす挑戦
aonomasahiro
0
150
速く作れるかではなく、速く学べるか ― 学習ループを回すパイロットの途中報告
nagata03
0
490
AIスライドデザインを生成する仕組みを社内共有する
kenichiota0711
7
5.6k
再設計される業務 - AIにより再設計される "デザインワークフロー" / AI Ops Lab #2 Redesigned orkflows
kgsi
0
720
Drawing for Animation
lynteo
2
300
ClaudeCodeでマーケターの課題を解決する
kenichiota0711
11
14k
Build for the Web, Build on the Web, Build With the Web
csswizardry
0
440
Featured
See All Featured
Reality Check: Gamification 10 Years Later
codingconduct
0
2.2k
Sam Torres - BigQuery for SEOs
techseoconnect
PRO
0
290
The Art of Programming - Codeland 2020
erikaheidi
57
14k
AI in Enterprises - Java and Open Source to the Rescue
ivargrimstad
0
1.3k
The browser strikes back
jonoalderson
0
1.3k
The B2B funnel & how to create a winning content strategy
katarinadahlin
PRO
1
390
JAMstack: Web Apps at Ludicrous Speed - All Things Open 2022
reverentgeek
1
480
Avoiding the “Bad Training, Faster” Trap in the Age of AI
tmiket
0
180
SERP Conf. Vienna - Web Accessibility: Optimizing for Inclusivity and SEO
sarafernandez
2
1.5k
Max Prin - Stacking Signals: How International SEO Comes Together (And Falls Apart)
techseoconnect
PRO
0
180
Leveraging LLMs for student feedback in introductory data science courses - posit::conf(2025)
minecr
1
290
svc-hook: hooking system calls on ARM64 by binary rewriting
retrage
2
300
Transcript
「見せる」 登壇資料デザインの極意 takanorip
CONTENTS 目次 登壇資料を作る目的 登壇資料のコンテンツ 登壇資料のデザイン デザインフレームワーク
スライドの目的
スライドは メッセージを伝える道具 登壇でいちばん大事なのは自分の話を聞いてもらうこと。 スライドを読んでもらうことではない。 スライドは読ませない、見せるもの。 見るだけで良いスライドを目指す。
スライドのコンテンツ
コンテンツの設計から デザインは始まっている STEP1:コンテンツ 伝えたいことの整理 STEP2:レイアウト 情報の配置を整理 POINT STEP3:ビジュアル 見た目の整理
コンテンツの設計から デザインは始まっている コンテンツがわかりにくいと、 どんなに見た目を工夫しても意味がない。 注意:コンテンツの設計 ≠ 面白い話を考える コンテンツの設計 = 内容がきちんと伝わるように情報を整理する
時間から逆算して 話す内容を決める どのパートにどれくらいの時間を使うか 決めてからコンテンツを考える。 導入(5分) Part1(10分) Prat2(15分) Part3(10分) まとめ(5分)
話さないことを明確にする 詰まってるようで よくわからない はっきりしてて 中身がわかりやすい
話の流れを意識する 話には流れがある。流れを止めないことが大事。 テーマが切り替わるときは、前の内容とどう接続するのかを伝える。 ぶつ切りではなく、 流れがわかるように 「つなぎを」いれる
スライドの文章5原則 箇条書きを使わない タイトル(一番大きいテキスト)で結論をはっきり伝える 1スライドで5行以上の文章を書かない 文章は極力改行させないくらい短い文章で書く マークダウン的な階層構造を持ち込まない
マークダウン的な 階層構造を持ち込まない 登壇資料は横にスライドしていくものなので 階層をイメージできない。 なるべくフラットな構造で話を組み立てる。 下書きの時点でマークダウンを使わずに書いてみると良い。
ページを分割する 1スライドで長く話してしまうのはNG。 ページを分割して、テンポよく話が進むようにする。 1つのテーマで複数スライド使っても問題ない。 スライド=話の最小単位を意識する。
無駄なスライドを挟まない 無味乾燥なスライドを挟むと流れが悪くなるし、話の印象が弱くなる。 余計な笑いを取りに行こうとしない。
生成AIに要約をさせない 生成AIに要約させると抑揚のない資料になりやすい。 重み付けを人間がやる必要がある。 生成AIを活用する場合はレイアウトを整える部分に フォーカスするのが良い(僕の場合は)
スライドのデザイン
文字を大きくする 遠くからでも見やすい 文字の大きさを意識する。 Figma Slidesの場合は最低48px
コントラスト比は 9:1を目指す スライドは基本的にプロジェクターで映される。 コントラスト比が低いと物理的に見えなくなるので できるだけはっきりとした色使いを心がける。 プロジェクターは黒色が多いほど画面全体の明るさが低くなる。 黒背景は基本使わない方が良い。特にコードブロック!
中央揃えは使わない、 左端を揃える 中央揃えは使い所が難しい。 左端を揃えたほうが無難。 枠線を意識して、 そこにあわせにいくイメージ。
アニメーションは真面目にやる 中途半端なアニメーションはかってノイズになる。 アニメーションを入れるならきちんと設計する。 アニメーションではなくて装飾で変化を伝えるという手もある。
テキストのジャンプ率を大きくする キーメッセージ以外は わざと小さくする。 文章は読まなくても 良いというアピールをする。
色はベースカラーと アクセントカラーだけでいい デザイナーは 3色くらい使いたがるけど、 難しいので2色でいい。 フォントサイズや 太字でどうにかなる。
空白を恐れない 空白ができても、無理に埋めなくて良い。
図やグラフをちゃんと使う 生成AIに描かせると良い。 グラフを描かせたいときは データソースとインフォグラフィック系の参考資料を与える。
登壇資料デザインの フレームワーク
1. 目的とターゲット 2. 時間制約 3. 話さないこと 4. 構成と時間配分(ストーリーの流れ) 導入 約
分 Part1 約 分 Part2 約 分 Part3 約 分 まとめ 約 分 5. コンテンツ 1スライド1メッセージ(タイトルで結論を言う) 1スライド5行以内の短い文章にする 箇条書き・階層構造(マークダウン的)は極力使わない コンテンツが「つながって」いる 無味乾燥なスライドや不要なアニメーションは排除する 6. ビジュアル・トンマナ カラー:ベース #003265(例)・アクセント #e69023(例) タイポグラフィ:最小フォントサイズ 48px ビジュアルの掟 左端揃え、余白を恐れない、コントラスト比 9:1、図解する、テキストのジャンプ率、 黒背景を避ける
THANK YOU