presentation-mode テンプレカタログ

登壇プレゼン用 HTML スライド。
「永久テンプレ (eternal/)」= そのまま使う完成品 と「普通テンプレ (snippets/)」= 型として使う placeholder の 2段構え
新規デッキは必ず E1〜En の永久テンプレを骨格にして組む (R13)。

ETERNAL / 永久テンプレ — 文字を変えるな、そのまま使う

CATEGORIES / 普通テンプレ (snippets/) — 型として使う・文字差し替え前提

★ ETERNAL ★ 永久テンプレ そのまま貼る・文字数字以外触らない (R13)

E1

講師 太郎 自己紹介 (原本)

.tpl-bio-detail

過去開催 パートナー × Claude Code × Obsidian セミナーで投影。左にオレンジ角丸+人物切り抜き、右に名前/SNS3個/ひとこと/時系列経歴4段。毎回これを使う、数字だけ最新化。

単体で開く →
E2

サンプルスタジオ チーム自己紹介 (原本)

.tpl-bio-team

過去開催 セミナーで投影。左に円形ロゴ+紫角丸装飾、右に名前/handle/リード/箇条書き3点/メトリクス3つ ((フォロワー数) / 3 / DAILY)。チーム紹介の度に毎回これ

単体で開く →

A. 表紙・AGENDA・章扉 デッキの入口・章切替 — 全部毎回どこかで使う

No.01

表紙 (左テキスト + 右ビジュアル)

.tpl-cover

1枚目の表紙。tpl-cover__img の background-image にカバー画像。

単体で開く →
No.02

AGENDA (目次)

.tpl-agenda

2枚目固定。左ダーク + 右に01〜0N目次。agendaItemsで可変。

単体で開く →
No.03

章扉 (巨大番号 + 左下大見出し)

.tpl-chapter

2026-06-01追加。右上に14cqwの巨大番号、グラデーション背景。インパクト最大。

単体で開く →
No.04

セクション扉 (左番号 + 右タイトル)

.tpl-section

目次の各ブロック直前。淡い大番号 + バー + タイトル。No.03より落ち着いた章扉。

単体で開く →

B. ワンスライドワンメッセージ 問いかけ・宣言・ステートメント・ブリッジ — 短文の最強系

No.05

写真背景 + 中央ヌキ文字

.tpl-photo-bg

問いかけ / 強いステートメント / 共感フック。写真背景 or ブランドグラデ。中央ヌキ文字。

単体で開く →
No.06

写真背景 + 番号 + 大見出し

.tpl-photo-num

章番号 + 1メッセージ + 補足。問題提起や核心メッセージに最適。

単体で開く →
No.07

上小キッカー + 下バーン大見出し

.tpl-eyebrow-big

サブタイトル + 大見出し + 補足説明。テーマ単位の冒頭スライドに。

単体で開く →
No.08

中央バーン 1メッセージ

.tpl-bigword

「これだけ覚えて帰ってください」型。is-dark で暗背景バリエ。

単体で開く →
No.09

フルブリードグラデ + 中央センター見出し

.tpl-statement-grad

2026-06-01追加。問いかけ・発見・ブリッジ用ステートメント。短文の最強型。

単体で開く →
No.10

呼びかけ質問 (写真 + 黒オーバーレイ・白文字)

.tpl-question-dark

セミナー中の呼びかけ質問。写真背景に黒オーバーレイで白文字。「AIで悩んでることは?」型。

単体で開く →
No.11

呼びかけ質問 (写真 + 白オーバーレイ・黒文字)

.tpl-question-light

セミナー中の呼びかけ質問。No.10の対比。写真背景を白で透過させて黒文字。

単体で開く →
No.12

大数字バーン

.tpl-stat-bang

「何の数字か分かりますか?」型。1メトリック 1枚。(実績数)・100,000+ などインパクト数字に。

単体で開く →

C. 人物・登壇者紹介 自己紹介スライドは毎回必須 — テーマ用途で使い分け

No.13

登壇者2人 (写真 + bio)

.tpl-speakers

登壇者紹介。sp__photo に丸画像、role/name/handle/bio。コラボ登壇向け。

単体で開く →
No.14

自己紹介 (詳細・透過済人物 + 経歴)

.tpl-bio-detail

登壇者本人の詳細自己紹介。透過済み人物切り抜き画像 + 名前(漢字+英字) + SNS + 時系列経歴。

単体で開く →
No.15

チーム自己紹介 (円形ロゴ + メトリクス)

.tpl-bio-team

チーム/チャンネルの自己紹介。円形ロゴ + リード + 箇条書き + 指標メトリクス。

