← ClaudeAtlas

render-flowchartlisted

Render an animated flowchart B-roll from a Mermaid/DOT graph using Hyperframes. Use for process explanations, decision trees, or system diagrams.
huodebing-alt/Agentic-Headshot-Video-Studio · ★ 0 · AI & Automation · score 71
Install: claude install-skill huodebing-alt/Agentic-Headshot-Video-Studio
# Render Flowchart / 流程图 ## When to use / 何时使用 Process/workflow visuals; supports node-by-node reveal animation. 流程、工作流可视化;支持节点逐个揭示。 ## Inputs / 输入 - `--graph` inline Mermaid or `--graph-file inputs/diagrams/flow.mmd`. - `templates/broll/flow/*.html` (mermaid-js renderer). ## Output / 输出 - `workspace/broll/broll_<id>.mp4`. ## Steps / 步骤 1. Validate Mermaid syntax via `mmdc --validate`. 2. Inject into template with reveal animation (`stagger: 600ms`). 3. Render with Hyperframes at 1920×1080 @ 60fps. ## Examples / 示例 ``` claude run render-flowchart --id 09 --graph-file inputs/diagrams/rag.mmd ``` ## Failure recovery / 失败回退 - If Mermaid invalid, surface parser error. - If > 20 nodes, auto-cluster or warn (legibility).