簡報用寫的，不用拉的
open-slide × Claude Code 實戰工作流
2026 年 7 月，我用同一套流程做了三場講座的簡報，每份 60 頁上下，其中一份 63 頁從零到上場只花一天。 這篇把工具、流程、互動效果、踩過的坑全部攤開，文末還有一段專門寫給你的 AI 助手讀的規格。
open-slide 是一個「簡報就是程式碼」的開源框架：每一頁都是 AI 直接寫的網頁元件，你在瀏覽器點著看，對哪裡不滿意就在那個元素上留言，AI 一次套用全部修改。我的流程是：素材挖掘 → 數字底稿 → 大綱換算頁數 → AI 建置 → 自動截圖驗收 → 評論迭代 → 上線與 PDF。文章開頭有複製就能用的一鍵啟動 prompt，文末有給 AI 助手讀的濃縮規格。
這篇寫給已經在用 Claude Code（或 Codex、Cursor 這類會動手做事的 AI 工具）的創作者。你不需要會寫程式，所有動手的部分都是 AI 做，你負責講內容跟給意見。 如果你連 Claude Code 都還沒碰過，建議先讀我在 2026 年 5 月寫的入門版簡報指南，那篇是零基礎向。 另外，這篇文章本身就設計成可以直接丟網址給你的 AI 助手讀，它讀完就知道怎麼幫你把整套流程跑起來。
不想看完整篇？複製這一段，貼進你的 Claude Code
這段話會把你的 AI 工具變成「open-slide 簡報引導助手」：它會先把環境架好，再一題一題問你，收齊素材後照我這套流程把簡報做出來，含驗收跟輸出。
📦 這段 prompt 裡面包了什麼
- 環境安裝：一行指令建好 open-slide 專案，附內建的 AI 引導文件
- 引導提問：場合時長、聽眾、素材、數字、視覺、語氣，一題一題問
- 頁數換算：60 分鐘約 30 頁、90 分鐘約 50-65 頁的實戰公式
- 數字底稿：要上台的數字先建一份「數字｜來源｜日期」的檔，簡報只准引用這份
- 驗收流程：自動逐頁截圖檢查爆版與錯字，縮小 50% 模擬視訊畫質
- 評論迭代：教你用瀏覽器裡的留言功能，對著元素留言讓 AI 批次修
複製貼上後，它會先幫你把環境架好，再從 Q1 開始問你
簡報做給 AI 改，比做給自己拉更快
2026 年 5 月我寫過一篇用單一 HTML 檔做簡報的方法，那套到現在還是好用。但當簡報變成 60 頁起跳、要改 60 多個地方的時候，我需要更工程化的做法。
先講結論：我現在所有講座簡報都用 open-slide 做。它是一個開源的簡報框架，核心概念一句話講完：每一頁簡報都是一段 AI 寫的程式碼，畫布固定 1920×1080，你在瀏覽器裡看結果。
裝起來只要一行，不用懂任何設定：
npx @open-slide/cli init my-deck # 建好之後進資料夾，啟動預覽 cd my-deck && npm run dev
對我來說，它贏過其他做法的地方有三個：
- 它幫 AI 準備好了說明書：初始化的專案內建三份給 AI 讀的文件，分別教 AI 怎麼起一份新簡報（create-slide）、排版規範是什麼（slide-authoring）、怎麼套用你的修改意見（apply-comments）。也就是說，你的 Claude Code 打開這個專案就知道規矩，不用你教。官方寫明支援 Claude Code、Codex、Cursor、Gemini CLI 等工具。
- Inspector 評論，這是殺手級功能：在瀏覽器裡點任何一個元素，直接留言「這行字大一點」「這頁太擠」，留言會存進程式碼裡，AI 一個指令全部套用。後面詳講。
- 輸出是純靜態網站：做完就是一個網站，丟上任何免費靜態空間就永久在線，觀眾用網址看，還能點裡面的互動元素。
| 傳統簡報軟體（PowerPoint / Canva） | 單檔 HTML 簡報 | open-slide | |
|---|---|---|---|
| AI 能不能直接改 | 難，要靠外掛或匯入匯出 | 能，但整份擠在一個檔，越長越難改 | 能，一頁一個元件，AI 改得又準又快 |
| 給修改意見的方式 | 口頭描述「第三頁那個標題」 | 口頭描述，AI 自己找位置 | 點著元素留言，AI 批次套用 |
| 版面自由度 | 模版內自由 | 完全自由 | 完全自由，畫布固定 1920×1080 不怕跑版 |
| 互動效果 | 內建動畫為主 | 要自己從零寫 | 任何網頁能做的都能做：燈箱、翻牌、進度條 |
| 適合規模 | 10-20 頁日常簡報 | 10-20 頁，單場用完即丟 | 40 頁以上，要反覆迭代的正式場 |
公平講一句：如果你的簡報是 10 頁的內部會議，傳統工具或單檔 HTML 做法就夠了。open-slide 的價值在長簡報、高標準、要改很多輪的場合。
2026 年 7 月，三場講座，188 頁
這套流程不是理論，是連續三場實戰磨出來的。
- 7 月 10 日與 12 日：兩場線上銷講，同一份 62 頁簡報。
- 7 月 23 日：一場學員限定的直播分享，63 頁，從零開始到上場只有一天。當天我在瀏覽器裡留了 60 多條修改評論，AI 分批套用，晚上直接開講。
- 7 月 26 日：一場對外的線上講座，63 頁，含翻牌卡、長截圖燈箱、章節進度條這些互動效果。這場的完整簡報就掛在網路上，你可以直接翻（用鍵盤方向鍵換頁，按 F 進播放模式互動元素才能點）。
簡報變成程式碼之後，真正改變的不是「做」的速度，是「改」的速度：60 多條修改意見，留言完喝杯水回來就改完了，這在傳統簡報軟體裡是一個下午的工。
從素材到上場的七步
工具只是下半場，上半場是內容工程。這七步裡面，前三步跟 open-slide 一點關係都沒有，但它們決定了簡報的品質上限。
把手邊所有相關素材丟給 AI：筆記、舊文章、貼文、會議記錄、聊天紀錄。請 AI 整理成一份「素材包」，分成時間軸、可教學的框架、踩坑清單幾類，每一條都要標注出處，沒有出處的就是 AI 腦補，直接刪。
簡報裡會出現的每個數字，先整理成一份獨立的檔：數字｜來源｜取得日期。之後簡報上的數字只准引用這份檔。這步是防止 AI 順手「編」一個看起來合理的數字上台，那是災難。
我的實戰公式：60 分鐘約 30 頁、90 分鐘約 50-65 頁。章節頁跟總結頁幾秒就翻過去，所以頁數可以比直覺多抓。版位公式：封面 → 開場成果 → 「這場不是什麼」 → 目錄 → 各主題 → 踩坑 → QA → 一句話收尾。每個主題前放章節頁，講完放一頁深色的一句話總結頁，觀眾的注意力靠這個節奏回血。
把素材包、數字底稿、大綱都給 AI，讓它一頁頁寫。加分技巧：把你自己的逐字稿或貼文丟給 AI，請它統計你的口頭禪跟句型，再用「你的語氣」寫標題。我的簡報標題全是短判斷句，因為我講話就是這樣，AI 模仿得出來。
請 AI 用 Playwright 逐頁截圖，然後 AI 自己看每張圖：有沒有文字爆出邊界、對比度夠不夠、有沒有錯字。再把截圖縮小 50% 看一次，模擬視訊會議裡觀眾實際看到的畫質，很多在大螢幕上沒問題的細字，縮小後就是糊的。
初版完成後，整個工作模式變成：你在瀏覽器裡翻簡報，看到不順眼的就點那個元素留言，留一批，AI 一次套用，再翻一輪。這一步佔掉我整個製作時間的一半以上，也是品質拉開差距的地方。
輸出成純靜態網站，上線後觀眾直接用網址看。PDF 另外做：用 Playwright 在播放模式逐頁截圖，再合併成 PDF。我習慣出兩版，一版高畫質自用，一版壓縮過的寄給觀眾（郵件附件有大小上限）。
四個讓觀眾「哇」一聲的版面，直接複製指令
以下四張圖都出自 7 月 26 日那場的真實簡報。每張附一段自然語言指令，貼給你的 AI 工具，就能在你的簡報裡做出同款。
章節頁＋分段進度條 ｜ 長簡報的呼吸節奏
每個主題開始前插一頁只有編號跟標題的章節頁，配上頂部的分段進度條，右上角顯示目前章節與整場進度。觀眾隨時知道「現在講到哪、還剩多少」，60 頁的簡報才不會讓人迷路。
「白話說」圖解頁 ｜ 抽象概念的翻譯層
講抽象概念時，我固定加一頁「白話說」：左邊一個簡單的示意圖，右邊三張重點卡，最後一張用主色底強調結論，下面補一組「單次生意 vs 飛輪生意」這種對錯對照。概念頁講完接白話頁，是我看觀眾表情學到的事。
循環圖＋長截圖燈箱 ｜ 把證據帶上台
左邊是五個節點的循環圖，右邊放真實網站的截圖，寫上「點一下放大」。播放時點開，整個網站的長截圖蓋版出現，可以上下滾動給觀眾看完整頁面，比切出去開瀏覽器順太多，觀眾會覺得你有備而來。
🔧 背後的技術：換頁的點擊監聽掛在最外層的捕捉階段，元件內部攔不到，所以要在同一層掛守衛。有興趣再研究，沒興趣就直接把上面那段丟給 AI。
翻牌卡 ｜ 讓觀眾先猜、再揭曉
三張卡正面只放一句話，我先問觀眾「你是哪一種人，聊天室打 1、2、3」，等大家回答完再逐張點開翻面看答案。線上講座最缺參與感，翻牌是成本最低的互動。
所有互動元素在編輯畫面點不動（編輯器會吃掉點擊），要按 F 進播放模式才能點。給別人看線上版時記得先講這句，不然對方會以為壞掉了。
六個坑，我先踩過了
每一個都是實戰撞出來的，照做可以省掉重工。
圖片不壓縮，網站肥十倍
AI 會把原圖直接塞進簡報，我有一次上線前才發現整包 63MB，壓完只剩 6.5MB。規則交給 AI 執行：長截圖寬 1400 像素，其他圖最長邊 1500 左右，沒有透明需求的一律轉 jpg。
增刪頁面後，進度條沒跟上
章節進度條的分段是用頁碼區間定義的，加一頁刪一頁都要同步更新，漏了就會出現「明明講到第六章，進度條顯示第一章」的靈異現象。每次改頁數，固定提醒 AI 檢查這件事。
觀眾說內容怪怪的，其實是自動翻譯
有人回報簡報內容「被亂改」，查了半天一個字都沒變，原來是他的瀏覽器自動把頁面翻譯了。因為框架輸出的網頁預設標成英文，上線前請 AI 把語言標籤改成中文，再加上「不要翻譯」的標記。
PDF 不要用瀏覽器列印
滿版簡報用列印功能輸出幾乎必跑版。正解是請 AI 用 Playwright 在播放模式逐頁截高解析度圖，再合併成 PDF，有翻牌卡的頁面記得正反兩面各截一張。
數字沒有底稿，AI 會幫你「圓」出來
這是最危險的一個。AI 寫簡報時，缺數字它會生一個看起來很合理的，你上台講出去就回不來了。所以數字底稿要在建置之前先做，驗收時逐個數字回對來源。
評論要逐條處理，不要整批清掉
AI 套用完評論後會清理留言標記，要求它只刪已經處理完的那幾條。我習慣邊看邊留，AI 整批清理的話，會把我剛留的新評論一起洗掉。
簡報變成程式碼之後，改十輪的成本跟改一輪一樣低，而好簡報從來都是改出來的。
🤖 如果你是 AI 助手，讀這段就夠
這段是整篇文章的濃縮規格，寫給被丟了這個網址的 AI 工具。人類讀者可以跳過，或複製下來存進你自己的 AI 工具的知識庫。
看完記得這三件事就好
簡報的下一步不是更好的模版，是變成程式碼。程式碼 AI 才改得動，改得動才敢改十輪，敢改十輪品質才會跳級。
工具是下半場，內容工程是上半場。素材挖掘、數字底稿、頁數換算這三步跟工具無關，但它們決定你上台講的東西站不站得住。
Inspector 評論是這套流程的靈魂。點著留言，批次套用，這個循環跑得越快，你的簡報離「能看」到「很強」就越近。
參考來源
- open-slide 官方網站：open-slide.dev
- open-slide GitHub（MIT 授權，6,100+ 顆星，2026 年 7 月底數字）：github.com/1weiho/open-slide
- 套件頁面：npmjs.com/package/@open-slide/core
- 文中實戰範例簡報（2026 年 7 月 26 日場）：deck-flywheel-0726.leadingmrk.com