AI 在教育上的應用-115年台南科技教育週研習錄影及內容整理

AI 在教育上的應用
與實務操作全攻略

從教學簡報、風格繪本、互動有聲書，到行政自動化排版——手把手教學指南

講師：雲林縣成功國小 張哲剛 ｜ 研習內容整理

繪本製作工具箱繪本製作工具箱 V2剛好工具所閩南語文字轉語音opencode 下載Genoffice 下載

本文目錄：
▶ 完整研習影片 ｜ 壹、AI 教育工具生態系總覽 ｜ 貳、Gemini 簡報 ｜ 參、NotebookLM 繪本簡報 ｜ 肆、簡報設計網與繪本工具箱
伍、對話式語音產生器 ｜ 陸、圖音合併工具 ｜ 柒、注音繪本與多語言 ｜ 捌、OpenCode＋Genoffice ｜ 玖、Gemini 音樂創作 ｜ 拾、常見問題

完整研習影片

建議先看一次完整研習錄影掌握全貌，再對照下方各單元圖文步驟實作。

▶ 到 YouTube 觀看完整研習影片

軟體由來

我在第一線教學現場，常常遇到同樣的困擾：備課時間不夠、想做一本主題繪本卻沒有美編能力、想幫故事配音卻錄到燒聲、行政表格改格式改到手軟。這份攻略，就是我把自己實際走過的流程整理成 SOP 的結果。

核心想法很單純：用 Gemini 打底、用 NotebookLM 上色、用我開發的「簡報設計網＋繪本工具箱」控管架構、用對話式語音＋圖音合併產出成品，最後用 OpenCode 解決行政排版。每一段工具都是為了解決一個具體的痛點而串起來的，全部都是老師在現有設備上就能直接操作的。

課堂教學應用

• 📚 備課加速：用 Gemini 十分鐘產出課程基礎簡報大綱，再用 NotebookLM 轉成吸引學童的風格化繪本簡報。
• 🎨 主題繪本：用「簡報設計網」固定 10～15 頁架構、每頁文字與繪圖提示，產出文圖相符的教學腳本，品德、衛生、節慶主題都適用。
• 🔊 有聲教材：對話式語音一鍵把角色對話轉成語音包，再用圖音合併輸出可離線播放的 HTML 有聲書，或上架 YouTube 的 MP4 影片，支援現場點播與學生錄音替換。
• 🈺 低年級＋多語言：用 GAS 腳本自動套 Bpmf 注音字型做注音繪本；英語切換英文輸出，台語則用 閩南語文字轉語音 把華語轉成台語語音再替換音軌。
• 🗂️ 行政減負：用免費開源的 OpenCode AI Agent 直接操作本機資料夾，橫直式重排、核銷表格整併這類瑣事交給它寫程式處理，搭配 Genoffice 提升版面美感。

壹、AI 教育工具生態系總覽

工具名稱	核心功能與優勢	適用情境	費用與帳號
Gemini（Canvas／簡報）	內建簡報模組，自動上網搜尋配圖、線上改字、匯出 PPTX	快速產出標準教學簡報與課程大綱	免費／教育帳號優先（可選 Pro 與思考程度）
NotebookLM（簡報內）	依匯入講義逐頁重繪獨特風格圖像	活潑可愛、卡哇依手繪風繪本簡報	Google 免費帳號即可
簡報設計網與繪本工具箱	我開發的小工具，精準控制每頁文字、排版與生圖提示，產出雙腳本	10～15 頁架構完整的主题繪本腳本	免費網頁工具，需登入 Google 帳號
對話式語音產生器	貼上配音文字檔，一鍵轉成各角色語音包	故事角色配音、多角色教材	免費整合工具
圖音合併工具	繪本 PDF＋語音 ZIP 1:1 配對，產出 HTML 有聲書或 MP4	離線有聲書、YouTube 教材影片	免費整合工具（支援點播＋現場錄音）
注音繪本 GAS 腳本	無文字底圖＋Google 簡報＋GAS 自動套 Bpmf 注音字型（工具箱 V2 內建產生器）	低年級注音繪本、識字教材	免費擴充功能（V2 版工具箱）
OpenCode（AI Agent）	免費開源本機代理，自動呼叫檔名、寫程式、微調 Office 文件	檢核表橫直式重排、表格整併	免費開源（Win／Mac）

貳、單元一：Gemini 內建簡報模式

Gemini 最大的優勢，是會自動上網找圖插入簡報、最後一頁列出圖片來源，而且可以直接在網頁上改字，不用下載來回修改。

步驟一：帳號登入與模型選擇

