AI活用バナー制作講座
4章 WEBCOACH独自のAIツールを用いたデザイン改善と実践演習
INDEX
目次

【4-4】4章 -章末課題- [AI → メンタープロ→ Canva ワークフローの総合演習]

4章 WEBCOACH独自のAIツールを用いたデザイン改善と実践演習

この章の目安学習時間:150分

この章で到達できるゴール:

  • WEBCOACH独自のAIツール「デザインフィードバックメンタープロ」を効果的に活用できる
  • AIフィードバックを具体的なデザイン修正に落とし込むスキルを習得する
  • 2つの実践課題を通じて、高速制作ワークフローを完全に定着させる

【4-1】「デザインフィードバックメンタープロ」の効果的な活用法

目安の学習時間:30分

メンタープロによるフィードバックの評価項目と読み解き方

3章までで、AI (Nano Banana Pro) と Canva を使って、高速でバナーを「形にする」スキルを習得しました。
しかし、実務では「形にする」だけでは不十分です。そのデザインが「目的(例:売上向上、認知拡大)を達成できる品質か」が問われます。

そこで登場するのが、本講座の品質保証を担うWEBCOACH独自のAIツール「デザインフィードバックメンタープロ」です。
 (43270)

メンタープロの「2つの視点」
  • このツールは、単なるデザインの良し悪しではなく、実務で必要な「2つの視点」からフィードバックを提供します。
  • 1. クライアント視点:デザインの「目的」が達成できそうか、ターゲットに響くか、ビジネスの観点から評価します。
  • 2. 専門家(メンター)視点:レイアウト、配色、タイポグラフィ(文字組み)など、デザインの専門的な品質(プロの基準)から評価します。
メンタープロに完成したバナーを提出すると、これらの視点に基づいたスコアと具体的な指摘事項(例:「CTAボタンのコントラストが低く、クリック率が下がる懸念があります」)が出力されます。
このフィードバックを正確に解釈することが、デザインを「自己満足」から「プロの品質」へ引き上げる鍵となります。

AIフィードバックを具体的な修正アクションへ落とし込む手順

AIからのフィードバックは、受け取るだけでは意味がありません。
それを「具体的な修正アクション」に変換する手順を学びましょう。
フィードバック反映の手順
  1. フィードバックの仕分け:メンタープロの指摘事項を「クライアント視点(目的・訴求)」と「専門家視点(デザイン品質)」に分けます。
  2. 優先順位付け:まず「クライアント視点」の指摘(例:ターゲット層と雰囲気が合っていない)を最優先で対応します。次に「専門家視点」の重大な指摘(例:文字が読みにくい)に対応します。
  3. Canvaでの具体的な修正
    • 指摘:「コントラスト不足」→ Canvaで文字の色を濃くする、または背景に帯を敷く。
    • 指摘:「視線誘導がスムーズでない」→ Canvaで要素を整列させ、最も見てほしい情報(キャッチコピー)を大きくする。
  4. 再提出と改善:修正したバナーを再度メンタープロに提出し、スコアや指摘が改善されたかを確認します。

考えてみよう!:フィードバックを無視すべき場合もあるのか?

デザインフィードバックメンタープロは非常に優秀ですが、常にその指摘を100%受け入れるべきでしょうか?
クライアントの要望やバナーの目的を優先するために、AIのフィードバックをあえて無視したり、限定的に適用したりするケースがあるか考えてみましょう。
解答例
ケース:
クライアントから「ブランドカラーであるこの薄いグレーを、ボタンの色として必ず使ってほしい」と強い指定があったとします。
メンタープロは「CTAボタンのコントラストが低すぎるため、クリック率が低下する」と指摘する可能性が高いです。

対応:
この場合、AIの指摘(コントラストを上げろ)をそのまま受け入れると、クライアントの要望(ブランドカラーの遵守)に反してしまいます。
対応策として、以下のような「折衷案」をデザイナーが考えます。
  1. ボタンの色はクライアント指定の「薄いグレー」のままにし、代わりにボタンの「文字」を非常に濃い黒にする。
  2. ボタンに「影」や「太い枠線」を追加して、背景から少しでも目立たせる。
  3. AIの指摘をクライアントに(証拠として)提示し、「クリック率が下がる懸念があるため、ボタンの色だけはブランドのアクセントカラー(例:赤)に変更しませんか?」と再提案する。
このように、AIのフィードバックは「絶対的な正解」ではなく、「デザイナーが判断を下すための強力な材料」として活用します。

【4-2】実践制作課題1: SNS広告用バナー(高速制作フローの追体験)

目安の学習時間:60分

課題の要件定義とAI生成の準備

ここでは、本講座で学んだ「Nano Banana Pro → メンタープロ → Canva」の全工程を、制限時間(目安)を設定して実践し、ワークフローの定着を目指します。
▼ 実践課題1:要件定義書
  • クライアント: IT系スタートアップ企業
  • 目的: 新しいタスク管理アプリ(SaaS)の認知拡大と無料トライアル登録
  • ターゲット: 20代〜30代のビジネスパーソン、スタートアップ従業員
  • 媒体: SNS広告(Instagram / Facebookフィード 正方形 1:1)
  • 訴求: 「タスク漏れ ゼロへ。」「AIがあなたの仕事を自動整理」
  • 必須要素: 上記の訴求テキスト、CTA「無料で試す」
  • デザイン: クリーン、未来的、信頼感、ブルーまたはグリーン基調

