教學視覺指南

0為什麼影片需要教學視覺

影片不是乾錄操作——過程中會疊上教學視覺，觀眾才跟得上。同一段操作，有沒有配對視覺，成品是「教學影片」和「無聲錄屏」的差別。你不用寫任何標記語法，只要會用白話指揮 AI 放哪種視覺。

1六種視覺一覽

2真實範例：outline 裡長這樣、影片裡長這樣

下面標記全部節錄自已完成的 01-pm/01-framework/02-outline.md，截圖是同一支成品影片的真實畫面——左看標記、右看效果，一次看懂：

全螢幕——開場講概念，大字投影片蓋住畫面：

[全螢幕] 📚 什麼是合規框架？
合規框架是各國或組織發布的資安規範。常見的有：
• CMMC 2.0 — 美國國防部供應鏈資安認證
• ISO 27001 — 國際資訊安全管理系統標準

PM 拿到官方 PDF 後，可以匯入系統，後續所有專案都能選用該框架作為評估基底。

導覽——頁面導覽，高亮框逐一指（一批會標 1/4、2/4… 步驟）：

[導覽] .p-datatable | 框架列表 | 顯示所有已建立的合規框架，包含名稱、版號、發布機關與狀態。 | 1/4 | bottom
[導覽] button:has-text('新增') | 新增按鈕 | 點擊建立系統中尚未有的合規框架。 | 2/4 | bottom
[導覽] input[placeholder*='搜尋'] | 搜尋欄 | 輸入名稱、代碼或發布機關快速搜尋。 | 3/4 | bottom

（開頭那串 .p-datatable 是「指哪個元素」的技術定位，AI 會自己填，你不用管；你 review 的是後面的標題和說明文字。）

說明——操作中補一張不擋畫面的提醒卡：

[說明] ➕ 新增框架的時機
當系統內建框架沒有你需要的，例如客戶要導入內部自訂框架，或新國際標準剛發布。

字幕＋暫停——操作節奏的基本款：

[字幕] 點擊新增合規框架按鈕
→ 點擊新增合規框架按鈕
[字幕] 框架建立成功
[暫停] 3 秒

章節標題——每段開頭的進度標記（左下角滑入，停 4 秒）：

[章節] 新增合規框架
建立一個示範用框架

3怎麼下 prompt 指揮視覺

時機一：寫 draft 時就講（最省事——AI 轉 outline 時直接配好）：

前置說明：
開頭用「全螢幕」好好解釋什麼是合規框架、跟專案的關係（給完全不懂的人聽）。

功能介紹：
進到頁面後幫我做「頁面導覽」：逐一介紹列表、右上角新增按鈕、搜尋區塊、每行的功能按鈕。

操作示範：
1. 點「新增框架」——彈出視窗時加一張「說明」講什麼時候會需要新增框架
2. 填完欄位按儲存，成功後「暫停」幾秒讓觀眾看到結果

時機二：review outline 時嫌不夠，追加調整（對 AI 說白話就好）：

「第 2 段的頁面導覽少介紹了『匯入版本』按鈕，補一個導覽進去。」

「開場的全螢幕太長了，拆成兩張，第一張講定義、第二張講三層架構。」

「填表單那段節奏太快，儲存後加暫停 5 秒。」

「第 3 段整段沒字幕很乾，每個操作前補一句字幕。」

時機三：看完 mp4 才發現問題，一樣叫 AI 改：

「影片 2:10 的說明卡片擋到表單了，換個位置或改用字幕。」

「1:30 那張全螢幕字太多觀眾讀不完，精簡到三行以內。」