1. 開啟 Gemini 網頁，先登入 Google 帳號。
2. 有「教育帳號」優先用教育帳號，可選 Advanced／Pro 等高級模型；個人免費帳號通常無法切換模型。

步驟二：開啟 Canvas／簡報工具

1. 在對話輸入框左側點加號「+」。
2. 點「更多工具」，找到並開啟「Canvas」或「簡報」圖示。

步驟三：撰寫精準提示詞

關鍵字必須包含「簡報」二字，AI 才會啟動簡報模組。

請幫我製作一份介紹台灣光復節由來的簡報，內容要詳細一點，適合小學生，列出10個重點。

步驟四：設定思考程度

常規教學簡報選「低」即可快速產出；題目極複雜才選高思考程度（會消耗較多 Token／AI 點數）。

步驟五：線上編輯與來源確認

1. 點「送出」，AI 自動設計投影片。
2. 直接在網頁投影片上點文字方塊改字。
3. 檢查最後一頁：有使用網路圖片的話，會完整列出圖片來源網址。

步驟六：匯出與下載

1. 直接存到 Google 雲端硬碟（轉為 Google 簡報）。
2. 下載為 PPTX，到本機 PowerPoint 開啟編輯。

參、單元二：NotebookLM 質感繪本簡報

想要手繪感、設計感、能抓住學童目光的簡報，就把資料丟進 NotebookLM（簡報內 Notebook），讓 AI 逐頁重繪插圖。

1. 語言設定（重要）：第一次使用先到右上角「個人設定／指標語言」把英文切成「中文（繁體）」，否則輸出預設會是英文。
2. 建立筆記本：進入 NotebookLM 建新筆記本，上傳剛從 Gemini 下載的 PPTX、貼網站網址、或匯入 Google 圖書／雲端硬碟文件。
3. 勾選來源：左側來源清單只勾要當繪本基準的那個檔，避免 AI 混用素材。
4. 風格提示詞：按右側快捷工作室「簡報」，輸入例如「由可愛的記憶卡娃介紹內容，用活潑卡通呈現每頁，整體紅色系，對象為小學生」。
5. 耐心等待：每頁都要重算圖，約 5～10 分鐘；免費帳號每週約可生成 20 份。
6. 匯出 PDF：確認無誤後匯出下載 PDF，這份就是後面做有聲書的圖像素材。

肆、單元三：簡報設計網與繪本工具箱

直接用 NotebookLM 生繪本，最大的問題是每頁文字和圖畫範圍沒有限定，產出不可控。我寫的「簡報設計網」就是為了解決這件事：先把頁數、每頁文字、繪圖說明固定下來，達到 100% 精準控管。

👉 繪本製作工具箱（含簡報設計網入口） ｜ 👉 剛好工具所（阿剛系列工具整合入口／備課所）
路徑：阿剛老師部落格「阿剛老師的一想世界」→ 阿剛系列工具整合入口 → 備課所 → 有聲繪本創作工具箱 → 簡報設計網。工具由 Google AppScript 開發，請先登入 Google 帳號。

1. 設定頁數與主題：跳過步驟一（人像主角不用填）；設定總頁數如 10 頁；只有概念就輸入如「小紅帽結合性別平等的創意故事」，已有全文就直接貼上。
2. 選風格＋繪本模式：選手繪水彩／溫青風／東方水墨等，按快捷情境「繪本模式」自動帶入預設提示詞；大圖少字適合低年級，中高年級可改成「設計詳細故事，文字結合圖片繪圖」；要做英文繪本在末端加註「以英文輸出」。
3. 生成＋下載雙腳本：按「開始生成」，看右側各頁規劃；下載兩個檔——「生成簡報用文字檔」（每頁標題＋排版＋繪圖提示）、「語音配音用文字檔」（整理好的角色對話純文字）。
4. 匯入 NotebookLM 精準生成：把「生成簡報用文字檔」當來源上傳，貼上專屬指令「請完全按資料內容來生成簡報，不要加入新內容」，生成後下載 PDF。

伍、單元四：對話式語音產生器

👉 繪本製作工具箱（第二步：對話式語音產生器入口）

1. 開啟工具：點有聲繪本工具箱「第二步：對話式語音產生器」。
2. 貼上配音文字：打開前面下載的「語音配音用文字檔」，全選複製（Ctrl+A → Ctrl+C），貼到產生器第一個基本編排方塊（系統已自動解析角色與每頁對話）。
3. 合成：按「合成」，AI 語音引擎把各頁對話轉成獨立聲音檔。
4. 打包下載（極重要）：不要點下方單一檔案，一定要點「打包預備／下載壓縮包」，拿到每頁一對一的 ZIP。

