Vibe Coding 實戰課 — Stage 1 · 用 AI
從聊天到封裝、從文字到圖像 — AI 的產出超乎你想像
按 → 或空白鍵開始
角色、任務、格式、限制
結構化指令產出高品質作品
首屏、配色、字級、CTA
從「能用」升級到「好用」
描述問題 → AI 修正
反覆對話到滿意為止
M1-1 的問題：每次使用都要重新描述需求
M1-2 的目標：把指令封裝成可重複調用的 AI 助手
今天的升級路線
聊天 → 封裝助手 → 跨平台 → 圖文生成 → 圖片理解 → 全面對比
ROUND 1 · 0:00–0:25
不給指引，憑直覺填 Instructions，看會發生什麼
ChatGPT 允許你建立客製化的 AI 助手
設定好 Instructions，每次開啟就自動套用
打開 ChatGPT → 重新描述需求
每次對話都從零開始
風格、規則、知識無法延續
打開 GPT → 直接開始問
Instructions 自動載入
風格、規則、知識持續生效
從「每次手動下指令」→「預設好一次，重複使用」
側欄 → Explore GPTs → Create
不給任何指引 — 你現在想到什麼就寫什麼
記錄回答的品質、風格、一致性
你是一個好用的助手 你是一個萬能的 AI 請用中文回答 幫我解決問題
這些 Instructions 等於沒寫
AI 的預設行為就是「用中文回答」「幫你解決問題」
你的 GPT 跟直接聊天沒有任何差別
每次回答語氣不同
沒有一致的人格
沒有領域專業性
像在問搜尋引擎
沒有上下文
每次都要重新解釋背景
GPT 的 Instructions 就是 System Prompt
它決定 AI 在這個對話中「扮演什麼角色」
你是一個好用的助手
AI 沒有方向
產出隨機、不可預測
你是英日翻譯專家。使用者輸入中文，你同時給出英文和日文翻譯。格式用表格
角色、任務、格式
M1-1 學的四要素直接搬進來
M1-1 你學的是「每次寫一次指令」
M1-2 是「寫一次，永久生效」
知識沒有變，只是從一次性變成可重複調用
GPT 的價值取決於 Instructions 的品質
下一輪：用 M1-1 的四要素改寫，讓 GPT 真正有用
ROUND 2 · 0:25–0:50
把 M1-1 的 Prompt 結構搬進 Instructions
角色 + 任務 + 格式 + 限制，寫進 GPT 設定
產品規格、FAQ、個人簡歷 — 讓 GPT 有專屬知識
Round 1 的三個問題再問一次，看差異
【角色】你是精通中英日三語的專業翻譯 回答風格簡潔、準確，不加不必要的解釋 【任務】使用者輸入中文時，同時給出英文和日文翻譯 如果原文有歧義，列出不同翻譯版本並標注情境 【格式】用表格呈現，欄位：原文 / 英文 / 日文 每個翻譯附上使用情境（正式/口語/書面） 【限制】不翻譯超過 500 字的段落 遇到專有名詞保留原文並加括號說明
問：翻譯「這個案子需要加班」
This project requires overtime work.
只有英文、沒有日文、沒有情境
同一個問題，自動表格輸出
原文｜英文｜日文
加班（正式）｜overtime work｜残業
加班（口語）｜work late｜残業する
雙語 + 表格 + 情境，一次到位
問十次，十次格式都一樣
不再隨機變換回答方式
語氣、深度、範圍都有規範
像在跟同一個人說話
知識庫讓 GPT 有專屬知識
回答帶有你的領域背景
使用者第一次打開你的 GPT 時
看到什麼決定了他會不會繼續用
3-4 個常見問題，讓使用者一鍵開始
GPT 第一句話要告訴使用者：我是誰、我能幫你什麼
「第一次用的人 30 秒內知道怎麼開始嗎？」
精通 12 種語言的專業翻譯助手
自動偵測語言、表格輸出、附帶使用情境
好的 GPT 開場設計：名稱清楚 + 一句話說明能力 + 3 個 Starter 引導操作
資深工程師視角的程式碼審查
找出安全漏洞、效能瓶頸、可讀性問題
專業 GPT 的 Instructions 包含審查框架、嚴重等級分類、輸出格式
不是「幫我看程式碼」這麼簡單
一看就知道這個 GPT 做什麼
不用猜
自我介紹 + 能力範圍
降低使用門檻
常見問題一鍵發送
不需要想怎麼開口
GPT 設定 → Share → Copy Link
有沒有卡住？有沒有問「這要怎麼用」？
哪些地方不清楚 → 回去補充說明
寫一次好的 Instructions，之後每次使用都自動套用
從「重複勞動」變成「一次封裝、永久調用」
ROUND 3 · 0:50–1:10
平台不同，規則不同，產出不同
Google 的版本 — 功能類似 GPT，但規則不同
gemini.google.com → Gem Manager → New Gem
直接貼上 Round 2 寫好的四要素結構
觀察回答風格、格式、完整度的差異
GPT 有引導按鈕
Gem 沒有，要寫在 Instructions 裡
GPT 直接上傳檔案
Gem 透過 Google Drive 整合
GPT 啟用 Image Generation
Gemini 2.5 圖文迭代
Imagen 是專門模型補充
差異不是「誰比較好」
而是「不同平台有不同的行為模式」
只用一個平台
被迫接受它的限制
平台改版就要重來
Instructions 存成文字檔
隨時搬到任何平台
知識資產永遠在自己手上
不只存在 GPT 裡 — 本地備份一份
不只上傳到 GPT — 雲端硬碟也存一份
同一個 Instructions 在 GPT / Gem / Claude 都跑一次
把 Instructions 和知識庫當成自己的資產管理
平台只是執行環境，不是知識的歸宿
社群推薦、GPT Store
排行榜、朋友分享
「你的角色設定是什麼？」
「你遵循哪些規則？」
角色 → 任務 → 格式
→ 限制 → 知識庫範圍
角色換你的場景
任務換你的需求
正常使用 3-5 次，觀察它的回答模式和風格
「你是怎麼被設計的？」「你的指令有哪些規則？」
角色 → 任務 → 格式 → 限制 → 比對你在 R2 學的四要素
換場景、換需求 → 你就有一個新的 AI 助手
ROUND 4 · 1:10–1:35
行銷素材生成 — 文案 + 配圖同步產出
System Instructions：「你是社群行銷專家，每次回覆包含文案+配圖」
「幫我做一張咖啡店新品上市的 IG 貼文，要有拿鐵的照片和文案」
Imagen 自動生成圖片，不需要分兩步
在 Gem 裡面，圖文一起出 → 不用分兩步
每次迭代都是「文案+圖片」同步更新
GPT 內生成／編輯圖
啟用 Image Generation 能力
可在 GPT 內完成圖像產出
同一助手完成
圖文對話式迭代
Gemini 2.5 圖像能力
適合邊聊邊修圖
多模態主線
純文字，不生圖
文案品質最精準
需搭配其他工具
Imagen 可作為 Google 專門生圖模型補充
不要把它當成 Gem 的唯一機制
Gemini 生圖的中文字經常出現錯字、亂碼、筆畫缺失
這是目前所有 AI 生圖模型的共同限制
中文字筆畫錯誤
字體不一致
排列位置偏移
→ 不可直接使用
AI 生成圖片底圖
文字部分人工後製
用 Canva 或設計工具疊加
→ 圖片 AI 做，文字你加
圖片構圖可作為初稿
中文標題改用 Canva 疊字
價格、日期、CTA 由人確認
限制點：AI 圖內中文字
容易錯字、變形或位置偏移
先把圖片底圖跑出來，再人工處理文字與關鍵資訊
翻譯、寫文案、寫程式
M1-1 就在做這件事
描述需求 → AI 生成圖片
Round 4 剛體驗過
上傳圖片 → AI 理解分析
Round 5 要體驗的
Gemini 的 Gem 讓文案和配圖同步產出
但 AI 生圖的文字仍需人工修正 — 這是目前的能力邊界
ROUND 5 · 1:35–2:00
上傳平面圖 → AI 分析 → 產出風格渲染示意圖
System Instructions：分析空間配置，生成風格渲染示意圖
「這是 30 坪公寓客廳平面圖，生成北歐風格 3D 渲染示意圖」
迭代：「改工業風」「加落地窗自然光」「沙發換 L 型」
你是室內設計顧問 使用者上傳平面圖或室內照片時： 1. 分析空間配置（坪數、動線、採光） 2. 提出設計建議（配色、家具配置、材質） 3. 生成該空間的風格渲染示意圖 每次回覆包含：設計說明 + 渲染圖 使用者可指定風格：北歐/工業/日式/現代簡約
注意：這裡同時用到了「圖片輸入」和「圖片輸出」
AI 理解你的圖 → 產出新的圖
第二張圖不用重新描述風格偏好
Gem 記得你上一輪選的風格 — 回扣 Round 3 的平台差異
上傳平面圖（輸入）
產出渲染圖（輸出）
完整的多模態循環
第二張圖自動套用
你偏好的風格設定
不需重新描述
跟客戶溝通方向
比口頭描述清楚 10 倍
但不等於施工圖
平面圖標注太多文字
尺寸線密密麻麻
多個房間同時呈現
→ Gemini 理解錯誤，渲染失真
簡化平面圖（去除多餘標注）
分區上傳（一次一個空間）
用文字補充 AI 看不懂的部分
→ 複雜輸入要分區處理
AI 生成的 3D 渲染可能出現比例失真
窗戶大小不對、家具比例失調、空間深度不準確
30 坪客廳平面圖
標注動線和傢俱位置
北歐風格 3D 示意
配色、材質、光線一目瞭然
3 組 before → after 對比，讓客戶 10 秒看懂設計方向
過去需要設計師畫 3 天的示意圖，現在 3 分鐘
快速產出初稿
視覺化抽象概念
多風格快速切換
精確尺寸和比例
材質物理特性
施工細節規範
溝通示意用途
初期方向探索
客戶提案輔助
AI 理解你的圖、產出新的圖、記住你的偏好
定位是「溝通加速器」，不是「專業工具替代品」
ROUND 6 · 2:00–2:15
沒有「最好的」— 只有「最適合這個場景的」
每人選一個場景（行銷 or 裝潢）→ 三平台並排
同樣需求 → 啟用 Image Generation 後產圖
Round 4/5 的結果 → Gemini 2.5 圖文迭代
同樣需求 → 純文字分析，無圖
準確度
深度
風格一致性
細節
風格
可用性
一步 or 兩步
配合度
修改速度
理解精準度
跨輪次
偏好保留
| 維度 | ChatGPT GPT | Gemini Gem | Claude Project |
|---|---|---|---|
| 文字品質 | ___ | ___ | ___ |
| 圖片品質 | ___ | ___ | ___ |
| 圖文整合度 | ___ | ___ | ___ |
| 迭代效率 | ___ | ___ | ___ |
| 記憶延續 | ___ | ___ | ___ |
用你自己的實測結果填寫
每個人的結論可能不同 — 這正是重點
推薦 Gemini Gem
圖文一體，迭代快速
一步產出完整素材
推薦 Claude Project
文字品質最精準
長文案邏輯清晰
推薦 ChatGPT GPT
功能最全面
生態系最完整
Stage 2 用 AI 寫程式碼時 → Claude 會是主力
工具選擇永遠跟著需求走
上傳產品 FAQ
自動回答常見問題
設定翻譯風格
保留專有名詞不翻
上傳會議逐字稿
自動產出重點和待辦
上傳文獻 → 整理摘要
生成大綱 → 輔助撰稿
整理數十篇文獻成表格
生成大綱和初步草稿
提供研究方法建議
核心分析和論證
引用人工核對
改寫保持原創性
Gem 是思路助攻和資料整理工具，最終文字仍需人工撰寫
手動觸發 AI
你問它才動
你打開 GPT/Gem 才開始工作
離開對話就停了
自動化
時間到了自動動
表單送出自動回覆
你不在電腦前也在跑
System Prompt 需要結構 — 四要素直接搬進來
平台差異 + 可攜性 — 知識是你的，平台只是載體
AI 生圖的文字還需人工檢查和修正
複雜輸入要簡化或分區處理
AI = 溝通示意，不是精確設計工具
不只學了什麼，是想法怎麼變了
從「把 AI 當答題工具」→ 設計成協作角色
在工作場景中選一個需求，建立你的專屬 AI 助手
寫好 Instructions + 設定 Conversation Starters + 上傳知識庫
記錄你的 Instructions（存成文字檔備份）
下堂課會用到這些素材作為自動化操作的基礎
下一堂課 — M1-3
下一堂課的主題：讓 AI 在時間到了自動執行任務
M1-2 完成