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ツール「デザインフィードバックメンタープロ」です。
しかし、実務では「形にする」だけでは不十分です。そのデザインが「目的(例:売上向上、認知拡大)を達成できる品質か」が問われます。
そこで登場するのが、本講座の品質保証を担うWEBCOACH独自のAIツール「デザインフィードバックメンタープロ」です。
メンタープロの「2つの視点」
- このツールは、単なるデザインの良し悪しではなく、実務で必要な「2つの視点」からフィードバックを提供します。
- 1. クライアント視点:デザインの「目的」が達成できそうか、ターゲットに響くか、ビジネスの観点から評価します。
- 2. 専門家(メンター)視点:レイアウト、配色、タイポグラフィ(文字組み)など、デザインの専門的な品質(プロの基準)から評価します。
メンタープロに完成したバナーを提出すると、これらの視点に基づいたスコアと具体的な指摘事項(例:「CTAボタンのコントラストが低く、クリック率が下がる懸念があります」)が出力されます。
このフィードバックを正確に解釈することが、デザインを「自己満足」から「プロの品質」へ引き上げる鍵となります。
このフィードバックを正確に解釈することが、デザインを「自己満足」から「プロの品質」へ引き上げる鍵となります。
AIフィードバックを具体的な修正アクションへ落とし込む手順
AIからのフィードバックは、受け取るだけでは意味がありません。
それを「具体的な修正アクション」に変換する手順を学びましょう。
それを「具体的な修正アクション」に変換する手順を学びましょう。
考えてみよう!:フィードバックを無視すべき場合もあるのか?
デザインフィードバックメンタープロは非常に優秀ですが、常にその指摘を100%受け入れるべきでしょうか?
クライアントの要望やバナーの目的を優先するために、AIのフィードバックをあえて無視したり、限定的に適用したりするケースがあるか考えてみましょう。
クライアントの要望やバナーの目的を優先するために、AIのフィードバックをあえて無視したり、限定的に適用したりするケースがあるか考えてみましょう。
解答例
ケース:
クライアントから「ブランドカラーであるこの薄いグレーを、ボタンの色として必ず使ってほしい」と強い指定があったとします。
メンタープロは「CTAボタンのコントラストが低すぎるため、クリック率が低下する」と指摘する可能性が高いです。
対応:
この場合、AIの指摘(コントラストを上げろ)をそのまま受け入れると、クライアントの要望(ブランドカラーの遵守)に反してしまいます。
対応策として、以下のような「折衷案」をデザイナーが考えます。
クライアントから「ブランドカラーであるこの薄いグレーを、ボタンの色として必ず使ってほしい」と強い指定があったとします。
メンタープロは「CTAボタンのコントラストが低すぎるため、クリック率が低下する」と指摘する可能性が高いです。
対応:
この場合、AIの指摘(コントラストを上げろ)をそのまま受け入れると、クライアントの要望(ブランドカラーの遵守)に反してしまいます。
対応策として、以下のような「折衷案」をデザイナーが考えます。
- ボタンの色はクライアント指定の「薄いグレー」のままにし、代わりにボタンの「文字」を非常に濃い黒にする。
- ボタンに「影」や「太い枠線」を追加して、背景から少しでも目立たせる。
- 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での仕上げとメンタープロへの提出
AIフィードバックに基づく修正と最終仕上げ
メンタープロから得られたフィードバック(例:「『無料で試す』のボタンが背景の青に紛れており、視認性が低い」「全体的に寒色すぎて冷たい印象」など)を確認します。
- フィードバックに基づき、Canvaで具体的な修正作業を行います。
- 例:Canvaの「色温度」調整で少し温かみを足す。
- 例:CTAボタンの上に半透明の明るい図形を重ねて、ボタンを目立たせる。
- 修正後のデザインが、元の要件定義書(ターゲット、目的)を満たしているか最終確認します。
制作例
【4-3】実践制作課題2: Webサイト用ファーストビューバナー(実務応用)
目安の学習時間:60分
課題の要件定義とAI生成の準備(Wixサイトとの関連付け)
この課題では、Webサイトのトップページに掲載する重要なバナー(ファーストビュー)を制作します。
▼ 実践課題2:要件定義書
- クライアント: (架空の)カフェチェーン店
- 目的: 季節限定(初夏)の新作スイーツの告知と、カフェへの来店促進
- ターゲット: 10代〜20代の女性、カフェ巡りが好きな人
- 媒体: Wixで制作したWebサイトのファーストビュー(横長 16:9)
- Wixサイトのトーン&マナー: ナチュラル、白と木目を基調、落ち着いた雰囲気
- 訴求: 「初夏の訪れ、贅沢メロンスイーツ」「店内限定」
Canvaでの制作とメンタープロによる品質チェック
Webサイト用のバナーは、SNS広告と異なり、サイト全体のデザイン(フォント、色使い、雰囲気)と調和していることが非常に重要です。メンタープロのフィードバックに加え、「Webサイトに配置した際に違和感がないか」という視点も持って修正を行います。
制作例
【4-4】4章 -章末課題- [AI → メンタープロ → Canva ワークフローの総合演習]
目安の学習時間:30分
問題
「フィットネスジムの夏の入会キャンペーン」告知バナー(Instagramストーリーズ用:縦長 9:16)を、以下のワークフローで制作してください。
1. Nano Banana Proでテキスト込みのデザインベースを生成する。
2. デザインフィードバックメンタープロに提出し、フィードバックを受ける。
3. フィードバックを基にCanvaで修正し、最終成果物とする。
1. Nano Banana Proでテキスト込みのデザインベースを生成する。
2. デザインフィードバックメンタープロに提出し、フィードバックを受ける。
3. フィードバックを基にCanvaで修正し、最終成果物とする。
▼ 要件
- ターゲット: 20代〜30代の男女(夏に向けて体を引き締めたい層)
- 訴求: 「夏はすぐそこ!」「今なら入会金 0円」
- デザイン: エネルギッシュ、爽やか、スポーティー
- 媒体: Instagramストーリーズ(縦長 9:16)
解答手順
- Nano Banana Proでの生成:要件に合わせた日本語プロンプト(例:# デザイン: スポーティー, 爽やか, # 主題: 汗を流す男女, ジムの機材, # テキスト: 指定の3要素, # サイズ: Aspect Ratio: 9:16)を準備・生成します。
- メンタープロでの分析:生成されたバナーをメンタープロに提出し、フィードバック(クライアント視点・専門家視点)を取得します。
- 指摘事項のメモ:得られた指摘事項を全て箇条書きでメモします。(例:指摘1:『入会金 0円』の文字が小さく、訴求が弱い)(例:指摘2:全体的に暗く、爽やかさが足りない)
- Canvaでの修正:メモした指摘事項に基づき、Canvaで修正作業を行います。(例:修正1:色調補正で全体を明るくする)(例:修正2:文字の下に半透明の図形を敷いて視認性を上げる)
- 最終バナーを提出します。
解答例
制作物をコーチに添削してもらおう
- この章末課題は、本講座のワークフロー(AI生成・Canva仕上げ・AIメンター)の集大成です。
- メンタープロのAIフィードバック(Before)と、それを受けて修正した最終成果物(After)を、ぜひ専属のコーチにも提出してレビューを受けましょう。
- 「AIのフィードバックを、デザイナーとしてどう解釈し、どう修正したか」を説明することで、スキルが飛躍的に向上します。
これで「WEBCOACH独自のAIツールを用いたデザイン改善と実践演習」の解説を終わります。
次の章に進みましょう。
次の章に進みましょう。