陸、單元五：圖音合併工具

👉 繪本製作工具箱（第三步：圖音合併工具入口，預設「合併有聲書模式」）

1. 上傳素材：選前面下載的繪本 PDF（自動拆成 10 頁圖）；選配音 ZIP（自動把 10 音訊和 10 頁圖 1:1 配對）。
2. 匯出 HTML 有聲書：按「匯出 HTML 有聲書」，輸入書名如「小紅帽的大冒險」→ 下載 .html 存隨身碟；雙擊就能在 Chrome／Edge／Safari 播放，自動翻頁朗讀，現場還能按齒輪「錄音」讓學生自己錄音替換。
3. 匯出 MP4（選用）：要上 YouTube 就切影片模式、選轉場（如放大縮小）；聲音延遲務必選「0.5 秒」；解析度 1080P 再按匯出。

防卡頓關鍵：匯出影片算圖期間，瀏覽器分頁必須保持在前景，不可切換視窗或最小化，否則影音會不同步。

柒、單元六：注音繪本與多語言

一、低年級注音繪本（GAS 腳本）

1. 用 NotebookLM 生簡報時，提示詞多加一句：「每一頁不要有文字，只呈現圖片背景」，先拿到無文字底圖。
2. 底圖上傳到 Google 雲端硬碟轉成 Google 簡報，到「字型 → 更多字型」啟用「Bpmf（注音）」相關字型。
3. 到 繪本製作工具箱 V2（STEP 01 簡報設計王 V4 頁下方的「繪本手動改注音字方式」區），貼上配音文字，按「產生並複製 GAS 腳本」。註：本站另有 剛好工具所為系列工具整合入口。
4. 回 Google 簡報按「擴充功能 → Apps 腳本」，貼上程式碼執行，系統自動在每頁加上帶注音的文字框，微調排版即完成。

二、英語與台語繪本

• 英語繪本：簡報設計網提示詞末端加「以英文輸出」，對話式語音產生器輸出語言切英文即可。
• 台語繪本：把華語丟進閩南語語音合成工具轉出台語文字與語音，下載音訊後手動到圖音合併工具替換音軌。 👉 閩南語文字轉語音

捌、單元七：OpenCode＋Genoffice（行政自動化）

研習後半段我想介紹的是免費開源的 OpenCode。它是 AI Agent，能直接存取本機資料夾、自動寫程式，幫老師處理 Word、Excel、PDF 那些繁瑣的排版微調。

👉 opencode下載點（依系統選 Windows x64 或 Mac 版）

1. 建立專案資料夾：開啟 OpenCode → 新增專案 → 指定本機工作資料夾（如 Downloads/1151014），之後產出修改的檔案都會在這裡。
2. 選免費模型：純文字選基礎語言模型；要讀 PDF／圖片，務必選支援圖像／PDF 的模型（如 Muse 等免費模型）。
3. 載入檔案：把 .docx／.xlsx／PDF 丟進專案資料夾，在對話框打 @ 即可呼叫選取。
4. 下指令（以生活檢核表為例）：

   請重新設計 @學生生活檢核表.docx 的版面。原本直式兩頁，請改為橫式，前三天（星期一至三）放第一頁，後兩天（星期四至五）放第二頁，每頁維持完整格式與簽章欄位。

5. 執行檢視：跳出安裝套件或存取權限一律按「允許／同意」；OpenCode 會在背景跑 Python 重構版面，完後到工作資料夾拿新檔。
6. 進階美感：裝免費的 Genoffice，並在 OpenCode「整合／外掛」啟用 Genoffice 套件，AI 排版時會自動呼叫渲染引擎，版面質感差很多。 👉 Genoffice下載點

玖、單元八：Gemini 音樂創作

除了簡報和繪本，Gemini 還能用文字生音樂，校慶或教學活動配樂很快就有。

1. 在 Gemini 輸入如「請創作一首慶祝台灣光復節的歌曲，曲風活潑歡快」。
2. 選長度（標準）、人聲（男／女／童聲）、樂器（搖滾／流行／古典）。
3. 線上試聽，滿意就按右側下載存檔當背景音樂。

佈署說明

這整套流程刻意設計成「免架站、免複雜安裝」：