Canvaでの仕上げとメンタープロへの提出

制作フロー
  1. Nano Banana Pro(20分)
    • 「メタプロンプト雛形」を使い、要件(未来的、AI、アプリ、テキスト情報、正方形)を満たす日本語プロンプトを作成。
    • テキスト込みのデザインベースを3パターン以上生成。
  2. メンタープロ(10分)
    • 最も良いデザインをメンタープロに提出し、フィードバック(クライアント視点・専門家視点)を取得する。
  3. Canva(15分)
    • フィードバックに基づき、色調補正や視認性向上のための修正を行う。

AIフィードバックに基づく修正と最終仕上げ

メンタープロから得られたフィードバック(例:「『無料で試す』のボタンが背景の青に紛れており、視認性が低い」「全体的に寒色すぎて冷たい印象」など)を確認します。

  • フィードバックに基づき、Canvaで具体的な修正作業を行います。
    • 例:Canvaの「色温度」調整で少し温かみを足す。
    • 例:CTAボタンの上に半透明の明るい図形を重ねて、ボタンを目立たせる。
  • 修正後のデザインが、元の要件定義書(ターゲット、目的)を満たしているか最終確認します。
制作例
 (44572)

【4-3】実践制作課題2: Webサイト用ファーストビューバナー(実務応用)

目安の学習時間:60分

課題の要件定義とAI生成の準備(Wixサイトとの関連付け)

この課題では、Webサイトのトップページに掲載する重要なバナー(ファーストビュー)を制作します。
▼ 実践課題2:要件定義書
  • クライアント: (架空の)カフェチェーン店
  • 目的: 季節限定(初夏)の新作スイーツの告知と、カフェへの来店促進
  • ターゲット: 10代〜20代の女性、カフェ巡りが好きな人
  • 媒体: Wixで制作したWebサイトのファーストビュー(横長 16:9)
  • Wixサイトのトーン&マナー: ナチュラル、白と木目を基調、落ち着いた雰囲気
  • 訴求: 「初夏の訪れ、贅沢メロンスイーツ」「店内限定」

Canvaでの制作とメンタープロによる品質チェック

制作フロー
  1. Nano Banana Pro(20分)
    • 「メタプロンプト雛形」を使い、要件(メロンスイーツの写真、ナチュラル、テキスト情報、横長)を満たす日本語プロンプトを作成。
    • テキスト込みのデザインベースを3パターン以上生成。
  2. メンタープロ(10分)
    • 完成したバナーをメンタープロに提出し、フィードバックを取得する。
  3. Canva(15分)
    • フィードバックに基づき、修正を行う。(例:文字が読みづらい場合は座布団を敷くなど)
Webサイト用のバナーは、SNS広告と異なり、サイト全体のデザイン(フォント、色使い、雰囲気)と調和していることが非常に重要です。メンタープロのフィードバックに加え、「Webサイトに配置した際に違和感がないか」という視点も持って修正を行います。
制作例
 (43302)

【4-4】4章 -章末課題- [AI → メンタープロ → Canva ワークフローの総合演習]

目安の学習時間:30分

問題

「フィットネスジムの夏の入会キャンペーン」告知バナー(Instagramストーリーズ用:縦長 9:16)を、以下のワークフローで制作してください。

1. Nano Banana Proでテキスト込みのデザインベースを生成する。
2. デザインフィードバックメンタープロに提出し、フィードバックを受ける。
3. フィードバックを基にCanvaで修正し、最終成果物とする。
▼ 要件
  • ターゲット: 20代〜30代の男女(夏に向けて体を引き締めたい層)
  • 訴求: 「夏はすぐそこ!」「今なら入会金 0円」
  • デザイン: エネルギッシュ、爽やか、スポーティー
  • 媒体: Instagramストーリーズ(縦長 9:16)
 (44575)

解答手順

  1. Nano Banana Proでの生成:要件に合わせた日本語プロンプト(例:# デザイン: スポーティー, 爽やか, # 主題: 汗を流す男女, ジムの機材, # テキスト: 指定の3要素, # サイズ: Aspect Ratio: 9:16)を準備・生成します。
  2. メンタープロでの分析:生成されたバナーをメンタープロに提出し、フィードバック(クライアント視点・専門家視点)を取得します。
  3. 指摘事項のメモ:得られた指摘事項を全て箇条書きでメモします。(例:指摘1:『入会金 0円』の文字が小さく、訴求が弱い)(例:指摘2:全体的に暗く、爽やかさが足りない)
  4. Canvaでの修正:メモした指摘事項に基づき、Canvaで修正作業を行います。(例:修正1:色調補正で全体を明るくする)(例:修正2:文字の下に半透明の図形を敷いて視認性を上げる)
  5. 最終バナーを提出します。

解答例

制作物をコーチに添削してもらおう
  • この章末課題は、本講座のワークフロー(AI生成・Canva仕上げ・AIメンター)の集大成です。
  • メンタープロのAIフィードバック(Before)と、それを受けて修正した最終成果物(After)を、ぜひ専属のコーチにも提出してレビューを受けましょう。
  • 「AIのフィードバックを、デザイナーとしてどう解釈し、どう修正したか」を説明することで、スキルが飛躍的に向上します。
これで「WEBCOACH独自のAIツールを用いたデザイン改善と実践演習」の解説を終わります。
次の章に進みましょう。
WEBCOACH | キャリアチェンジまでの全てを学ぶマンツーマンWEBスクール
© 2020 by WEBCOACH