Communitygithub.com

LucasLBrito/video-tutorial-terminal

為逐步教學影片撰寫腳本與動畫,讓終端機指令與旁白節奏同步顯示在 9:16 直式畫面中,方便觀眾暫停並跟著輸入。

video-tutorial-terminal 是什麼?

這項技能(skill)專為建立「逐步教學影片」而設計,特別適合展示 Git、GitHub CLI、Docker、npm、pip、Linux 等終端機指令操作。它會產生一個 9:16 直式格式的影片腳本與動畫,讓每個指令在旁白念出時同步顯示在畫面上,觀眾可以隨時暫停並跟著輸入。技能的核心是 `Term` 物件,用來精確控制指令的出現時間、打字速度(每秒 24 個字元)以及輸出內容。它還支援多種視覺輔助元素,例如提示框、狀態流程圖、分支示意圖、優劣範例對比,以及最終的檢查清單。這項技能通常與 `video-dev` 技能搭配使用,後者負責提問、準備素材與最終渲染。使用前務必確認所有指令都已實際測試或查證官方文件,以確保正確無誤。

相容平台✓Claude Code~Codex CLI~Cursor
npx skills add https://github.com/LucasLBrito/midia-skills/tree/main/skills/video-tutorial-terminal

在你喜歡的 AI 中提問

開啟一個已預先載入此 Agent Skill 的新對話。

說明文件

終端機教學影片

路徑: ${CLAUDE_PLUGIN_ROOT} 是本插件的根目錄。若該變數未定義,則根目錄位於此技能「Base directory」的上兩層(<raiz>/skills/<skill>)。如果技能檔案被直接複製到 ~/.claude/skills,請用 ~/.claude/skills 取代 ${CLAUDE_PLUGIN_ROOT}/skills。

模板為影片 「Boas práticas de Git e GitHub」:14 個場景,約 3 分 37 秒。完整專案位於 ${CLAUDE_PLUGIN_ROOT}/skills/video-dev/examples/git/(包含 roteiro.json、cenas.py、pronuncia.json)。在開始撰寫之前,請先打開範例中的 cenas.py 參考。

若尚未依 video-dev 技能的流程(提問、準備、建立資料夾)進行,請先執行該技能。

開始撰寫前:指令必須正確可執行

觀眾會實際輸入畫面上顯示的指令。請列出教學中的所有指令,並盡可能實際執行這些指令(在測試資料夾中),以確認語法正確並複製真實輸出(或簡短版本)。絕不要憑空編造旗標(flag)。若某個指令需要帳號、網路或會造成破壞性影響(如 push、deploy、rm),則不要實際執行,應查閱官方文件確認。

結構

#區塊內容
1開場主題 + 如何跟隨操作:「1 · 暫停影片 → 2 · 在終端機輸入 → 3 · 繼續播放」
2…n-1步驟passo(n, 標題, 顏色) + Term(含 1–4 個指令) + 一個提示或警告框
步驟之間提示無編號場景,使用 selo(0.1, "提示", PINK),用於說明最佳實踐(例如 Conventional Commits)
n檢查清單含所有步驟的編號清單 + 「儲存並在下一專案中使用」

順序:從一次性設定,到每日例行流程,最後進階操作(如 rebase、tags)。每個場景一個步驟;若某步驟有超過 4 個指令,則拆成兩個場景。

腳本

  • 每句開頭用「步驟 N:」,並在指令前說明做什麼與為什麼。
  • 指令的念法要符合閱讀習慣:「git push, dash u, origin main」;「git switch dash c」;「feat slash login」;「dot gitignore」。畫面上則顯示實際的指令。
  • 重要警告需有獨立句子:「密碼和 API 金鑰絕對不要放到儲存庫中。」
  • 英文術語:確認是否已收錄在發音對照表中(請參考 narracao-voz)。若主題有特定詞彙(如 docker compose、kubectl……),請在專案中建立 pronuncia.json。

終端機 (Term)

Term(1.0, 700, [                                   # t 為進入時間,y 為中心 Y 座標
    (2.4, "$", 'git config --global user.name "Seu Nome"'),   # (時間, 類型, 文字)
    (5.4, "$", 'git config --global user.email "[email protected]"'),
    (6.2, "o", "藍色指令輸出文字"),
    (7.0, "#", "# 灰色註解文字"),
])
  • 每行出現的時間點 = 旁白開始唸出該指令的時刻(--tempos N)。
  • 打字速度為每秒 24 個字元(CPS,由引擎控制)。一個 40 個字母的指令約需 1.7 秒;下一行應在之後才開始。
  • 每行最多約 44 個字元(size=32)。若超過,請用 \ 斷行,並在下一行使用 ">" 繼續。
  • 輸出("o")應簡短且符合實際情況。可縮短,例如:「Initialized empty Git repository」。
  • 使用中性的範例資料:「Seu Nome」、「[email protected]」、「meu-projeto」、「voce/meu-projeto.git」。切勿使用使用者的真實資料。

已驗證有效的輔助元素

構想實作方式
警告(「絕對不要這樣做」)在終端機上方或下方使用 Box(t, 540, y, "文字", RED, filled=True)
提醒Box(t, 540, ~1030, "請使用與 GitHub 帳戶相同的電子郵件", ORANGE)
網站上要點擊的位置使用 Box(PURPLE)標示路徑:「github.com:New repository(空白,不含 README)」
狀態流程圖3 個並排的 Box(x 190/540/890,w=290)+ 帶箭頭的 Line + 下方的 Text 等寬字型(如 git add、git commit)
從 main 分支出去的分支綠色水平 Line(main)+ 3 條紫色 Line 形成分支 + 標籤
好 vs 壞對比綠色框顯示好的範例 + 紅色 Text 等寬字型顯示壞的範例(如「ajustes」、「final2」)
語意化版本大字「v1.4.2」+ 3 個框分別標示 major/minor/patch + 灰色說明文字
最終檢查清單lista_vertical(...) 或使用 Box(w=860)搭配各項目不同顏色

節奏

  • 標誌與標題在 0.1–0.2 秒內出現。終端機在首個指令前約 1 秒進入畫面。
  • 提示或警告框在旁白提及時出現,通常是在指令之後。
  • 每個場景長度 12–18 秒。教學影片的場景可比概念說明影片稍長,因為觀眾正在輸入指令。

最終渲染前檢查清單

  • 畫面上的每個指令都經過測試或已查閱文件確認。
  • 終端機中沒有任何一行超出邊界(請用 --preview 檢查)。
  • 旁白中的步驟編號與畫面中的「步驟 N」標誌一致。
  • 最終檢查清單包含所有步驟,且順序相同。
  • 指令中沒有包含任何真實的個人資料(電子郵件、使用者名稱、權杖)。

Individual skills in this repo

This repo contains 2 individual skills — each has its own dedicated page.

相關技能