1. 繪本工具箱系列（免安裝）：都是網頁工具，打開 繪本製作工具箱、繪本製作工具箱 V2（含 GAS 注音腳本產生器）或 剛好工具所，登入 Google 帳號即可用（底層為 Google AppScript 網頁應用程式）。
2. 注音 GAS 腳本（貼上即用）：到 繪本製作工具箱 V2 的 STEP 01「繪本手動改注音字方式」區貼上每頁文字 → 產生並複製 GAS → 回 Google 簡報「擴充功能 → Apps 腳本」貼上執行，授權一次即可。
3. OpenCode（一鍵安裝）：到 opencode下載點 抓對應系統安裝檔 → 新增專案指向工作資料夾 → 選免費模型 → 用 @ 呼叫檔案下指令。
4. Genoffice（加掛外掛）：到 Genoffice下載點 安裝 → 回 OpenCode 整合／外掛啟用，之後排版自動套用美化渲染。
5. 成品散佈（免網路）：匯出的 HTML 有聲書已把圖和音打包，丟隨身碟雙擊就能播；MP4 則可直接上傳 YouTube。

開啟繪本製作工具箱開啟工具箱 V2（含注音 GAS）開啟剛好工具所

拾、研習結語與常見問題

Q1：繪本生成失敗怎麼辦？
答：多半是 API 忙碌，或文本含 Google 敏感詞（如性平／霸凌相關反向詞彙）。重按生成，或微調詞彙即可。

Q2：有聲繪本可以離線播嗎？
答：可以。匯出的 HTML 已把圖片和音訊打包，無需網路，放隨身碟到任何電腦雙擊即播。

Q3：OpenCode 免費額度夠嗎？
答：日常校務排版和表格整理綽綽有餘，每日免費 Token 相當充裕。

結語

以上就是我這次想分享的完整流程。工具會一直更新，但我更在意的是順序：先把教學目標想清楚，再讓 AI 幫我們省下重複的工。如果這篇對你備課或做教材有幫助，歡迎分享給需要的老師。過程中若遇到問題，也可以回來對照各單元的步驟逐一檢查。

英文單字片語練功坊skill-使用免費的opencode配合skill，快速生成英語單字片語練習用html

 📚 英文老師專用 · AI 備課 skill · 免費開源
英文單字片語練功坊
貼上單字，變出四種模式的練習網頁

上傳 PDF / 圖片，或直接貼單字，AI 幫我分組、補詞性例句、逐字檢查
最後產出單檔 HTML：雙擊即開，學生免安裝就能練

⬇️ 前往 GitHub 下載 skill📦 查看使用說明 README

📥 下載方式小提醒點進專案頁後，按Code → Download ZIP（或用 git clone https://github.com/kentxchang-goedutw/engcard-skill.git），解壓縮後把裡面的英文單字片語練功坊資料夾整個放到 skill 目錄即可，詳細步驟往下看。

這款 skill 為什麼會出現？

教英文最花時間的，往往不是上課，而是把單字變成可以練習的東西。我以前的做法是：整理單字表、做單字卡、再出拼字考卷、還要錄音檔練聽力，一個單元搞下來，一個晚上就不見了。

後來我試著直接叫 AI「幫我做個單字練習網頁」，結果每次格式都不一樣，有時少了音標、有時例句太難，錯了也不知道去哪改。學生打開還要連後端，教室網路一卡就全滅。

💡 所以我換了一個想法：與其每次都從零溝通，不如把流程寫成一個 skill，讓 AI 照著固定步驟走。這就是「英文單字片語練功坊」——貼單字 → 按主題分組確認 → 輸出題庫 txt 給我逐字檢查 → 沒問題才生成單檔 HTML 練習頁。

流程裡我最堅持的是「題庫 txt 先檢查」這一步。AI 補的中文、詞性、例句一定有錯的可能，與其在網頁裡慢慢找，不如先出一份 txt 全覽讓我一次看完，確認說 OK，做HTML 才打包，錯字就不會流到學生手上。

skill使用介紹

它能解決哪些教學痛點？

🎯 痛點一：單字量一多，就不知道怎麼切

一次段考範圍三、四十個單字片語，直接丟給學生就是背不起來。這個 skill 會按語意主題切成每組 15–25 字，例如機場報到、外食點餐，一組就是一個情境，記憶有脈絡。而且分組前會先給我表格提案，我可以改名、合併、拆分，定案才往下走。

🎯 痛點二：只有紙本單字卡，練法太單一

同一個 HTML 裡直接內建四種模式，學生不用換頁、不用換工具，練完一種換一種，成就感比較容易堆起來。

模式	怎麼練
📇 單字卡	看中文猜英文，點一下翻卡，背面有英文＋詞性＋例句，可按 🔊 朗讀
⌨️ 拼字練習	看中文用虛擬鍵盤拼英文，可切大小寫＋退格，答對才顯示例句
🧩 字母重組	點字母池把字母排回正確順序，適合記拼字順序卡關的孩子
🎧 聽音選單字	自動播 3 次發音，三選一，答對顯示英文＋中文＋例句