単体で開く →

D. 本文:対比・比較 Before/After・プラン比較・2軸の選択肢

No.16

2状態進化 (Before → After + アイコン)

.tpl-evolution

2026-06-01追加。同じ素材が「成長」する2状態を視覚化。アイコン円形+矢印+カラー切替。

単体で開く →
No.17

2列/3列 対比カード (グラデヘッダー)

.tpl-vscards

2026-06-01追加。プラン比較・選択肢を並べる。ブランド紫オレンジグラデヘッダー+本文4-5行。

単体で開く →
No.18

テーブル (強調列付き)

.tpl-table

年次比較・数値表。強調したい列・セルにハイライト。料金プラン・機能一覧にも。

単体で開く →

E. 本文:フロー・ステップ・進化 プロセス・手順・データ流れ

No.19

縦バー横並び 5段ステップ

.tpl-flow-vbars

プロセス可視化。お問い合せ→事前調査→打合せ→作業開始→確認。1段だけ強調。

単体で開く →
No.20

データフロー (ソース → 処理 → DB → 出力)

.tpl-dataflow

2026-06-01追加。複数の入力をハブで統合→段階的に出力へ。円形アイコンで段階可視化。

単体で開く →
No.21

2列 + 中央ハブで合流ロジック

.tpl-merge

2026-06-01追加。合弁・統合・一気通貫型のフロー。入力→ハブ→出力を1枚で。

単体で開く →

F. 本文:組織図・構造 マーケ部16名・複数部署・ロール階層

No.22

4列組織図 (部署 → ロール)

.tpl-orgchart

2026-06-01追加。複数部署を1枚に俯瞰。リードロールは強調背景で差別化。

単体で開く →
No.23

自動化スタック (MCP / AIロゴ)

.tpl-stack

使ってる AI ツール一覧 + 内製している機能タグ。ダーク背景。技術スタック可視化。

単体で開く →

G. 本文:データ・実績・数字 実績紹介・フォロワー数・KPI

No.24

8アカウント Xグリッド

.tpl-xgrid

運営アカウント実績紹介。合計フォロワー数を見せる。「ここまで伸ばせました」型。

単体で開く →
No.25

大数字バーン (再掲: B.12参照)

.tpl-stat-bang

1メトリックを画面いっぱいに。「(実績数)」「(フォロワー数)」など。データ枠でも使う。

単体で開く →
No.26

テーブル (再掲: D.18参照)

.tpl-table

数値表として使うことも。月次推移・前年比・KPIダッシュボード等。

単体で開く →

H. 本文:画像・装飾・カード 写真・イラスト・3D装飾・カード並列

No.27

写真背景 + 左下ラベル

.tpl-photo-label

製品紹介や事例の写真背景に、左寄せのラベル。「製品紹介」「事例紹介」など。

単体で開く →
No.28

左テキスト + 右イラスト

.tpl-illust-side

unDraw 風イラストや AI ツールロゴと併用。「Obsidian を第二の脳に」など概念説明。

単体で開く →
No.29

左大見出し + 右3D装飾画像

.tpl-bigword-3d

2026-06-01追加。テーマ別の概観スライド。タイトル左50%以内・装飾は z-index:0 背面化必須。

単体で開く →
No.30

左3カード + 右大ビジュアル

.tpl-cardsvis

2026-06-01追加。特徴3点 + ビジュアル抜け感。サービス紹介・LP切り出しに。

単体で開く →

I. 特典・CTA・カラー扉・クロージング 3カード横並び・QR誘導・カラー扉・お礼

No.31

3つの特典/カード横並び (汎用可)

.tpl-gifts-3

プレゼント告知が原型。同じ型で「3つの特徴」「3つの導線」など汎用可。card__img に背景画像。

単体で開く →
No.32

公式LINE QR + 案内

.tpl-qr

受け取りCTA。左テキスト+リスト、右にQR画像+ID。プレゼント受け取り誘導。

単体で開く →
No.33

カラー扉 + イラスト + 透かし

.tpl-color-tobira

セクション扉のバリエ。is-orange / is-dark で色を変える。右にイラスト、奥に巨大透かしテキスト。

単体で開く →
No.34

クロージング (Thank you)

.tpl-thanks

最後のお礼スライド。大きな Thank you + 補足テキスト。

単体で開く →

全34スライド (= No.01〜No.34, B.12とG.25・D.18とG.26は同テンプレ別カテゴリ参照)
新規追加は必ずこのカタログに 「No.連番 + カテゴリ + tpl-クラス + 説明 + iframeプレビュー + 単体リンク」 形式で登録する (R7 / R12)