Claude HTML 簡報教學：如何下指令、修改、動態呈現與配圖實作

Claude 可以把大綱做成在瀏覽器逐頁播放的 HTML 簡報。這篇用八頁例會提案，帶你完成第一版、修改太擠的頁面，再依用途加入圖解、照片與簡單互動。

先不用把所有效果加滿。我會先確認「這份簡報要讓對方做什麼」，再處理畫面；能播放、改得動之後，才值得花時間精修。下面照五步做，也能換成提案、品牌介紹或教學簡報。

下面的指令都是參考範本，不是固定答案。 請把［方括號］換成自己的主題、聽眾、資料與交付需求，再依實際回覆調整，不用照抄這份例會。

第一步：先問大綱，確認每頁要說什麼

登入 Claude 網頁版，開一個新對話。先準備聽眾、希望對方採取的行動、可用資料，再填入下面的範本。本例講 5～8 分鐘，提議的例會才是 30 分鐘，兩者不要混在一起。

大綱參考範本｜請依自己的用途修改，不必固定八頁。

【情境敘述】
- 簡報主題：［想說明的事］。
- 聽眾與目的：［說給誰聽，希望對方採取什麼行動］。
- 使用場合與說明時間：［場合／分鐘］。
- 可用資料：［貼上已確認的內容；沒有的資料請先問我］。

【任務講解】
- 先規劃［頁數］頁大綱，暫時不要製作畫面。
- 每頁只處理一個溝通重點，最後引導到上面的行動目標。
- 缺少資料或前後矛盾，請先列出，不自行補寫研究、成果或數字。

【格式補充】
- 使用自然的台灣繁體中文。
- 逐頁列出：標題、要讓聽眾理解的事、主要內容。

不要看到八頁齊全就直接往下做。這次 Claude 多補了「同一議題連續兩週」等情節，也自行推論 15 分鐘後應有足夠資訊。我請它刪除，並把八頁順序調成：問題 → 做法 → 流程 → 時間 → 前後差異 → 情境選擇 → 下一步，封面則只留「30 分鐘，決定一件事」。

想跟著範例練習？看看大綱怎麼調整

這份例會提案先安排會前準備、會中比較選項、會後留下決定與分工；無法定案時，也要記下缺少資訊、負責人與再確認日。核對時，我把它多寫的情節刪掉，再確認八頁各自的任務。自己的主題不必沿用這份順序。

到這裡先確認：每頁只負責一件事；刪掉無來源的設定，再同意製作畫面。

第二步：明確要 HTML，拿到能開啟的檔案

在同一個對話接著說。不要只寫「幫我做簡報」：本篇要的是完整 .html 檔，不是 PowerPoint，也不是一張看起來像簡報的圖片。

製作參考範本｜請調整風格、比例與操作需求；不需要的功能可以刪掉。

【情境敘述】
- 使用剛才確認的大綱，製作給［聽眾／場合］的簡報。
- 視覺方向：［自己的品牌色、風格或參考描述］。

【任務講解】
- 製作完整、可下載、用瀏覽器開啟的 HTML 簡報，不是 PowerPoint。
- 每頁一個主張，搭配少量文字與合適的圖形；不要每頁都套相同卡片。
- 提供翻頁、頁碼、可點選跳頁的真實縮圖總覽，以及搜尋與返回；G 可開總覽。

【格式補充】
- 比例為［例如 16:9］，一次一頁，使用台灣繁體中文。
- 手機按鈕要容易點；先用內嵌圖形或 SVG，不依賴外部素材。
- 交回完整檔案、簡短操作說明與尚未測試的部分。
- 不讀其他檔案、不操作我的電腦、不安裝或公開分享。

從回覆的檔案卡下載後，離開 Claude 預覽，重新用瀏覽器開啟那份檔案。先翻過八頁，再開 G 總覽確認縮圖真的對應內容，而不只是八張標題卡。介面或輸出格式不同時，可對照 Claude 官方成品說明；不要先急著換工具。

查看這次下載的原始八頁 HTML

這份原始產出仍是 16:9 投影片。手機直向會整頁縮小；按鈕可操作，不代表小字都適合直向閱讀，建議轉橫向查看。

到這裡先確認：拿得到完整檔案；下載後能翻頁、開總覽、點縮圖跳頁。

為什麼用 HTML？什麼時候仍該用 PowerPoint？

從手動排版、範本，到 AI 協助製作，省下的不只是放物件的時間，也讓我們能直接描述「這裡要做流程」「這段講到才出現」。我認為 HTML 受到注意，正是因為內容、版面與操作可以一起討論。

代價是要自己確認播放、素材與交付。客戶要持續編輯 PowerPoint、需要公司母片，或場地指定軟體時，就先用適合交付的格式。選工具之前，先問這份簡報最後由誰使用。

第三步：先看整份，再只改有問題的一頁

先開總覽看節奏：是不是每頁都一樣？哪頁文字最多？哪些內容其實可以口頭說？進到有問題的那頁，再用「頁碼＋問題＋希望怎麼改＋保留什麼」下指令。

修改參考範本｜填清楚自己的問題與必留內容，不必照範例改成三個流程重點。

【情境敘述】
- 只調整第［頁碼］頁。
- 目前問題：［哪裡太擠、看不懂，或實際操作出了什麼問題］。
- 這頁要讓聽眾理解：［一個核心重點］。

【任務講解】
- 希望改成［流程、對照、圖解或其他具體做法］。
- 必須保留［主張、關鍵內容與例外情況］；不確定怎麼取捨，先問我。
- 文字太多時先整理內容，不要只縮小字。