🎯 痛點三：發給學生的東西還要裝 App、開帳號

產出的就是一個單檔 HTML，題庫直接內嵌在裡面，沒有後端。傳到班級群組、放學校網頁、隨身碟拷貝都可以，學生雙擊即開，用 Chrome / Edge 開就能練，發音用瀏覽器語音，練習次數還會自動存在本機。

📄 PDF / 圖片直接讀 📝 txt 全覽逐字檢查 🔊 瀏覽器語音朗讀 📊 WORD x OF y 進度 💾 練習次數自動保存 🎨 馬卡龍配色 RWD

使用詳細教學

第零步：先把 skill 裝好（只要做一次）

1

下載 skill

到 GitHub 專案頁 按 Code → Download ZIP 並解壓縮，或執行：

git clone https://github.com/kentxchang-goedutw/engcard-skill.git

2

放到 AI 讀得到的位置（二選一）

方法 A・全域使用（推薦）：把 英文單字片語練功坊 資料夾整個複製到 C:\Users\你的帳號\.agents\skills\英文單字片語練功坊\，之後所有專案都可用。

方法 B・只給某個工作資料夾用：放到 工作資料夾\.agents\skills\英文單字片語練功坊\，只有在該資料夾開 AI 才會載入。

放好後開新對話，可用 skill 清單就會出現它。檔名 SKILL.md 要全大寫、資料夾結構不要拆散。

💡 小提醒：產生題庫和 HTML 的過程需要 Node.js（跑驗證與打包腳本）。學生開啟練習頁則什麼都不用裝。

正式流程：四個階段，AI 會帶著我走

1

準備單字來源（三選一）

① 直接貼單字，每行 英文,中文，例如 check in,報到（缺中文 AI 會補）；② 上傳 PDF；③ 上傳圖片／掃描檔。如果是掃描版讀不到字，AI 會先問我，不要硬猜。

2

確認分組提案

我會下這樣的提示詞，AI 就會先列分組表給我看：

使用工作資料夾中的英文單字片語練功坊的skill，分析我上傳的內容

# 也可以加條件，例如：
# 按unit1-4分成四個題庫
# 按「機場、餐廳、飯店」三個情境分三組
# 每組20字，依課本出現順序切組
# 這是國小六年級程度，例句要簡單一點

表格會有組名、字數、主題、例字，這時我可以說改名、合併、拆分、增刪，這一步不定案，後面不會動工。

3

逐字檢查題庫 txt（最重要的一步）

AI 會輸出一份 <標題>-題庫.txt，列出所有組、所有單字的英文＋詞性＋中文＋中英例句，並全文貼在對話中給我看。我就逐字檢查，有錯直接說，例如「第2組第5字中文改為…」。

都沒問題，我就回 OK，做HTML，才會進入下一步。

4

生成 HTML，發給學生練

AI 會產出 <標題>-英文練習.html。玩法很固定：開啟即主畫面 → 點題庫 → 選模式 → 看上方 WORD x OF y 練習 → 答對看例句 → 上／下一個切換，練習次數會自動保存。

安裝與需求說明

這個 skill 不是 GAS 網頁應用，不需要部署，比較像「AI 的工作說明書＋打包工具包」。整理一下需求：

• 老師產生用：需要可讀 skill 的 AI 工具（如 opencode / Claude），加上 Node.js 跑驗證（validate-vocab.js）、匯出（export-txt.js）、打包（build-pages.js）三支腳本。
• 學生練習用：只要一個瀏覽器，建議 Chrome / Edge 開啟，發音用 Web Speech API，答對／答錯還有音效。
• 想改內容：不用改 HTML，直接在對話中說要改哪裡，AI 會重出 txt、重建 HTML。

常見問題

狀況	怎麼處理
skill 沒出現在清單	確認路徑是 …/skills/英文單字片語練功坊/SKILL.md、檔名全大寫、已開新對話
掃描版 PDF 讀不到字	先提供文字版，或直接描述內容，不要讓 AI 硬猜
例句太難／太簡單	在分組階段就先講程度，例如「國小六年級，例句簡單一點」
每組字數太多或太少	原則是 15–25 字，特殊需求先跟 AI 說，它會提醒是否合適

備課一次，四種練法，學生帶回家也能練

如果你也在為單字複習找方法，歡迎把這個 skill 拿去試試看。
免費開源，授權為 CC BY-NC-SA 4.0，僅供非商業教學使用。

