TEDスタイルのプレゼンテーション
指示
# TEDスタイルのプレゼンテーション作成のヒント
世界一流のTEDトークデザイナーとして、提供された記事／トピックに基づき、TEDの「広める価値のあるアイデア」という物語の哲学と視覚言語に沿って、完全なプレゼンテーション資料を作成してください。
---
## 物語構造設計（厳守必須）
### スライド 1: オープニングフック
**目標:**最初の30秒で注目を集め、知識のギャップを作り出す
- **コンテンツオプション**（いずれか1つを選択）：
衝撃的なデータ比較（「6秒ごとに…」）
― 直感に反する発言
好奇心を刺激する質問（「もし私があなたにこう言ったら…」）
- 個人的な物語における重要な場面（「3年前のあの夜…」）
- **視覚的要件:** 特大のコア要素1つと、サスペンス感を演出するためのミニマルな背景
### スライド2：これが重要な理由
**目標:** 感情的なつながりを築き、観客に「これは自分にも関係がある」と感じてもらう。
問題の普遍性または緊急性を2～3文で説明してください。
影響を受ける人々の規模や範囲を示す
- **ビジュアル戦略:** シルエット、地図、またはグループアイコンを使用して共鳴を生み出します
### スライド3-4：現在のジレンマ
**目標:**「現状」を描写し、変革の必要性を確立する
- 特定の事例やデータを用いて、現在の問題点を示す
従来のアプローチの限界を強調する
- **視覚的リズム:** 広範なものから具体的なものへ、抽象的なものから具体的なものへ
### スライド5：転換点／個人的な悟り
**目標:** TEDならではの「ひらめきの瞬間」
- 新しい視点を発見した瞬間を語る（「気づいた時には…」）
思考の変化やブレークスルーを示す
- **ビジュアルデザイン:** 光、矢印、または遠近法の変化を用いて、認知の飛躍を象徴する
### スライド6～8：中心となるアイデアの展開
**目標:**「一つの核心的なアイデア」を深く掘り下げる（18分間の講演の黄金律）
- **スライド6:** 中心となるアイデアを明確に述べる（一文で要点をまとめる）
- **スライド7:** この考えを裏付ける3つの重要な証拠/原則
- **スライド8:** 類推や比喩を用いて、抽象的な概念を具体的に説明する
例：「それはまるで…のようだ」「想像してみて…」
- **視覚的要件:** 比喩を用いた分かりやすい表現を用い、抽象的な図表は避ける
### スライド9-10：実際の事例／ストーリー
**目標:**アイデアを「生き生きと」させ、信頼性を築く
具体的な実例を1～2件挙げてください。
登場人物、葛藤、そして変化を含む完全な物語の展開を含める
- **感情デザイン:** 真の苦闘と突破口を示し、完璧主義を避ける
### スライド11：潜在的な反論への対処
**目標:** 聴衆の「しかし…」という疑問を予測し、説得力を高める。
- 限界や課題を正直に認める
- データまたはロジックを使用して懸念事項を解決する
- **口調:** 謙虚でありながら自信に満ち、深い思考を示す
### スライド12-13：より大きな意義
**目標:** 個別事例から普遍的な価値へと高める
- より大きな社会問題、人間の洞察、または未来のビジョンとつながる
「だから何？」という問いに答える――なぜこれが特定のトピックそのものを超越するのか
- **視覚的高さ:** 広大な風景、星空、地平線、その他のイメージを使用する
### スライド14：行動喚起
**目標:** 聴衆に力を与え、誰もが変化に参加できるようにする
- **3層構造:**
- 今日できる小さなこと
今週挑戦できるチャレンジ
- 長期的に追求できる方向性
- **言葉遣い:** 説教じみた「～すべき」ではなく、二人称の「～できる」を使う
### スライド15：詩的な結末
**目標:** 余韻を残し、記憶の拠り所を作る
冒頭の質問／話に戻り、物語のループを形成する。
- その瞬間を捉えるために、印象的な一文または画像（引用文でもオリジナルでも可）を一つ使用してください。
- **ビジュアル:** ミニマルなイメージと核となる黄金の言葉が、瞑想的な雰囲気を作り出します。
---
## 視覚言語基準（TEDステージの美学）
### 色の哲学
- **主要色:**
背景色：深みのある#1A1A1A（TEDステージの黒）または温かみのある#F5F1ED（知識共有の雰囲気）
- テキスト：高コントラストの純白 #FFFFFF またはインクブラック #0A0A0A
- **アクセントカラーシステム**（さまざまな感情の層を表す）：
- **好奇心／インスピレーション:** TED Red #E62B1E（コアアイデアのスライドのみ）
- **データ/合理性:** テックブルー #4A90E2
- **人間性／温かさ:** アンバーゴールド #F5A623
- **使用規則:**
- スライド1枚につきアクセントカラーは最大1色まで
- アクセントカラーはフレームの占比不超过15%
- グラデーションは単色の透明度変化（100%-0%）に限定されます
### タイポグラフィのルール
#### タイトル階層
- **特大タイトル**（冒頭/中心となるアイデア）：
フォントサイズ：画面高さの12～18％
フォント：太字サンセリフ
最大7語まで、不要な冠詞はすべて削除してください。
- 例: ❌「イノベーションの重要性について」 ✅「イノベーションの再定義」
- **レギュラータイトル:**
フォントサイズ：画面高さの6～8％
- 余白：タイトルの高さの上下に少なくとも1.5倍の余白を設ける
- **本文:**
フォントサイズ：画面高さの2.5～3.5％
- 行の高さ：1.8～2.0倍
・スライド1枚につき最大30語（約2行）まで
#### 数字の力
- 主要データは以下の条件を満たす必要があります。
タイトルサイズの150～200%に拡大する
- 周囲に十分な余白を設けて単独で配置する
・マイクロ単位ラベル（数字の1/4サイズ）を使用する
- 例: **73%** 人々の73%が...
### 視覚的焦点戦略
#### スライドごとの構成式
「`」
1. 視覚的アンカー（画面の40～60%を占める）
+ 1つのコアメッセージ（テキストまたはデータ）
+ ゆとりのある空間（少なくとも35%の余白）
= 1 スライド
「`」
#### 画像使用原則
- **写真:**
- ストーリースライド（事例／感情的なつながり）のみに使用
- 本物のシーンであること。ストックフォトは不可。
- 白黒フィルターまたはモノクロオーバーレイを適用して抑制する
- **アイコン/イラスト:**
- 直線的なスタイル、一定の線幅（2～3ピクセル）
- 偏ったサイズ設定：画面の60%（メイン映像）または8%未満（補助映像）
- シナリオ例：プロセスを表す手描きの矢印、文字を表す単純な図形
- **データ視覚化:**
- 3D効果や装飾要素はありません
- 最大3～4個のデータポイントを表示する
- 色はカテゴリを区別するためだけに使用され、値を伝えるものではありません
推奨：棒グラフ（比較）、折れ線グラフ（傾向）、円グラフ（割合）
#### メタファーの視覚化テクニック
抽象的な概念を日常的な物体に変換する：
- 「複雑なシステム」→ ギアアセンブリ
- 「接続」→ニューラルネットワーク/星座線
- 「成長」→木/階段のシルエット
ネガティブスペースを活用して、二重の意味を持つグラフィックを作成する
### レイアウトグリッドシステム
#### ページ構造
- **フルスクリーン没入型:** コンテンツは垂直方向と水平方向の中央に配置され、すべての辺に最低10%の余白が確保されます。
- **非対称バランス:**
視覚的な中心は中心からずれていても構わないが、余白や微細な要素でバランスが取れている必要がある。
テキストが左揃えまたは右揃えの場合、呼吸するグラフィック要素を反対側に配置します。
#### 読書フロー設計
左から右へ、大きい文字から小さい文字へと読む習慣
重要な情報は、画面上部の1/3の「ゴールデン視線ゾーン」に配置する。
二次情報は下部に配置し、フォントサイズを本文の70%に縮小する。
---
## インタラクションとアニメーション（没入感の向上）
### ナビゲーションシステム
- **進捗状況表示:** 下部のドット（●○○○）、現在のページが拡大表示され、色付けされます
- **キーボードショートカット:**
- スペースキー/右矢印キー：次のスライド
- 左矢印：前のスライド
- 数字キー：対応するスライドにジャンプします
- **ジェスチャー**（モバイル）：左右にスワイプしてスライドを切り替えます
### スライドトランジション
- **デフォルトアニメーション:** 0.6秒のイーズイン・アウト・フェード
- **特別な瞬間:**
- スライド2のオープニング：腕立て伏せ
- 転換点スライド：スケールフェード
- エンディングスライド：残光効果のための長いフェードイン（1.2秒）
### 要素入口
- タイトル：不透明度0～100％、わずかに上方向へ移動（20ピクセル）
- データ：数値が0から目標値までジャンプします（1秒間のアニメーション）。
- 画像：ぼかしからクリアへ（ぼかし10px → 0px）
---
## コンテンツ作成チェックリスト
### 物語の完全性
- [ ] 1文で要約できる明確な「核心的なアイデア」はありますか？
- [ ] 冒頭の発言は30秒以内に知識のギャップを生み出すか？
- [ ] 少なくとも1つの実話（純粋な理論ではないもの）はありますか？
- [ ] 意図的に「なるほど！」と思わせるような瞬間が作られているのでしょうか？
- [ ] 結末には具体的で実行可能な提案が含まれていますか？
### 感情曲線
- [ ] 感情の浮き沈みは意図的に設計されているのでしょうか（好奇心→驚き→反省→希望）？
- [ ] 脆弱性や失敗は信頼構築につながるとされていますか？
- [ ] 説教じみた口調ではなく、会話調ですか？
### 視覚的な一貫性
- [ ] 各スライドには視覚的な焦点が1つだけありますか？
- [ ] 余白が30%を超えていますか？
- [ ] アクセントカラーは主要情報にのみ使用されますか？
- [ ] フォントファミリーは統一されていますか（最大2フォント）？
### 18分間の黄金律
- [ ] 合計15枚のスライドを操作しました（1枚あたり平均1分）。
- [ ] 各スライドの情報は5秒以内に視覚的に把握できますか？
- [ ] 不要な修飾語や冗長な情報はすべて削除されましたか？
---
## スライド構造例の参考
### 例 1: 開閉フックスライド
「`」
【画面上部1/3】
2050
【特大太字、画面高さの15％】
【画面中央下部】
地球の人口は100億人になる
しかし、清潔な水を利用できるのはわずか60％に過ぎない。
[標準フォントサイズ、行間2.0]
【画面下部】
この数字を変えるにはあと27年ある
[小文字、透明度60%]
「`」
### 例2：中心となるアイデアのスライド
「`」
[左60%]
[TEDの赤いカラーブロックの背景、左側を占める]
教育は
バケツを満たす
しかし火をつけることは
[カラーブロックの中央に配置された白の太字テキスト]
[右40%]
— イェイツの詩より抜粋
【小さなテキスト注釈】
[底]
つまり、教室を根本的に再設計する必要があるということだ。
[説明文1行]
「`」
### 例3：データ比較スライド
「`」
【画面が左右に分割される】
【左半分】
73%
【特大サイズ、テックブルー】
2023年の状況
【右半分】
12%
【特大サイズ、琥珀色ゴールド】
2010年のレベル
[中心]
【左から右へ向かう細い矢印は、傾向を示しています】
【下中央】
モバイル決済は10年間で消費習慣を変えた
「`」
---
## 最終出力要件
### 技術仕様
- レスポンシブデザイン、1920×1080 / 1366×768 / iPad / モバイル横向きに対応
・最新のウェブ技術（HTML5 + CSS Grid/Flexbox）を使用する
- フォントの代替：英語（Inter/Helvetica → Arial）、必要に応じて中国語（Source Han Sans/PingFang → Heiti）
- すべてのアニメーションはCSSトランジション/アニメーションを使用し、JavaScriptのパフォーマンス低下を回避しています。
### アクセシビリティ
- テキストと背景のコントラスト比は7:1以上（WCAG AAA規格）
画像には必ず代替テキスト（alt属性）を付ける必要があります（装飾的な画像であっても「装飾用」と明記する必要があります）。
- キーボードナビゲーションを完全にサポート
＃＃＃ 成果物
1. 完全なHTML単一ファイル（インラインCSS）
2. スピーカーノート（各スライドの要点、別個のマークダウンファイル）
3. 高解像度の静止画像（オプション、ソーシャルメディアでの共有用）
---
## 創造哲学（メタレベルのリマインダー）
> **TEDの核心を覚えておいてください:** TEDの核心は、自分がどれだけ知識を持っているかを示すことではなく、聴衆の心に「もっと知りたい」という炎を灯すことです。
各スライドについて、次のことを自問自答してください。「聴衆が気が散って今、携帯電話をチェックしたら、私は何を失うだろうか？」答えが「何も失わない」なら、そのスライドを削除してください。
データはストーリーを支えるものであり、その逆ではない。まずストーリーを見つけ、それからデータを使ってその影響力を高める。
最高のデザインとは、目立たないものであるべきだ。聴衆は「このプレゼンテーションは素晴らしい」ではなく、アイデアそのものを記憶にとどめるべきなのだ。
18分という時間制限は、制約ではなく解放です。それは、あなたの思考の核心、つまりダイヤモンドのような本質を見つけ出すことを促すのです。
**最終目標:** 聴衆が会場を去るとき、あなたの名前やスライドの内容は忘れてしまうかもしれませんが、彼らの世界観を変えたアイデアは記憶に残るでしょう。
---
## 重要な注意事項
- スライドの内容はすべて英語でなければなりません
世界中の読者が理解できる、シンプルで力強い英語を使用する
専門用語は絶対に必要な場合を除き避け、使用する場合は明確に定義する。
例や比喩表現において、文化的配慮と普遍的な魅力を確保する。
説明
おすすめした人
nene@YouMind
このスキルをおすすめする理由
このガイドを使えば、どんなトピックも魅力的なTEDスタイルのプレゼンテーションに変えられます。ナラティブ構成、ビジュアルデザイン、アニメーションの原則を網羅し、あなたのアイデアを世界クラスの明確さとインパクトで伝えます。共感を呼ぶストーリーとビジュアルを作成しましょう。
あなたのアイデアを魅力的なTEDスタイルのプレゼンテーションに変えます。ボタン一つで、感動を与え魅了する説得力のあるストーリーと見事なビジュアルを作り上げます。
関連スキル
すべて表示
スライドクレイスタイル3Dレポート
退屈なデータを魅力的なストーリーに変えます。美しいクレイスタイルの3Dプレゼンテーションを作成し、視聴者を魅了してメッセージを忘れられないものにします。わずか数分で。
ウェブページクリエイティブプロフィール
あなたのパーソナルブランドを、ミニマルで美しいウェブサイトに変身させます。プロフェッショナルなデザイン、戦略的なレイアウト、魅力的な美学が瞬時に作成され、あなたの専門性を引き立てます。
ウェブページZara Zhang Frontend Slides
このスキルは、ゼロ依存でアニメーションが豊富なHTMLプレゼンテーションを生成するために設計されています。これらのプレゼンテーションはブラウザで直接動作し、追加のインストールや設定は一切必要ありません。特に、ユニークなビジュアルスタイルと滑らかなアニメーションを特徴とするプレゼンテーションを迅速に作成する必要があるプロフェッショナルに最適です。対象はマーケター、教育者、開発者、そして魅力的なビジュアルコンテンツを通じて情報を伝えたいすべての人です。 このツールの核となる強みは、高度にカスタマイズ可能なデザインプロセスとユーザーエクスペリエンスへの焦点にあります。ユーザーが選択したプレゼンテーションの目的、長さ、内容、および希望する「雰囲気」に基づいて、インテリジェントにデザイン提案を生成します。ユーザーは、感情的な好みを説明することで3つのスタイルプレビューを受け取るガイド付きデザインプロセスを選択するか、プリセットのリストから直接好みのスタイルを選択することができます。 AI画像生成、リアルタイムのWeb検索機能、ユーザーの個人知識ベースへのアクセスを活用することで、このスキルは生成されたプレゼンテーションが視覚的に印象的で内容豊富であることを保証します。最終的な出力は、必要なCSSとJavaScriptをすべて含むスタンドアロンのHTMLファイルであり、最新のブラウザでシームレスに表示されることが保証されています。美的なタイポグラフィとカラースキームを提供するだけでなく、細かく作り込まれたアニメーションも組み込まれており、視聴者に没入感のある視聴体験を提供するように設計されています。
TEDスタイルのプレゼンテーション
指示
# TEDスタイルのプレゼンテーション作成のヒント
世界一流のTEDトークデザイナーとして、提供された記事／トピックに基づき、TEDの「広める価値のあるアイデア」という物語の哲学と視覚言語に沿って、完全なプレゼンテーション資料を作成してください。
---
## 物語構造設計（厳守必須）
### スライド 1: オープニングフック
**目標:**最初の30秒で注目を集め、知識のギャップを作り出す
- **コンテンツオプション**（いずれか1つを選択）：
衝撃的なデータ比較（「6秒ごとに…」）
― 直感に反する発言
好奇心を刺激する質問（「もし私があなたにこう言ったら…」）
- 個人的な物語における重要な場面（「3年前のあの夜…」）
- **視覚的要件:** 特大のコア要素1つと、サスペンス感を演出するためのミニマルな背景
### スライド2：これが重要な理由
**目標:** 感情的なつながりを築き、観客に「これは自分にも関係がある」と感じてもらう。
問題の普遍性または緊急性を2～3文で説明してください。
影響を受ける人々の規模や範囲を示す
- **ビジュアル戦略:** シルエット、地図、またはグループアイコンを使用して共鳴を生み出します
### スライド3-4：現在のジレンマ
**目標:**「現状」を描写し、変革の必要性を確立する
- 特定の事例やデータを用いて、現在の問題点を示す
従来のアプローチの限界を強調する
- **視覚的リズム:** 広範なものから具体的なものへ、抽象的なものから具体的なものへ
### スライド5：転換点／個人的な悟り
**目標:** TEDならではの「ひらめきの瞬間」
- 新しい視点を発見した瞬間を語る（「気づいた時には…」）
思考の変化やブレークスルーを示す
- **ビジュアルデザイン:** 光、矢印、または遠近法の変化を用いて、認知の飛躍を象徴する
### スライド6～8：中心となるアイデアの展開
**目標:**「一つの核心的なアイデア」を深く掘り下げる（18分間の講演の黄金律）
- **スライド6:** 中心となるアイデアを明確に述べる（一文で要点をまとめる）
- **スライド7:** この考えを裏付ける3つの重要な証拠/原則
- **スライド8:** 類推や比喩を用いて、抽象的な概念を具体的に説明する
例：「それはまるで…のようだ」「想像してみて…」
- **視覚的要件:** 比喩を用いた分かりやすい表現を用い、抽象的な図表は避ける
### スライド9-10：実際の事例／ストーリー
**目標:**アイデアを「生き生きと」させ、信頼性を築く
具体的な実例を1～2件挙げてください。
登場人物、葛藤、そして変化を含む完全な物語の展開を含める
- **感情デザイン:** 真の苦闘と突破口を示し、完璧主義を避ける
### スライド11：潜在的な反論への対処
**目標:** 聴衆の「しかし…」という疑問を予測し、説得力を高める。
- 限界や課題を正直に認める
- データまたはロジックを使用して懸念事項を解決する
- **口調:** 謙虚でありながら自信に満ち、深い思考を示す
### スライド12-13：より大きな意義
**目標:** 個別事例から普遍的な価値へと高める
- より大きな社会問題、人間の洞察、または未来のビジョンとつながる
「だから何？」という問いに答える――なぜこれが特定のトピックそのものを超越するのか
- **視覚的高さ:** 広大な風景、星空、地平線、その他のイメージを使用する
### スライド14：行動喚起
**目標:** 聴衆に力を与え、誰もが変化に参加できるようにする
- **3層構造:**
- 今日できる小さなこと
今週挑戦できるチャレンジ
- 長期的に追求できる方向性
- **言葉遣い:** 説教じみた「～すべき」ではなく、二人称の「～できる」を使う
### スライド15：詩的な結末
**目標:** 余韻を残し、記憶の拠り所を作る
冒頭の質問／話に戻り、物語のループを形成する。
- その瞬間を捉えるために、印象的な一文または画像（引用文でもオリジナルでも可）を一つ使用してください。
- **ビジュアル:** ミニマルなイメージと核となる黄金の言葉が、瞑想的な雰囲気を作り出します。
---
## 視覚言語基準（TEDステージの美学）
### 色の哲学
- **主要色:**
背景色：深みのある#1A1A1A（TEDステージの黒）または温かみのある#F5F1ED（知識共有の雰囲気）
- テキスト：高コントラストの純白 #FFFFFF またはインクブラック #0A0A0A
- **アクセントカラーシステム**（さまざまな感情の層を表す）：
- **好奇心／インスピレーション:** TED Red #E62B1E（コアアイデアのスライドのみ）
- **データ/合理性:** テックブルー #4A90E2
- **人間性／温かさ:** アンバーゴールド #F5A623
- **使用規則:**
- スライド1枚につきアクセントカラーは最大1色まで
- アクセントカラーはフレームの占比不超过15%
- グラデーションは単色の透明度変化（100%-0%）に限定されます
### タイポグラフィのルール
#### タイトル階層
- **特大タイトル**（冒頭/中心となるアイデア）：
フォントサイズ：画面高さの12～18％
フォント：太字サンセリフ
最大7語まで、不要な冠詞はすべて削除してください。
- 例: ❌「イノベーションの重要性について」 ✅「イノベーションの再定義」
- **レギュラータイトル:**
フォントサイズ：画面高さの6～8％
- 余白：タイトルの高さの上下に少なくとも1.5倍の余白を設ける
- **本文:**
フォントサイズ：画面高さの2.5～3.5％
- 行の高さ：1.8～2.0倍
・スライド1枚につき最大30語（約2行）まで
#### 数字の力
- 主要データは以下の条件を満たす必要があります。
タイトルサイズの150～200%に拡大する
- 周囲に十分な余白を設けて単独で配置する
・マイクロ単位ラベル（数字の1/4サイズ）を使用する
- 例: **73%** 人々の73%が...
### 視覚的焦点戦略
#### スライドごとの構成式
「`」
1. 視覚的アンカー（画面の40～60%を占める）
+ 1つのコアメッセージ（テキストまたはデータ）
+ ゆとりのある空間（少なくとも35%の余白）
= 1 スライド
「`」
#### 画像使用原則
- **写真:**
- ストーリースライド（事例／感情的なつながり）のみに使用
- 本物のシーンであること。ストックフォトは不可。
- 白黒フィルターまたはモノクロオーバーレイを適用して抑制する
- **アイコン/イラスト:**
- 直線的なスタイル、一定の線幅（2～3ピクセル）
- 偏ったサイズ設定：画面の60%（メイン映像）または8%未満（補助映像）
- シナリオ例：プロセスを表す手描きの矢印、文字を表す単純な図形
- **データ視覚化:**
- 3D効果や装飾要素はありません
- 最大3～4個のデータポイントを表示する
- 色はカテゴリを区別するためだけに使用され、値を伝えるものではありません
推奨：棒グラフ（比較）、折れ線グラフ（傾向）、円グラフ（割合）
#### メタファーの視覚化テクニック
抽象的な概念を日常的な物体に変換する：
- 「複雑なシステム」→ ギアアセンブリ
- 「接続」→ニューラルネットワーク/星座線
- 「成長」→木/階段のシルエット
ネガティブスペースを活用して、二重の意味を持つグラフィックを作成する
### レイアウトグリッドシステム
#### ページ構造
- **フルスクリーン没入型:** コンテンツは垂直方向と水平方向の中央に配置され、すべての辺に最低10%の余白が確保されます。
- **非対称バランス:**
視覚的な中心は中心からずれていても構わないが、余白や微細な要素でバランスが取れている必要がある。
テキストが左揃えまたは右揃えの場合、呼吸するグラフィック要素を反対側に配置します。
#### 読書フロー設計
左から右へ、大きい文字から小さい文字へと読む習慣
重要な情報は、画面上部の1/3の「ゴールデン視線ゾーン」に配置する。
二次情報は下部に配置し、フォントサイズを本文の70%に縮小する。
---
## インタラクションとアニメーション（没入感の向上）
### ナビゲーションシステム
- **進捗状況表示:** 下部のドット（●○○○）、現在のページが拡大表示され、色付けされます
- **キーボードショートカット:**
- スペースキー/右矢印キー：次のスライド
- 左矢印：前のスライド
- 数字キー：対応するスライドにジャンプします
- **ジェスチャー**（モバイル）：左右にスワイプしてスライドを切り替えます
### スライドトランジション
- **デフォルトアニメーション:** 0.6秒のイーズイン・アウト・フェード
- **特別な瞬間:**
- スライド2のオープニング：腕立て伏せ
- 転換点スライド：スケールフェード
- エンディングスライド：残光効果のための長いフェードイン（1.2秒）
### 要素入口
- タイトル：不透明度0～100％、わずかに上方向へ移動（20ピクセル）
- データ：数値が0から目標値までジャンプします（1秒間のアニメーション）。
- 画像：ぼかしからクリアへ（ぼかし10px → 0px）
---
## コンテンツ作成チェックリスト
### 物語の完全性
- [ ] 1文で要約できる明確な「核心的なアイデア」はありますか？
- [ ] 冒頭の発言は30秒以内に知識のギャップを生み出すか？
- [ ] 少なくとも1つの実話（純粋な理論ではないもの）はありますか？
- [ ] 意図的に「なるほど！」と思わせるような瞬間が作られているのでしょうか？
- [ ] 結末には具体的で実行可能な提案が含まれていますか？
### 感情曲線
- [ ] 感情の浮き沈みは意図的に設計されているのでしょうか（好奇心→驚き→反省→希望）？
- [ ] 脆弱性や失敗は信頼構築につながるとされていますか？
- [ ] 説教じみた口調ではなく、会話調ですか？
### 視覚的な一貫性
- [ ] 各スライドには視覚的な焦点が1つだけありますか？
- [ ] 余白が30%を超えていますか？
- [ ] アクセントカラーは主要情報にのみ使用されますか？
- [ ] フォントファミリーは統一されていますか（最大2フォント）？
### 18分間の黄金律
- [ ] 合計15枚のスライドを操作しました（1枚あたり平均1分）。
- [ ] 各スライドの情報は5秒以内に視覚的に把握できますか？
- [ ] 不要な修飾語や冗長な情報はすべて削除されましたか？
---
## スライド構造例の参考
### 例 1: 開閉フックスライド
「`」
【画面上部1/3】
2050
【特大太字、画面高さの15％】
【画面中央下部】
地球の人口は100億人になる
しかし、清潔な水を利用できるのはわずか60％に過ぎない。
[標準フォントサイズ、行間2.0]
【画面下部】
この数字を変えるにはあと27年ある
[小文字、透明度60%]
「`」
### 例2：中心となるアイデアのスライド
「`」
[左60%]
[TEDの赤いカラーブロックの背景、左側を占める]
教育は
バケツを満たす
しかし火をつけることは
[カラーブロックの中央に配置された白の太字テキスト]
[右40%]
— イェイツの詩より抜粋
【小さなテキスト注釈】
[底]
つまり、教室を根本的に再設計する必要があるということだ。
[説明文1行]
「`」
### 例3：データ比較スライド
「`」
【画面が左右に分割される】
【左半分】
73%
【特大サイズ、テックブルー】
2023年の状況
【右半分】
12%
【特大サイズ、琥珀色ゴールド】
2010年のレベル
[中心]
【左から右へ向かう細い矢印は、傾向を示しています】
【下中央】
モバイル決済は10年間で消費習慣を変えた
「`」
---
## 最終出力要件
### 技術仕様
- レスポンシブデザイン、1920×1080 / 1366×768 / iPad / モバイル横向きに対応
・最新のウェブ技術（HTML5 + CSS Grid/Flexbox）を使用する
- フォントの代替：英語（Inter/Helvetica → Arial）、必要に応じて中国語（Source Han Sans/PingFang → Heiti）
- すべてのアニメーションはCSSトランジション/アニメーションを使用し、JavaScriptのパフォーマンス低下を回避しています。
### アクセシビリティ
- テキストと背景のコントラスト比は7:1以上（WCAG AAA規格）
画像には必ず代替テキスト（alt属性）を付ける必要があります（装飾的な画像であっても「装飾用」と明記する必要があります）。
- キーボードナビゲーションを完全にサポート
＃＃＃ 成果物
1. 完全なHTML単一ファイル（インラインCSS）
2. スピーカーノート（各スライドの要点、別個のマークダウンファイル）
3. 高解像度の静止画像（オプション、ソーシャルメディアでの共有用）
---
## 創造哲学（メタレベルのリマインダー）
> **TEDの核心を覚えておいてください:** TEDの核心は、自分がどれだけ知識を持っているかを示すことではなく、聴衆の心に「もっと知りたい」という炎を灯すことです。
各スライドについて、次のことを自問自答してください。「聴衆が気が散って今、携帯電話をチェックしたら、私は何を失うだろうか？」答えが「何も失わない」なら、そのスライドを削除してください。
データはストーリーを支えるものであり、その逆ではない。まずストーリーを見つけ、それからデータを使ってその影響力を高める。
最高のデザインとは、目立たないものであるべきだ。聴衆は「このプレゼンテーションは素晴らしい」ではなく、アイデアそのものを記憶にとどめるべきなのだ。
18分という時間制限は、制約ではなく解放です。それは、あなたの思考の核心、つまりダイヤモンドのような本質を見つけ出すことを促すのです。
**最終目標:** 聴衆が会場を去るとき、あなたの名前やスライドの内容は忘れてしまうかもしれませんが、彼らの世界観を変えたアイデアは記憶に残るでしょう。
---
## 重要な注意事項
- スライドの内容はすべて英語でなければなりません
世界中の読者が理解できる、シンプルで力強い英語を使用する
専門用語は絶対に必要な場合を除き避け、使用する場合は明確に定義する。
例や比喩表現において、文化的配慮と普遍的な魅力を確保する。
説明
おすすめした人
nene@YouMind
このスキルをおすすめする理由
このガイドを使えば、どんなトピックも魅力的なTEDスタイルのプレゼンテーションに変えられます。ナラティブ構成、ビジュアルデザイン、アニメーションの原則を網羅し、あなたのアイデアを世界クラスの明確さとインパクトで伝えます。共感を呼ぶストーリーとビジュアルを作成しましょう。
あなたのアイデアを魅力的なTEDスタイルのプレゼンテーションに変えます。ボタン一つで、感動を与え魅了する説得力のあるストーリーと見事なビジュアルを作り上げます。
関連スキル
すべて表示スライドクレイスタイル3Dレポート
退屈なデータを魅力的なストーリーに変えます。美しいクレイスタイルの3Dプレゼンテーションを作成し、視聴者を魅了してメッセージを忘れられないものにします。わずか数分で。
ウェブページクリエイティブプロフィール
あなたのパーソナルブランドを、ミニマルで美しいウェブサイトに変身させます。プロフェッショナルなデザイン、戦略的なレイアウト、魅力的な美学が瞬時に作成され、あなたの専門性を引き立てます。
ウェブページZara Zhang Frontend Slides
このスキルは、ゼロ依存でアニメーションが豊富なHTMLプレゼンテーションを生成するために設計されています。これらのプレゼンテーションはブラウザで直接動作し、追加のインストールや設定は一切必要ありません。特に、ユニークなビジュアルスタイルと滑らかなアニメーションを特徴とするプレゼンテーションを迅速に作成する必要があるプロフェッショナルに最適です。対象はマーケター、教育者、開発者、そして魅力的なビジュアルコンテンツを通じて情報を伝えたいすべての人です。 このツールの核となる強みは、高度にカスタマイズ可能なデザインプロセスとユーザーエクスペリエンスへの焦点にあります。ユーザーが選択したプレゼンテーションの目的、長さ、内容、および希望する「雰囲気」に基づいて、インテリジェントにデザイン提案を生成します。ユーザーは、感情的な好みを説明することで3つのスタイルプレビューを受け取るガイド付きデザインプロセスを選択するか、プリセットのリストから直接好みのスタイルを選択することができます。 AI画像生成、リアルタイムのWeb検索機能、ユーザーの個人知識ベースへのアクセスを活用することで、このスキルは生成されたプレゼンテーションが視覚的に印象的で内容豊富であることを保証します。最終的な出力は、必要なCSSとJavaScriptをすべて含むスタンドアロンのHTMLファイルであり、最新のブラウザでシームレスに表示されることが保証されています。美的なタイポグラフィとカラースキームを提供するだけでなく、細かく作り込まれたアニメーションも組み込まれており、視聴者に没入感のある視聴体験を提供するように設計されています。
次のお気に入りスキルを見つけよう
リサーチ、制作、日々の作業に役立つ厳選AIスキルをさらに探しましょう。