■ PhotoshopとIllustratorのAIは「役割が違う」
● Photoshop生成AI
- 写真の編集に特化
- 不要物削除・背景生成・余白拡張が得意
- Webバナー制作で「文字を置くスペースを作る」時に最強
- 既存素材を整える実務向き
● Illustrator生成AI
- ベクター(線・形)を生成
- アイコン・ロゴ・装飾パーツに強い
- 拡大しても劣化しない
- Webデザインと相性抜群
👉 Photoshop=写真編集、Illustrator=図形生成 → 役割を分けて使うのがプロの考え方
■ AI時代でも「デザイン基礎」が超重要
- AIは素材を作るのは得意
- でも「何をどう見せるか」の判断は人間の仕事
- 視線誘導・余白・階層・配色はAIでは判断できない → 判断力がデザイナーの価値になる
🖼 Photoshop生成AIの要点
■ 生成塗りつぶし(部分編集)
- 選択範囲を囲んで → プロンプト入力 → 自然に書き換え
- 不要物削除・背景変更・光の追加などが一瞬
- 「マイナス修正(消す)」も「プラス演出(足す)」もできる
■ 生成拡張(背景を広げる)
- キャンバスを広げた空白にAIが自然な背景を描き足す
- バナー制作で「文字を置く余白」を作るのに最適
- 主役を大きく切らずに構図を整えられる
■ AI生成で起きやすい失敗
- 境界が不自然
- 光の向きが合わない
- 色味が浮く
- 解像感が違う
👉 AIの結果をそのまま信用しない → 必ず人間がチェックして微調整する
■ 自然に見せるコツ
- 選択範囲の境界を「ぼかす」
- 色調補正でトーンを統一
- トーンカーブ・彩度で空気感を合わせる
👉 AIの速さ × Photoshopの細かい調整 が最強
🧩 AIの向き・不向き
■ AIが得意なこと
- 写真の部分編集
- 不要物削除
- 背景生成
- 余白拡張
- アイデア出し・素材生成
■ AIが苦手なこと
- 完全ゼロからの精密な世界観
- 商品パッケージなど「正確さが必要なもの」
- ロゴ・文字の厳密な生成 → 人間の判断が必須
📢 Webバナーの基礎(超重要)
■ Webバナーとは?
- 一瞬で情報を伝える「広告の装置」
- ユーザーは高速スクロール → 数秒で理解させる必要がある → 伝わりやすさが最優先
■ バナー制作で重要な3つ
① 視線誘導
- 人の目は「左上 → 右下」へ流れる
- 大きい文字・明るい色・人物に目が行く
- キャッチ → 商品 → CTA(ボタン)の順に誘導する
② 余白
- 情報を整理し、主役を際立たせる
- 余白がないと「読みにくい・疲れる」
- AI背景は情報量が多いので特に注意
③ 階層(情報の優先順位)
- キャッチ(大)
- サブコピー(中)
- 詳細(小) → 強弱をつけないと伝わらない
■ ジャンプ率(文字サイズの差)
- 大きい文字と小さい文字の差をしっかりつける
- ジャンプ率が高い → 伝わりやすい
- ジャンプ率が低い → ぼんやりして読まれない
■ 色数を増やしすぎない
- 色が多いと視線が散る
- 基本は 3〜4色
- ベースカラー
- メインカラー
- アクセントカラー
- AI背景は色が多いので整理が必要
🤝 AI × 人間の最適な役割分担
■ AIの役割
- 素材生成
- アイデア出し
- 背景作成
- 余白作り
- 写真編集
■ 人間の役割
- 視線誘導の設計
- 余白の判断
- 階層づけ
- 配色の最終判断
- 「伝わるデザイン」に仕上げる
👉 AIは制作補助、人間は設計担当
🎯 最終まとめ
- Photoshop=写真編集AI
- Illustrator=ベクター生成AI
- AIは速いが、判断は人間
- Webバナーは「情報整理のデザイン」
- 視線誘導・余白・階層・配色が最重要
- AI時代ほどデザイン基礎が価値になる
参考サイト
- Photoshop の 生成塗りつぶし と 生成拡張|npaka
- 【Illustrator】生成拡張でベクターアートを自然に広げる方法【塗り足し生成】
- バナーデザインの基本とは?基本構成/配色/レイアウト、作り方を徹底解説!
- デザインにおける視線誘導の基本【N/F/Zの法則】
- AIと著作権について
MEMO
Photoshop・Illustratorの生成AIと、Webバナー制作に必要な“AI+デザインの考え方”を理解することを学んだ。
Wi-Fiの調子が悪く、午前中は個別ブースに移動してオンライン授業を受けた。
こんなこと初めてだったけれど、間に合ってよかったし、眺めの良い駅前のブースで作業出来て、思いのほかポートフォリオ製作が進んで良かった!