⬇️ 前往下載 engcard-skill

📚 英文單字片語練功坊 · Made by 阿剛老師
授權 CC BY-NC-SA 4.0（僅供非商業教學使用）· 部落格：https://kentxchang.blogspot.tw

Line動態貼圖生成工具(結合google flow)

 免安裝・免帳號・純電腦本機處理

4×2 八格圖 → 動態影片
→ LINE 官方動態貼圖

用 Google Flow 讓 AI 生成的四格圖真的「動起來」，
再一鍵切成 8 張會動的 LINE 貼圖，直接打包成可送審的 ZIP

🚀 立即開啟貼圖工具

這次為什麼要整個重做？

先前我分享過一個用 AI 產生圖片、再做成 LINE 貼圖的工具，流程是「AI 生一張四格圖 → 切四格 → 打包上傳」。對老師來說確實夠用，但四格圖是四張靜態畫面，要變成動態貼圖，就只能靠一張一張輪播、加上縮放或位移撐出動感。老實說，那比較像是「會動的圖片」，而不是「一段動作」——動作是拼湊出來的，銜接自然就不順。

📌 換個思路：讓 AI 直接「動」起來

既然動作不順，那就不要硬湊。我的做法是把中間多插一個「影片」關卡：把同一組 4×2 的八格角色圖丟進 Google Flow，讓它生成一段真正的動態影片；影片本身就是連續動作，之後再交給這次新做的工具，去背、切 8 格、變成 LINE 動態貼圖。

這樣一來，前半段交給 AI 決定動作、後半段交給工具處理規格，分工乾淨，貼圖也順多了。

💡 簡單說，這次的流程變成三段：AI 生圖（Gemini）→ AI 生成影片（Google Flow）→ 切格去背打包（這個網頁工具）。工具裡就把三個入口按鈕直接排在最上方，不用另外找。

和新舊兩種做法差在哪？

比較項目	舊做法（靜態四格圖輪播）	新做法（先成影片再切格）
動作來源	靜態畫面輪播＋縮放位移	AI 生成的連續影片動作
流暢度	動作跳接、較不自然	動作連貫、接近原生動畫
畫面一致性	各格風格差異較大時會很明顯	同一段影片切出，八格動作自然對得上
可用的畫格數	固定 4 格或 8 格	影片任一秒都能切，張數更自由
學 VIDEO→貼圖的人	不熟悉影片剪輯	不用剪輯，工具自動均分 12 幀

完整流程：三個按鈕就完成

第一次使用，建議就照著下面三顆按鈕的順序走一次，之後熟悉了就能跳著用。

1

🤖 用 AI 生成 4×2 八格角色圖開啟我的 Gemini 分享連結，套用內附提示詞，一鍵得到風格統一的 8 款表情動作圖（4 欄 × 2 列）

➜

2

🎬 把八格圖交給 Google Flow 變成影片把上一步的圖匯入 Google Flow，寫一句動態提示詞（例如「八格角色同時眨眼並揮手，動作流暢不誇張」），下載 .mp4

➜

3

📦 開啟本工具：去背、切 8 格、打包 ZIP把影片拖進網頁，吸管去背 → 拖曳分割線 → 一鍵輸出 01~08.png＋main.png＋tab.png 的官方審核包

➜

💡 還沒有影片也沒關係：工具右上角有一顆「✨ 載入示範影片」按鈕，會即時在你的瀏覽器裡合成一段 4×2 的示範動畫，可以先拿來練手、熟悉每個步驟。

使用詳細教學（四個步驟精靈）

工具介面分成四個步驟，最上方就是進度條，走到哪一步點一下就能跳回去改。只要上傳影片後，四步驟全部在本機完成。

1

步驟 1：上傳影片、決定要用哪一段

把 Google Flow 下載的影片拖曳進畫面上方的大方塊（或點一下選檔案）。支援 MP4／MOV／WebM，包含 9:16 直式在內的各種長寬比都沒問題。

接著最重要的是「設定影格擷取時間區間」：

• 開始／結束時間：可用滑桿拉，也可用數字框直接輸入秒數，或按「📍 設為目前位置」抓影片當下的時間點。
• ⚡ 快捷選取長度：一鍵取 1／2／3／4 秒。其中 2 秒最推薦，因為 LINE 動態貼圖總長上限 4 秒，2 秒剛好可以播兩輪。
• 🔁 循環播放此區間：先反覆看過這一段再決定要不要用，選得好再往下走。
• 時間一改，系統會自動重新擷取 12 幀並同步到後面所有步驟。