【格式補充】
- 其他頁、既有風格與翻頁、總覽、搜尋、返回功能不變。
- 交回完整 HTML 檔，簡短列出修改處與尚未測試的部分。

例會案例裡，我指定第四頁，把會前、會中、會後改成三個同等層級的流程重點；背景、拍板者和會後紀錄改用短註記保留，無法定案的處理也不能刪掉。下面是那次實際修改前後的畫面。

開啟這次修改後的完整 HTML

修改後不要只看新畫面。回到總覽檢查前後是否一致，再核對原本要保留的資訊。排不下時，先決定哪些要留在投影片、哪些用口頭補充；一路縮字，只會把閱讀負擔留給觀眾。

到這裡先確認：指定頁面更好懂，其他頁與原有操作沒有跟著壞掉。

卡住時，先用這三種方式說明問題

• 拿不到檔案：先補清楚要的是完整 HTML 檔，不是部分程式碼。若介面提示啟用雲端檔案製作功能，先核對官方說明；不需要因此授權操作自己的電腦。
• 頁面太擠：說明要保留的主張與內容，請它刪減或改成流程，不只要求「更精緻」。
• 按鈕沒作用：回報第幾頁、按了什麼、實際發生什麼，再請它只修這個問題，交回完整檔案。

第四步：配圖與互動，要幫內容說話

同一份內容，還能進一步整理成不同的設計。下面兩版都是完整八頁，分別搭配圖解與商務照片；按 G 開啟總覽，先比較整份簡報的節奏，再看每頁怎麼安排。

圖解版：把關係講清楚

開啟圖解版八頁總覽

流程、分工、時間與選項，適合用原生圖形或 SVG。重點是讓人看出關係，不必每頁塞一張裝飾圖；需要調整時，也能清楚指出要改哪個圖形。

商務圖片版：先建立情境，再回到判斷

開啟商務圖片版八頁總覽

這版用 Magnific 圖庫照片帶出會議情境，改用暖白與深綠、較大的主張和留白。照片負責情境，圖表負責比較。 因此第五頁的時間分配沒有硬塞照片，兩版也不只是換背景。

實作時先選一頁：決定圖片要說明什麼，再挑方向、人物位置與可放字的留白。想改用 GPT 製作插畫，也先給用途與構圖，不必把整份簡報重新生成。上傳或公開前，核對自己的使用權；圖庫可瀏覽不等於可把原圖包一起散布，使用範圍以 Magnific 條款及適用授權為準。

想加動態？先從一種有用途的互動開始

兩版第四、五頁可逐段呈現；第七頁則選「資訊同步」或「需要決定」，再到第八頁看下一步。這是單機示範，不是多人投票，也不會收集答案。

換成自己的內容時，沿用第三步的修改範本：在「情境敘述」寫清楚哪一頁、為什麼需要選擇；在「任務講解」交代選項、選完要看到什麼，以及返回與重選；在「格式補充」註明不要串接表單、投票或外部服務。先試一頁，確認操作順暢，再決定要不要延伸到其他頁。

先確保不操作也看得懂；有操作，再檢查返回、重選、手機點選。動態能幫你控制講述順序就夠了，不必讓每個元素都動。

到這裡先確認：圖片有任務；圖解、照片與互動不會搶走同一頁的主張。

第五步：整理交付，再換一個題目練習

交付之前，至少自己走過一次：

• 重新開檔：翻完八頁、測總覽與搜尋，不只看 Claude 裡的預覽。
• 換個尺寸：手機能讀、按鈕能點；實際要投影，也要用投影環境再確認。
• 收齊素材：若加了圖片，把 HTML 和它引用的檔案放在一起，不只寄一個缺圖的網頁檔。
• 說明格式：附上怎麼開、怎麼翻頁與限制。靜態 PDF 只能當備用，不能宣稱是可編輯的 PowerPoint。

接著換題，但先只做大綱。下面三題各有不同的溝通任務，不是把「例會」兩個字換掉就好。

換題練習	要交出的成果與檢查方式
接案提案	假設收到一份委託，排出「需求、建議做法、服務範圍、下一步」。看完要能回答：客戶現在要決定什麼？費用、成果與案例沒有資料就不要補寫。
品牌介紹	選一個自己熟悉的品牌，先說服務誰、主張什麼，再放有根據的證據。檢查每頁是否都圍繞同一個主張，而不只是品牌形容詞。
教學簡報	選一個能在五分鐘教完的技能，安排「概念、示範、練習」。最後要有可操作的任務和完成標準，不只問聽眾懂不懂。

我會先請 Claude 按第一步的方式提出大綱，確認每頁任務後才製作 HTML。這樣練的才是同一套工作方式，而不是依賴某一份漂亮範本。

到這裡先確認：不看本文，也能說出自己的聽眾、行動目標，以及下一份簡報要怎麼開始。

Claude HTML 簡報常見問題

接下來，用適合的工具處理不同任務

這篇從大綱走到可播放的 HTML；如果手上還是一堆資料，可以先看 NotebookLM；想先整理內容、快速製作簡報初稿，再看 Gamma。三篇都能獨立跟做，不必按照固定順序讀完。

工具能幫我們把想法做出來，但不能代替「這份簡報要讓人理解什麼」。想進一步練習內容、視覺與表達，也可以參考本站的 Canva 課程；先選自己最需要補強的部分。

AI 加速的 Canva 實戰課 →