メインコンテンツへスキップ
レッスン一覧に戻る

atom.training-designer.slide-design-polish

スライドのデザインを仕上げる

スライドのデザインを仕上げる 料理でいうと、食材を切りそろえて味付けは終わっている状態。あとは「盛り付け」をするだけ、という場面を想像してください。どんなに美味しい料理でも、見た目が雑だと「美味しそう!」とは感じら...

apply-ai-design-to-slidesapply-ai-design-to-slides「apply ai design to slides」に関するスキルがこのレッスンで身につきます。
想定時間未設定公開状態: draft
学習メモ

成果物成果物このレッスンが終わったとき、あなたの手元に残る具体的な成果物です(例: 公開済みの Web ページ、動作するフォームなど)。

種類: screenshot検証: basic_manual_check_v1

証跡証跡成果物が正しく作れたことを確認するためのチェックリストです(例: ブラウザで動作する、フォーム送信で値が保存される)。

screenshot

メディアメディアレッスン内に出てくる図や動画のスロットです。実際の画面やイメージで理解を補助します。

diagramscreen_capture

レッスン本文

スライドのデザインを仕上げる

料理でいうと、食材を切りそろえて味付けは終わっている状態。あとは「盛り付け」をするだけ、という場面を想像してください。どんなに美味しい料理でも、見た目が雑だと「美味しそう!」とは感じられません。スライドも同じです。内容が良くても、文字が小さすぎたり色がバラバラだと、聞き手の気持ちが離れてしまいます。

このレッスンでは、AI ツールの力を借りて、スライドの「盛り付け」を 15 分で仕上げます。

スライドデザイン仕上げフロー

前提を確認する

始める前に、次の 2 つを用意してください。

  • 内容が入力済みのスライド(文字は適当で OK、内容さえ入っていれば十分です)
  • Canva(=オンラインでデザインを作れる無料ツール) のアカウント

Canva は https://www.canva.com から無料で始められます。Google アカウントでログインするのが一番かんたんです。

スライドを Canva に取り込む

  1. Canva を開き、「デザインを作成」→「プレゼンテーション(16:9)」を選ぶ
  2. 既存のスライド(PowerPoint や Google スライド)があれば、メニューから「インポート」を選んで読み込む
  3. まだスライドがない場合は、次のステップで AI に下書きを作ってもらいます

AI にデザイン候補を出してもらう

Canva の「Magic Design(=AI が自動でデザインを提案してくれる機能)」を使います。

  1. エディタ上部の「Magic Design」ボタンを押す
  2. スライドのテーマを短く入力する
  3. AI がいくつかのデザイン候補を出すので、一番しっくりくるものを選ぶ

AI への指示(プロンプト)の具体例

Magic Design にテーマを入力するとき、具体的であるほど良い結果が出ます。

  • 良い例: 「新入社員向けのビジネスマナー研修。落ち着いた青系の配色で」
  • 良い例: 「営業チーム向けの商品紹介。明るく親しみやすいデザインで」
  • 悪い例: 「研修」(短すぎて AI がテーマを絞れない)
  • 悪い例: 「かっこいいスライド作って」(何の研修か伝わらない)

ChatGPT / Claude で配色アドバイスをもらう方法

Canva だけでは配色に迷う場合、ChatGPT や Claude に相談できます。次のプロンプト(=AI への指示文)をコピーして貼り付けてください。

研修スライドの配色を提案してください。
対象者: 新入社員
テーマ: ビジネスマナー
条件: メイン・サブ・ベースの3色で、落ち着いた印象にしたい
それぞれの色をカラーコード(例: #336699)で教えてください。

AI が提案してくれたカラーコード(=色を数字とアルファベットで表す記号。例: #336699)を、Canva の色設定にそのまま貼り付ければ反映されます。

Canvaの配色設定画面

配色とフォントを統一する

AI が提案したデザインをベースに、色と文字を整えます。

配色を決める

使う色は 3 色以内 にしましょう。

  • メインカラー: 見出しや重要な部分に使う色
  • サブカラー: 図やグラフのアクセントに使う色
  • ベースカラー: 背景や本文の色(白や薄いグレーが安全)

フォントを決める

フォント(=文字のデザイン)は 2 種類まで にします。

  • 見出し用: 太くて目立つフォント(例: Noto Sans JP Bold)
  • 本文用: 細くて読みやすいフォント(例: Noto Sans JP Regular)

色とフォント選びの良い例・悪い例

  • 良い例: メインが紺(#2C3E7B)、サブがオレンジ(#E67E22)、本文が黒。見出しは太ゴシック、本文は細ゴシック
  • 悪い例: スライドごとに別の色と別のフォントを使う(統一感がなくなる)

視認性をチェックする

デザインを整えたら、最後に「ちゃんと読めるか」を確認します。次の 3 点をチェックしましょう。

  1. 文字サイズ: 見出しは 28pt 以上、本文は 18pt 以上になっているか
  2. 余白: 文字が端ぎりぎりに寄っていないか(上下左右に指 1 本分の余白)
  3. コントラスト(=背景と文字の明るさの差): 背景に対して文字がくっきり読めるか

スマホチェックのやり方

Canva のプレビュー機能で、スマホ画面サイズでスライドを確認できます。

  1. 右上の「プレゼンテーション」ボタンを押す
  2. スマホの画面幅に近い大きさにブラウザを縮める
  3. 文字が読めなければ、プロジェクター(=大きく映す機械)でも読みにくいと考える

視認性の良い例・悪い例

  • 良い例: 白背景に濃い灰色の文字。1 スライドにつきメッセージは 1 つ
  • 悪い例: グレー背景に薄いグレーの文字。1 スライドに文章がぎっしり詰まっている

成果物を確認する

次のチェックリストをすべて確認してください。すべて「はい」なら完成です。

  • スライド全体の配色は 3 色以内に収まっている
  • フォントは 2 種類以下に統一されている
  • スマホ画面サイズで表示しても文字が読める
  • AI ツール(Magic Design や ChatGPT/Claude)のデザイン提案を活用した
  • 見出しは 28pt 以上、本文は 18pt 以上になっている

完成したスライドの全体が見えるスクリーンショットを撮って、成果物として提出します。スクリーンショットには、少なくとも表紙と中身の 1 ページが映るようにしてください。

つまずきポイント

つまずき対処法
AI のデザイン候補がどれもしっくりこないテーマの入力文を「〇〇向けの〇〇研修」のように具体的に書き直す。「明るい」「落ち着いた」など雰囲気の言葉を足すと精度が上がる
配色をどう選べばいいかわからない会社のウェブサイトから色を拾うのが一番安全。または ChatGPT に「この業界に合う配色を 3 色で提案して」と聞く
文字が小さくて読めないと言われたまず本文を 20pt 以上にしてからレイアウトを調整する。情報量が多いなら 2 スライドに分ける
Magic Design ボタンが見つからないCanva のバージョンによって場所が異なる。上部メニューの「デザイン」タブ、または左サイドバーの「アプリ」内を探す
英語フォントしか出てこない検索窓に「Noto Sans JP」と入力する。日本語フォントが一覧に出てくる
成果物成果物このレッスンが終わったとき、あなたの手元に残る具体的な成果物です(例: 公開済みの Web ページ、動作するフォームなど)。

種類: screenshot

検証: basic_manual_check_v1

証跡とメディア

証跡証跡成果物が正しく作れたことを確認するためのチェックリストです(例: ブラウザで動作する、フォーム送信で値が保存される)。

screenshot

メディア

diagramscreen_capture
前提 atom

必須

なし

あると楽

なし

学習完了