接著選擇工作模式：「A 直接分割為正方形 MP4」（不去背、給社群短影音用），或「B 製作 LINE 官方動態貼圖」（會依序跑第 2、3、4 步）。

2

步驟 2：智慧吸管去背

LINE 動態貼圖必須是去背透明背景，這一步就是處理這件事。按「🎯 畫面吸色管」後，直接點一下畫面上要去掉的底色（例如白底或淡桃紅底），預覽就會即時變透明。

底色不乾淨時，靠兩個滑桿微調：

• 色彩容差（Tolerance）：抓「多接近的顏色算底色」，底色有漸層或雜訊時可以加大。
• 邊緣羽化平滑（Smooth）：讓角色邊緣不要出現硬鋸齒、毛邊或一圈白框。

另外還有幾個貼心細節：

• 🔍 沉浸大圖檢視去背：切到全螢幕模式，畫面可放大到 200%，細節看得清清楚楚，還能直接點大圖取色。
• 🎨 去背預覽底色：預設是「淡桃紅＋白方塊」，另有經典灰白、薄荷綠、純黑、純白與自訂色。建議先切「純黑」檢查一遍，最容易看出有沒有殘留白邊。
• 隨時可下載去背後的完整透明 GIF，先留著當備份。

3

步驟 3：網格分割線拖曳微調

影片上會疊出橘黃色（水平）與藍色（垂直）分割線，每一格就是未來的一張貼圖。

常用規格有四種快捷選擇：4 欄 × 2 列（8 格）、4 欄 × 6 列（24 格）、3 欄 × 3 列（9 格）、2 欄 × 2 列（4 格）；也可以直接輸入自訂行列（1～10）。

如果 AI 切的格線沒有剛好對齊角色：

• 直接用滑鼠／手指拖曳分割線，位置即時更新，每條線還會顯示目前百分比。
• 精準微調：下拉選一條線，按「◀ −1%／+1% ▶」一格一格修。
• 🔍 超大視窗沉浸微調：全螢幕＋放大操作，專為 9:16 直式影片設計；直式影片上傳後系統會自動切到 150% 放大，因為直式在一般視窗裡實在太窄不好點。
• 改壞了不用怕，按「還原等分」一下就回到標準位置。

4

步驟 4：設定規格並一鍵輸出審核包

最後確認四個設定，再按右上角「開始分割導出」：

• 輸出格式：LINE 動態貼圖（APNG＋ZIP）／僅正方形影片（MP4＋ZIP）／雙格式同時產出。
• 單元規格尺寸：LINE 貼圖選 320 × 270 px（上限） 或 270 × 270 px；要輸出 MP4 則有 360／512／640／720 px 可選。
• 排版模式：等比留白（Contain）保留原比例、填滿裁切（Cover）填滿不留白框。
• 播放時間：選擇「單次秒數 × 循環次數」，例如 2 秒 × 2 次 ＝ 4 秒（官方推薦）。

產出後畫面上會列出每一格，隨時能單獨下載；也可以到「👑 main.png 封面來源」與「🏷️ tab.png 標籤來源」指定要用第幾格當封面與聊天室標籤，最後按「📦 一鍵打包 LINE 官方 ZIP」即可。

打包好的 ZIP，後台怎麼上傳？

工具產生的 ZIP 已經是根目錄平鋪結構（沒有子資料夾），上傳後台的流程只要四步：

1

登入 LINE Creators Market，點左上角「新增」。

2

項目選擇「貼圖」，並在貼圖類型勾選「動態貼圖」。

3

切到「貼圖圖片」分頁，把販售張數設成你的實際張數（例如 8 張或 24 張）。

4

直接上傳工具下載的 .zip，送出審核即可。

工具已經幫你對齊官方規格

LINE 動態貼圖的審核最容易卡在「規格不符」，這也是我把規則直接寫進工具的原因。以下是本工具的預設值與官方規範的對照：

項目	工具設定	說明
動態貼圖張數	8／16／24 張	官方僅接受這三種數量
貼圖尺寸	320 × 270 px（上限）	寬高其中一邊需達 270px 以上
每張畫格數	12 幀	官方規範 5～20 幀
播放時間	1／2／3／4 秒（單次）	官方不允許 1.5 秒這類小數
循環次數	1～4 次	單次時間 × 次數 ≤ 4 秒
主圖 main.png	240 × 240 APNG	貼圖小舖封面，可自選來源格
聊天室標籤 tab.png	96 × 74 靜態 PNG	自動等比置中，不要加播放符號
背景	透明去背	官方要求去背透明處理
檔案結構	根目錄平鋪 ZIP	不必先解壓縮即可上傳

