AI 工具實測 ／ 測試日期 2026 年 10 月
同一張臉書配圖，可以讓 Claude 寫程式畫、請 ChatGPT 生成、放進 Claude Design 畫布排版，或交給 Canva 生成再修改。四條路都做得出來，但花的時間、需要的帳號與設備、字會不會錯，差別很大。這篇用同一份內容「AI 機房搬上太空」實際各做一張，告訴你每一種怎麼做、要付出什麼、適合什麼情境。
先看結果：四張圖用的是同一份文字與數據，左到右依序是 JS 套件、ChatGPT、Claude Design、Canva。
30 秒看重點
4 種
程式渲染、外部 AI 生圖、設計畫布、設計平台連接器
3–4 分鐘
最快的是 ChatGPT，畫面質感也最好
100%
用程式排字的 JS 套件與 Claude Design，中文與數字不會錯
0 台電腦
JS 套件全程在雲端跑，最適合每天排程自動出圖
2 步
Canva 先生成、再由 Claude 補字修正，才拿到正確版本
資料：TempEDU 2026 年 10 月實測。時間與 Tokens 為單次估計，會因內容與修改次數而不同。
00測試方法：同一份內容，四種做法
為了公平比較，四張圖都用同一份「內容清單」，只改變畫面怎麼產生：
- 尺寸：1080×1350（4:5 直式，臉書與 IG 貼文常用）
- 文字：標籤、兩行大標題、一行副標、三組數據、署名
- 風格：深色宇宙背景，搭配 TempEDU 的暖橘紅火光色系
為什麼要先定內容清單
AI 生圖最常出錯的不是畫面，而是字。先把每一句要出現的字寫死，才能逐字檢查，也才能比較不同工具到底有沒有照做。
01JS 套件：最穩定，全程在雲端完成
第一種是讓 Claude 直接寫程式畫圖：用 three.js 畫出 3D 的衛星、地球與光暈，再用網頁排上文字，最後由 Playwright 開一個看不見的瀏覽器截圖存成 PNG。
做法
寫網頁
用 HTML 排好標題、數據與署名，背景放一塊 three.js 畫布。
畫 3D 場景
用程式建立星空、太陽光暈、地球大氣光與衛星模型。
截圖成 PNG
Playwright 開無頭瀏覽器，以 1080×1350 截圖。
看圖調整
Claude 檢查構圖與錯字，調整後重新出圖，這次調了 3 輪。
資源消耗
| 項目 | 這次實測 |
|---|---|
| 時間 | 約 5–8 分鐘（含 2–3 輪調整） |
| Tokens | 約 2–3 萬 |
| 額外費用 | 無，three.js 與 Playwright 都是免費開源套件 |
資料：TempEDU 2026 年 10 月實測，單次估計。
必要條件
- 只需要 Claude 的雲端工作環境，不需要你的電腦開著
- 不需要任何訂閱或外部帳號
- 中文字型使用系統內建字型（雲端連不到 Google Fonts）
優點與缺點
優點
- 中文與數字 100% 正確，因為字是程式排的
- 完全不靠電腦與瀏覽器，最適合每天排程
- 同一套程式可以重複使用，只換內容
缺點
- 插畫由程式畫出，質感偏簡單，比不上 AI 生成的寫實圖
- 構圖要靠調參數，第一次做比較花時間
02ChatGPT：畫面最好看，但要有人顧
第二種是讓 Claude 透過 Chrome 擴充功能操作你的瀏覽器，打開 ChatGPT 貼上提示詞，請它生成整張圖。這次的提示詞把每一句要放的字都逐條寫明，並要求「不要改字」。
做法
開啟 ChatGPT
Claude 在你的 Chrome 開新分頁，確認已經登入。
貼上提示詞
寫明尺寸、每一句文字、風格與配色。
等待生成
約 1.5–2 分鐘出圖。
擷取圖片
把圖放大顯示後分三段截圖，在雲端拼回完整圖片，不必下載到電腦。
逐字檢查
對照內容清單檢查每個字與數字。
資源消耗
| 項目 | 這次實測 |
|---|---|
| 時間 | 約 3–4 分鐘（生成本身 1.5–2 分鐘） |
| Tokens | 約 1–1.5 萬 |
| 額外費用 | 看 ChatGPT 方案；免費帳號有每日生圖次數限制 |
資料：TempEDU 2026 年 10 月實測，單次估計。
必要條件
- 你的電腦要開著，Chrome 與 Claude 擴充功能要連線
- ChatGPT 要事先登入（Claude 不會代為輸入密碼）
- Chrome 分頁在背景時無法截圖，要讓視窗停在前景
優點與缺點
優點
- 畫面質感最好，電影感寫實插畫
- 這次中文標題、副標、數據全部正確
- 速度最快
缺點
- 每次結果不同，字仍可能出錯，必須逐字檢查
- 依賴你的電腦與瀏覽器，無人值守的排程容易失敗
- 受帳號方案的次數限制
三段截圖拼接是什麼
雲端工作環境不能直接下載 ChatGPT 的圖片，所以 Claude 把圖片以原始大小顯示在頁面上，分上、中、下三次截圖，再把三張接成一張。實測畫質足夠用在貼文。
03Claude Design：可以自己動手微調
第三種是在 Claude Design 的設計畫布上排版。Claude 寫好一張畫板，插圖用向量圖形畫，文字是可編輯的版面元素，你打開畫布就能直接點選修改。
做法
建立或打開畫布
在既有的設計畫布新增一張 1080×1350 畫板。
排版與插圖
Claude 用向量圖形畫衛星與行星，排上所有文字。
開放調整項
例如強調色可以用調色盤直接更換。
匯出 PNG
確認後由你從畫布匯出圖片。
資源消耗
| 項目 | 這次實測 |
|---|---|
| 時間 | 約 4–6 分鐘 |
| Tokens | 約 2 萬 |
| 額外費用 | 無，包含在 Claude 方案內 |
資料：TempEDU 2026 年 10 月實測，單次估計。
必要條件
- 只需要 Claude 雲端環境
- 你的帳號要能使用 Claude Design
- 正式 PNG 需要你從畫布匯出
優點與缺點
優點
- 中文與數字 100% 正確
- 可以自己在畫布上改字、換色，不用再回頭請 AI 改
- 版面整齊、風格一致
缺點
- 插圖是向量圖形，質感不如 AI 寫實插畫
- 多一道匯出步驟，較難完全自動化
04Canva：生成之後，交給 Claude 修正
第四種是透過 Canva 連接器，請 Canva 依提示詞生成設計。實測發現 Canva 生成的中文不可靠：四個候選中，一張標題變成亂碼，選中的那張只放了標籤和標題。所以多了一步：由 Claude 直接編輯這份設計，刪掉 AI 的文字，重新加上全部內容。
做法
生成候選
Canva 依提示詞產生 4 個設計候選。
挑插畫
挑插畫最好的一張，不必在意上面的字。
Claude 改字
刪除 AI 產生的文字，加上深色底與內容清單的每一句。
調整格式
設定字級、粗細與品牌色，看預覽確認。
存檔與匯出
經你同意後存檔，再匯出 PNG。
資源消耗
| 項目 | 這次實測 |
|---|---|
| 時間 | 約 6–10 分鐘 |
| Tokens | 約 3 萬（編輯時回傳的資料量大） |
| 額外費用 | 看 Canva 方案 |
資料：TempEDU 2026 年 10 月實測，單次估計。
必要條件
- 要連接 Canva 連接器
- 雲端連不到 Canva 的圖片網址，看圖與取圖要靠 Chrome
- 存檔前要你同意，存檔後無法復原
優點與缺點
優點
- 插畫質感好
- 成品存在你的 Canva，之後可以在手機上繼續改
- 修改後中文與數字 100% 正確
缺點
- AI 生成的文字常漏字或亂碼，一定要修
- 步驟最多、Tokens 最高
- 直接蓋上的深色底邊緣較硬，需要再調整
05怎麼選：看你最在意的是哪一件事
| 你的情境 | 建議做法 | 原因 |
|---|---|---|
| 每天排程自動發文 沒有人在電腦前 | ① JS 套件 | 只要雲端，不靠任何人的電腦 |
| 要最吸睛的畫面 電腦開著、有人能檢查 | ② ChatGPT | 寫實插畫質感最好 |
| 發文前想自己微調 改字、換色 | ③ Claude Design | 畫布上直接點選修改 |
| 團隊已經用 Canva 想在手機上再改 | ④ Canva | 成品就在 Canva 帳號裡 |
資料：TempEDU 2026 年 10 月實測。
畫面交給 AI 生成，字交給程式排版，兩邊的優點就能同時拿到。
——本次實測後的建議做法
實務上最推薦的是混合做法：請 ChatGPT 生成「完全不含文字」的主視覺插畫，再用 JS 套件把標題、數據、署名疊上去。插畫有質感，字又保證正確，就算 AI 這次畫得不理想，也不會把錯的數字公開發出去。
但，這些數字不是絕對的
時間與 Tokens 是單次估計
內容越複雜、修改次數越多，花費就越高。拿來比較四種方法的相對差異比較合適，不要當成固定報價。
AI 生圖每次結果都不同
這次 ChatGPT 的中文全對，下次不一定。Canva 這次一個候選把標題變成亂碼，另一個漏掉大部分文字。
帳號方案會影響結果
ChatGPT、Canva 的生圖次數與品質都跟方案有關，免費帳號可能有每日上限，規則也可能調整。
公開發布前一定要人看過
配圖會用你的名義公開。數字有沒有出處、字有沒有錯、有沒有放到個資，最後一關要由人確認。
現在就可以試的三個步驟
先寫內容清單
標題、數據、署名一句一句列出來，數字附上出處。
挑一種方法試做
依上面的情境表選一種，請 Claude 照清單出圖。
逐字檢查再發布
對照清單看每一個字和數字，確認無誤才公開。
從看懂方法，到自己交付一張圖
練習範例（示意，非新增實測）：替一場虛構的「週末 AI 入門分享會」做社群配圖。先列出標題、日期、地點與署名，再選上面一種方法製作。
可以這樣交辦：「請先整理配圖需求清單：對象為第一次認識 AI 的成人，尺寸 1080×1350，主標題為『週末 AI 入門分享會』。日期、地點與主辦單位請保留待填欄位，不要自行編造。主視覺與文字分開處理，交付時附上逐字檢查清單。」
完成標準：對照原稿檢查文字、數字、裁切與來源；把修改前後的差異記下來。未填入真實活動資料前，請保持為練習稿。
最相關的下一課：提示詞技巧：從提問到任務交辦的 AI 協作指南。用 RTFC／CO-STAR 整理需求，再練習結構化輸出與產出品管，正好接續這篇的「內容清單 → 出圖 → 驗收」。
剛接觸 AI，可先看AI 基本認知的能力、限制與安全使用；想確認圖中數據是否可靠，可延伸到AI 資料查核與引用，練習來源卡與引用。各課程目前的加入方式與費用，請以課程頁顯示為準。
想把圖接成影片企劃，可搭配閱讀：AI 影片製作教學：用 Claude 規劃腳本、分鏡與製作流程
本文重點
- Claude 生圖有四種常見做法：JS 套件、ChatGPT、Claude Design、Canva。
- 字要正確，選程式排字的 JS 套件或 Claude Design；畫面要好看，選 ChatGPT。
- Canva 生成的中文可能漏字或亂碼，要再由 Claude 修改補齊。
- 每天排程無人值守時，只有 JS 套件不需要電腦開著。
- 最推薦混合做法：AI 生無字插畫，程式疊上文字。
想一想
你最常做的圖是哪一種：每天固定的貼文、偶爾一次的活動海報，還是課程教材？哪一種做法最適合你，為什麼？
一張圖看完四種方式
資料來源
- TempEDU（2026 年 10 月）。本文四種方法實測，時間與 Tokens 為單次估計。
- three.js 官方網站。three.js – JavaScript 3D Library
- Playwright 官方網站。Playwright
- Canva 官方網站。Canva
文中範例圖的數據取自 2026 年 10 月 8 日的「AI 機房搬上太空」貼文，僅作為示範內容。封面為 AI 生成的示意圖。
Edit with Tr.Bug
Follow me on：LinkedIn ｜ 探教育TempEDU
1 Comment.