[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"tb-a-2077715107739074560-2077716901353488384":3},{"detail":4,"html":18,"toc":19,"catalog":48,"tool":52},{"id":5,"title":6,"coverUrl":7,"url":8,"level":8,"description":9,"publishDate":10,"views":11,"isCollect":12,"isLike":12,"vipRequired":13,"vipFlag":14,"price":8,"contentType":15,"station":8,"seq":15,"readMinutes":16,"toolIds":17,"relatedVideo":8},"2077716901353488384","HeyGen hyperframes：官方视频框架，一次装齐 8+ 成片工作流","",null,"HeyGen 官方出品，GitHub 35.6k 星。用 HTML\u002FCSS 把内容渲染成 MP4，纯本地跑（Node+FFmpeg+Chrome，不用 API）。一次安装覆盖产品发布片、网页转视频、无脸解说、动效、字幕、卡点视频等 8+ 工作流。想一站式做各类成品视频首选。","2026-07-16",0,"0",false,"1",1,3,[],"\u003Cdiv style=\"padding:0 4px 24px;font-size:14px;color:#333;line-height:1.85;word-break:break-word\">\n\n\u003Cdiv style=\"background:#FFF7ED;border:1px solid #FFEDD5;border-radius:12px;padding:12px 14px;margin:0 0 18px;font-size:13px;line-height:1.7;color:#9A3412\">🏛️ \u003Cstrong style=\"font-weight:700;color:#1a1a1a\">HeyGen 官方出品\u003C\u002Fstrong>（知名 AI 视频公司）。GitHub 35.6k 星，Apache 开源。视频类的绝对核心框架。\u003C\u002Fdiv>\n\n\u003Ch1 style=\"font-size:17px;font-weight:800;color:#111;margin:26px 0 14px;padding-left:10px;border-left:5px solid #FF8916;line-height:1.5\" id=\"s1\" data-toc>一、这是什么\u003C\u002Fh1>\n\u003Cp style=\"margin:0 0 14px\">一个用 \u003Cstrong style=\"font-weight:700;color:#1a1a1a\">HTML\u002FCSS 把内容渲染成 MP4\u003C\u002Fstrong> 的开源视频框架——不用剪辑软件、不用会 After Effects，写好网页就能出片。最关键的是：\u003Cstrong style=\"font-weight:700;color:#1a1a1a\">纯本地跑\u003C\u002Fstrong>（Node + FFmpeg + 无头 Chrome），不用 HeyGen 的 API，也就不烧云端额度。\u003C\u002Fp>\n\n\u003Ch1 style=\"font-size:17px;font-weight:800;color:#111;margin:26px 0 14px;padding-left:10px;border-left:5px solid #FF8916;line-height:1.5\" id=\"s2\" data-toc>二、一次安装，8+ 种成片工作流\u003C\u002Fh1>\n\u003Cp style=\"margin:0 0 14px\">装一次，下面这些「一句命令出片」的工作流全都有：\u003C\u002Fp>\n\n\u003Cdiv style=\"background:#fff;border:1px solid #F1F5F9;border-radius:14px;padding:14px;margin:0 0 10px;box-shadow:0 2px 10px rgba(0,0,0,0.03)\">\u003Ch2 style=\"font-size:15px;font-weight:700;color:#1a1a1a;margin:0 0 6px\" id=\"s3\" data-toc>🚀 product-launch-video\u003C\u002Fh2>\u003Cp style=\"margin:0\">给个网址或简介，出一条产品\u002F营销发布视频。\u003C\u002Fp>\u003C\u002Fdiv>\n\u003Cdiv style=\"background:#fff;border:1px solid #F1F5F9;border-radius:14px;padding:14px;margin:0 0 10px;box-shadow:0 2px 10px rgba(0,0,0,0.03)\">\u003Ch2 style=\"font-size:15px;font-weight:700;color:#1a1a1a;margin:0 0 6px\" id=\"s4\" data-toc>🌐 website-to-video\u003C\u002Fh2>\u003Cp style=\"margin:0\">把一个网页直接变成介绍视频。\u003C\u002Fp>\u003C\u002Fdiv>\n\u003Cdiv style=\"background:#fff;border:1px solid #F1F5F9;border-radius:14px;padding:14px;margin:0 0 10px;box-shadow:0 2px 10px rgba(0,0,0,0.03)\">\u003Ch2 style=\"font-size:15px;font-weight:700;color:#1a1a1a;margin:0 0 6px\" id=\"s5\" data-toc>🗣️ faceless-explainer\u003C\u002Fh2>\u003Cp style=\"margin:0\">无脸口播解说：给个主题，自动配 AI 生成的画面讲清楚。\u003C\u002Fp>\u003C\u002Fdiv>\n\u003Cdiv style=\"background:#fff;border:1px solid #F1F5F9;border-radius:14px;padding:14px;margin:0 0 10px;box-shadow:0 2px 10px rgba(0,0,0,0.03)\">\u003Ch2 style=\"font-size:15px;font-weight:700;color:#1a1a1a;margin:0 0 6px\" id=\"s6\" data-toc>🎬 motion-graphics\u003C\u002Fh2>\u003Cp style=\"margin:0\">短小、设计感强的动效图形片。\u003C\u002Fp>\u003C\u002Fdiv>\n\u003Cdiv style=\"background:#fff;border:1px solid #F1F5F9;border-radius:14px;padding:14px;margin:0 0 10px;box-shadow:0 2px 10px rgba(0,0,0,0.03)\">\u003Ch2 style=\"font-size:15px;font-weight:700;color:#1a1a1a;margin:0 0 6px\" id=\"s7\" data-toc>💬 embedded-captions\u003C\u002Fh2>\u003Cp style=\"margin:0\">给现成视频加同步的特效字幕。\u003C\u002Fp>\u003C\u002Fdiv>\n\u003Cdiv style=\"background:#fff;border:1px solid #F1F5F9;border-radius:14px;padding:14px;margin:0 0 10px;box-shadow:0 2px 10px rgba(0,0,0,0.03)\">\u003Ch2 style=\"font-size:15px;font-weight:700;color:#1a1a1a;margin:0 0 6px\" id=\"s8\" data-toc>🎵 music-to-video · 📊 slideshow · 🧑‍💻 pr-to-video · 🎙️ 访谈加图卡\u003C\u002Fh2>\u003Cp style=\"margin:0\">卡点音乐视频、演示片、GitHub PR 变更视频、给播客\u002F访谈叠图形字幕……还有通用兜底 general-video。\u003C\u002Fp>\u003C\u002Fdiv>\n\n\u003Ch1 style=\"font-size:17px;font-weight:800;color:#111;margin:26px 0 14px;padding-left:10px;border-left:5px solid #FF8916;line-height:1.5\" id=\"s9\" data-toc>三、适合谁\u003C\u002Fh1>\n\u003Cdiv style=\"display:flex;margin:0 0 8px\">\u003Cspan style=\"color:#FF8916;margin-right:8px;flex-shrink:0;font-weight:700\">•\u003C\u002Fspan>\u003Cdiv style=\"flex:1\">要批量出营销片\u002F介绍片\u002F解说片，又不想学剪辑软件的创客、运营\u003C\u002Fdiv>\u003C\u002Fdiv>\n\u003Cdiv style=\"display:flex;margin:0 0 8px\">\u003Cspan style=\"color:#FF8916;margin-right:8px;flex-shrink:0;font-weight:700\">•\u003C\u002Fspan>\u003Cdiv style=\"flex:1\">懂点 HTML\u002FCSS、想要可复用视频模板、程序化出片的人\u003C\u002Fdiv>\u003C\u002Fdiv>\n\n\u003Cdiv style=\"background:#FFF7ED;border:1px solid #FFEDD5;border-radius:12px;padding:12px 14px;margin:18px 0 0;font-size:13px;line-height:1.7;color:#9A3412\">⚠️ \u003Cstrong style=\"font-weight:700;color:#1a1a1a\">一句实话\u003C\u002Fstrong>：它是「用代码\u002F网页做视频」的框架，不是数字人（真人形象口播看 HeyGen 数字人）、也不是文生视频大模型（那看 AI 视频生成）。本地要装 Node 22+、FFmpeg、Chrome。在 Claude Code 等 AI 助手里使用。\u003C\u002Fdiv>\n\n\u003C\u002Fdiv>\n",[20,23,26,30,33,36,39,42,45],{"id":21,"text":22,"level":15},"s1","一、这是什么",{"id":24,"text":25,"level":15},"s2","二、一次安装，8+ 种成片工作流",{"id":27,"text":28,"level":29},"s3","🚀 product-launch-video",2,{"id":31,"text":32,"level":29},"s4","🌐 website-to-video",{"id":34,"text":35,"level":29},"s5","🗣️ faceless-explainer",{"id":37,"text":38,"level":29},"s6","🎬 motion-graphics",{"id":40,"text":41,"level":29},"s7","💬 embedded-captions",{"id":43,"text":44,"level":29},"s8","🎵 music-to-video · 📊 slideshow · 🧑‍💻 pr-to-video · 🎙️ 访谈加图卡",{"id":46,"text":47,"level":15},"s9","三、适合谁",[49],{"id":5,"title":6,"coverUrl":7,"duration":8,"level":8,"publishDate":10,"views":11,"aiSoftapp":8,"tags":50,"contentType":15,"station":8,"seq":15,"relateId":8,"toolId":51,"readMinutes":16},[],"2077715107739074560",{"id":51,"createTime":53,"createdBy":54,"updateTime":53,"updatedBy":54,"echoMap":55,"slug":56,"name":57,"categorySlug":58,"subCategory":59,"region":8,"website":60,"appName":7,"description":61,"tags":62,"sortOrder":11,"state":15,"tenantCode":68,"tutorialContent":8,"resourceType":69,"accessTypes":7,"installCmd":70,"logo":71,"hotScore":72,"githubStars":73,"category":58},"2026-07-16 19:20:58","1744248479271616512",{},"heygen-hyperframes","HeyGen hyperframes","video","一键成片","https:\u002F\u002Fgithub.com\u002Fheygen-com\u002Fhyperframes","HeyGen 官方出品，GitHub 35.6k 星。一个开源框架用 HTML\u002FCSS 把内容渲染成 MP4 视频，纯本地跑（Node+FFmpeg+无头 Chrome，不用 HeyGen API）。一次安装覆盖 8+ 工作流：产品发布片、网页转视频、图文转视频、无脸解说、PR 转视频、卡点音乐视频、动效图形、给视频加特效字幕。想一站式做各类成品视频，首选它。",[63,64,65,66,67],"官方","HeyGen出品","HTML转视频","本地跑免API","8+工作流","0000","skill","npx skills add heygen-com\u002Fhyperframes","https:\u002F\u002Fgithub.com\u002Fheygen-com.png",92,35600]