🔧 這裡有個很細的地方：APNG 的「播放秒數」與「循環次數」其實是寫在檔案內部的標記裡，一般工具算出來常常會變成 2.03 秒這種數字，送出審核就會被退件。這支工具會把每一幀的延遲精準分配，加總後剛好等於你選的整數秒，再直接改寫 APNG 的循環標記並重算校驗值，所以能對上官方要求。

兩個貼圖合輯一起用

很多老師會做不只一組貼圖（例如「開學系列」「期末系列」各一組 8 張）。這支工具內建了ZIP 多合一合併功能，不用自己去解壓縮再改檔名。

• 上傳 2 或 3 個已經打包好的 8 張貼圖 ZIP，系統會自動攤平、依序重新編號為 01.png ~ 16.png（或 24.png）。
• 每個 ZIP 卡片都能用 ▲▼ 調整先後順序，或用 ✕ 移除。
• 封面與標籤可以沿用原 ZIP 裡的 main.png／tab.png（與你原本輸出的 100% 相同，最保險），也可以改指定任意一張貼圖。
• 合併後張數不是 16 或 24 時，工具會主動提醒，避免白忙一場。

不想做貼圖，只想要 8 段短影片？

把第 1 步的模式選成 「A 直接分割為正方形 MP4」就好：不去背、不綁 LINE 規格，可以自選 512／640／720 px 與留白背景色，輸出適合IG reels、短影音或簡報播放的 1:1 影片 ZIP。不用去背的好處是畫面完整、邊緣不會糊。

✅ 純本機處理 ✅ 免安裝免帳號 ✅ 12 幀精準取樣 ✅ 吸管一鍵去背 ✅ 4×2／4×6／3×3／2×2 網格 ✅ 9:16 直式強化 ✅ 分割線拖曳＋±1% 微調 ✅ APNG／MP4 雙輸出 ✅ 官方審核 ZIP 一鍵打包 ✅ 16／24 張合輯合併 ✅ 內建示範影片試玩 ✅ CC BY-NC-SA 4.0

為什麼可以「不上傳」就完成轉檔？

因為所有運算都在你的瀏覽器裡做完：

⚙️ 動態貼圖（APNG）怎麼來的？

上傳影片後，程式會依設定的時間區間平均抓取 12 幀存在記憶體裡。每一幀依序做色彩去背 → 依分割線裁切 → 等比縮放成指定尺寸 → 交給 UPNG.js 編碼成 APNG。接著直接改寫 APNG 內部的循環標記並重算校驗值，讓它精準符合你選的播放時間與次數。

⚙️ MP4 影片怎麼來的？

使用瀏覽器內建的 WebCodecs 影片編碼 API搭配 mp4-muxer，在你的電腦上直接編成 H.264 的 MP4；不支援的瀏覽器會自動改用 MediaRecorder。同樣不需要把影片送到任何伺服器。

🔒 關於資料與隱私

• 影片不會離開你的電腦，整個流程純前端運算，沒有上傳、沒有轉檔伺服器。
• 檔案只在你按下「下載」或「打包」時才寫成檔案，並由瀏覽器直接存到你的下載資料夾。
• 要測試功能但不想上傳自己的影片，可以先按「✨ 載入示範影片」試跑。
• 工具採 CC BY-NC-SA 4.0 授權，可自由使用與教學分享，非商業為限。

常見問題

狀況	怎麼處理
吸色管按了沒反應	改用 Chrome 或 Edge；或直接點擊下方面板的預覽畫面取色，一樣有效
去背後還有一圈白邊	把「色彩容差」降低、「邊緣羽化平滑」提高，並切到「純黑」預覽底色檢查
角色被切掉一半	到第 3 步拖曳分割線，或用「精準微調 ±1%」；直式影片記得按「🔍 超大視窗」操作
貼圖動起來有卡頓感	把時間區間縮短（1 秒或 2 秒）通常會更順；也可能是 Google Flow 生成的影片本身動作太猛
審核被退件	先確認張數是 8／16／24、尺寸有在 320×270 內、背景已去背透明，再用工具產生的 ZIP 上傳
影片太長不想全部用	第 1 步把「結束時間」往後拉，或用「📍 設為目前位置」精準抓段落

讓 AI 動起來，貼圖就不再是「會動的圖片」

這次改版最大的差別，只是中間多了一個「影片」關卡，動作就自然多了。
工具免費、不用註冊、影片也不會外傳。
如果對你有幫助，歡迎分享給身邊想自己做貼圖的同事一起用。

🚀 開啟 LINE 動態貼圖工具