




AI 出圖超上手!— As of October 19, 2026


實拍照片 + 一句需求,直接變成促銷海報與日系廣告。

一次生成 6 格有故事性的廣告分鏡,再逐格放大。

指定尺寸與安全區,延伸主視覺做 10 個版本。

把 AI 出圖接進網站、簡報與教學,成為完整作品。
原始照片
AI 生成
原始照片
AI 生成一張好的參考圖,勝過一百個形容詞。
參考圖
AI 生成ChatGPT 先給文字腳本:韓系溫暖、自然光、木質居家;節奏「忙碌 → 輕鬆 → 享受生活」。補上「直接出圖」才產生分鏡圖。

STEP 1放大後保留了分鏡上的說明文字。
STEP 2只修正一件事,其他維持不變。
STEP 3學會之後,把限制直接寫進同一句。
附件|安全區示意
AI 生成| 規格 | 數值 | 用途 |
|---|---|---|
| 畫布 | 820 × 312 | 電腦版完整顯示 |
| 安全區 | 537 × 312 | 手機版裁切後仍看得到 |
OK
OK
紅色殘留
紅色殘留AI 把「示意圖」當成「要畫進去的素材」,分不清哪張是規格、哪張是內容。
Fix從設計出發,探索生成式 AI 在文字、影像、音樂、動態與程式中的創作可能,把研究、實驗與教學成果做成網站、工具與應用。
線上電子書
網頁簡報作品集標題、價格、日期大致正確;小字、地址、電話仍要人工檢查。
商品照、風格圖、版面示意圖都能當輸入,比形容詞更準。
分鏡、提案版本一次出,再挑一張往下深化。
「只改這裡,其他不變」的迭代,比重新生成穩定。

先決定平台與版型,再決定比例。
IG 4:5・FB 1:1・Story 9:16
到 Pinterest、BANNER LIBRARY 找 1–3 張參考圖。
用六欄位公式下 Prompt,一次只改一件事。
ChatGPT → Canva Magic Layers,錯字、價格、Logo 用圖層修。
ChatGPT 出圖只有三種原生比例:1:1、2:3、3:2。先選最接近的比例生成,再到 Canva 調成平台尺寸。
| 平台 / 版位 | 建議尺寸 (px) | 比例 | 生成時選 |
|---|---|---|---|
| IG 貼文(直式) | 1080 × 1350 | 4:5 | 2:3 直式 |
| IG / FB 貼文(方形) | 1080 × 1080 | 1:1 | 1:1 |
| 限時動態・Reels 封面 | 1080 × 1920 | 9:16 | 2:3 直式 |
| FB 單圖貼文(橫式) | 1200 × 900 | 4:3 | 3:2 橫式 |
| FB 粉專封面 | 820 × 312 | 安全區 537 寬 | 3:2 後裁切 |
| FB 互動式隱藏貼文 | 1983×1322 + 3×661 | 1 大 + 3 小 | 分張生成 |
參考:溫研〈【2026】Facebook 貼文尺寸全分析〉blog.wenyan.design
1200×1200 方形
1200×900 橫式
兩張橫式
1200×600
橫式 1200×600
方形 1200×1200
可做互動式
隱藏貼文
四張方形
1200×1200
五張方形
上二大、下三小
四宮格範例隱藏貼文:第一張大圖放「主視覺 + 提示點點」,下面三張方形藏答案、配色或商品細節,適合心理測驗與商品介紹。四宮格:同系列商品一次呈現,每格一個品項、同一套框線與字體(左圖)。






圖片來源:Pinterest「FB POST」參考板,版權屬原作者,僅供課堂教學參考。
到圖庫找 1–3 張想要的版面或氛圍
截圖存下,連同商品照一起上傳
說清楚參考「哪一點」:版面?配色?字體感?
其他部分換成你的商品與文案

參考版面 上圖下三格的資訊圖卡

參考配色 米白 + 墨綠,雙色就有質感

參考字體感 手寫英文 + 雜誌留白
| 欄位 | 要寫什麼 | 例子 |
|---|---|---|
| 用途/尺寸 | 平台、比例 | IG 直式 4:5 貼文 |
| 主角 | 商品、附件說明 | 附件 1 的手搖杯 |
| 文案 | 標題/副標/價格,用引號 | 「好茶好價」「NT$49 起」 |
| 風格 | 風格詞或參考圖 | 參考附件 2 的配色與光線 |
| 版面 | 重點位置、留白 | 標題在上 1/3,商品置中 |
| 限制 | 不要什麼 | 不要多餘文字、不要改 Logo |
「把標題改成白色,其他都不要動」— 同時改三件事,通常三件都改壞。
在 ChatGPT 圖片上選取區域,只重畫那一塊,背景與商品不會跑掉。
「給我 3 種不同版面」,挑方向對的那張,再往下深化。
改 5 輪還在繞圈,存下最好的那張,開新對話重新上傳。
地址、電話、注意事項這類長文字,交給 Step 04 放最準。
「保持構圖不變,只把 ___ 改成 ___」
「沿用上一張的風格,做 9:16 版本」
AI 圖是一張扁平圖片,錯一個字就要重生成。丟進 Canva 的 Magic Layers,它會把文字、商品、背景拆成可編輯的圖層。

在 ChatGPT 下載 PNG 原圖
Canva 建立對應尺寸的設計,上傳並放入圖片
選取圖片 → 編輯 → Magic Layers,等待拆層
點文字圖層:修正錯字、換價格、換日期
拖動商品或標題,調整到安全區內
補上 Logo、QR Code、小字資訊後下載
沒有 Magic Layers?用 Canva「魔術橡皮擦」擦掉錯字,再自己打字蓋上去。
平台、版型、比例沒定,後面全部白做。
與其寫「高級感」,不如丟一張你覺得高級的圖。
只放必要的字;要出現在圖上的字,一律用「」框起來。
改歪了就存檔、開新對話,不要在同一串裡繞圈。
最後的錯字、價格與 Logo,用圖層編輯補完。

A 圖、B 圖(PNG / JPG)
使用的參考圖
Prompt 紀錄:第一句 + 最關鍵的 2 次修改
一句話:哪一步最花時間?
→ 上傳到課程指定位置
| 類型 | 名稱 | 連結 |
|---|---|---|
| 初階範例 | 01|手搖與茶神奇呈現 | chatgpt.com・分享對話 ↗ |
| 中階範例 | 03|韓式電鍋廣告設計 | chatgpt.com・分享對話 ↗ |
| 高階範例 | A-7|FB Banner | chatgpt.com/share ↗ |
| 整合應用 | AIGC Laboratory | aigc-lab.easonchiu100.workers.dev ↗ |
| 尺寸 | 【2026】Facebook 貼文尺寸全分析 | blog.wenyan.design ↗ |
| 風格 | FB POST・Pinterest 參考板 | pin.it/74oUBIyFa ↗ |
| 風格 | BANNER LIBRARY | design-library.jp ↗ |



一起動手做吧 — Q & A
https://aigc-lab.easonchiu100.workers.dev