# Marpスライド作成ベストプラクティス 「かっこいい」高品質なスライドを作成するためのガイドライン。 ## スライドタイトル（h2） ### ✅ 良い例 - **簡潔に**：5-7文字程度 - **分かりやすく**：内容が一目で理解できる - **一貫性**：同じ階層では同じ文体を使う ```markdown ## 導入 ## 課題 ## 解決策 ## 効果 ``` ### ❌ 悪い例 ```markdown ## この章では導入について説明します ## 私たちが直面している課題とは何か ``` ## 箇条書き ### ✅ 良い例 - **3-5項目**：多すぎない - **簡潔に**：1行あたり15-25文字程度 - **並列性**：同じ階層では同じ文法構造 ```markdown - シンプルで分かりやすい - 統一感のあるデザイン - 効果的な情報伝達 ``` ### ❌ 悪い例 ```markdown - これは非常に長い説明文で、一行に収まりきらないため読みにくくなってしまいます - 短い - 次の項目は文章形式になっています。このように統一感がないと読みにくいです。 ``` ## スライド構成 ### 基本構造 1. **タイトルスライド**（``） - タイトル - 発表者名 - 日付 2. **アジェンダスライド** - 全体の流れを示す - 3-5項目程度 3. **本文スライド** - 1スライド = 1メッセージ - タイトルで内容を要約 4. **まとめスライド** - 要点を再確認 - 感謝の言葉 ### スライド枚数の目安 - 5分プレゼン：5-8枚 - 10分プレゼン：10-15枚 - 20分プレゼン：15-25枚 ## テキスト量 ### ✅ 良いバランス ```markdown ## 製品の特徴 - 高速処理 - 直感的なUI - 拡張性の高い設計 ``` ### ❌ 詰め込みすぎ ```markdown ## 製品について この製品は、最新のテクノロジーを活用して開発されました。 主な特徴として、以下の7点が挙げられます： - 特徴1: 詳細な説明が長々と続く... - 特徴2: さらに詳しい説明... （以下省略） ``` ## 余白の使い方 - **適度な余白**：情報を詰め込みすぎない - **視線誘導**：重要な情報に自然と目が向く配置 - **呼吸**：スライド間にも適度な「間」を ## 色の使い方 テーマで定義された色を活用： - **背景色**：`#f8f8f4`（明るいベージュ） - **テキスト色**：`#3a3b5a`（濃いネイビー） - **見出し色**：`#4f86c6`（青） - **アクセント色**：`#000000`（黒） ### 追加の色を使う場合 ```markdown 重要なポイント ``` 控えめに使用し、過度な装飾を避ける。 ## 画像の使用 ### 効果的な使い方 - **目的を明確に**：装飾ではなく、理解を助けるため - **高品質**：解像度の高い画像を使用 - **適切なサイズ**：大きすぎず小さすぎず ### 配置のコツ ```markdown # 左にテキスト、右に画像 ![bg right:40%](image.png) - ポイント1 - ポイント2 ``` ## フォントサイズの目安 テーマで定義済み： - h1: 56px（タイトルスライドのみ） - h2: 40px（通常スライドのタイトル） - h3: 28px（サブ見出し） - 本文: 22px ## アニメーションとトランジション Marpは基本的にアニメーション非対応。 シンプルなスライド遷移に集中する。 ## チェックリスト スライド完成後、以下を確認： - [ ] タイトルは簡潔か（5-7文字） - [ ] 箇条書きは3-5項目か - [ ] 1スライド1メッセージか - [ ] テキスト量は適切か - [ ] 余白は十分か - [ ] 画像は効果的に使われているか - [ ] 全体の統一感はあるか - [ ] スライド枚数は適切か