ECC Frontend Slides：零依赖 HTML 演示文稿的快速上手指南

ECC Frontend Slides零依赖 HTML 演示文稿的快速上手指南【免费下载链接】ECCThe agent harness performance optimization system. Skills, instincts, memory, security, and research-first development for Claude Code, Codex, Opencode, Cursor and beyond.项目地址: https://gitcode.com/GitHub_Trending/ev/ECC你有没有过这种经历演示文稿发到外地同事手里对方回你一句打不开或者字全乱了ECC 项目的 Frontend Slides 技能就是把内容变成一个零依赖 HTML 演示文稿单文件任何浏览器都能打开不联网也行。它到底帮你省了什么省掉格式兼容的扯皮。最终产物是一个 HTML 文件样式和脚本全部内联在里面不用装任何东西、不依赖网络双击就能打开。投影大屏、Windows 电脑、手机上打开效果一致跨地区协作的团队最容易感知到这个好处。省掉设计上的纠结。技能内置了 12 种风格预设比如终端绿、霓虹赛博、瑞士现代。你不知道自己喜欢哪种时它不会让你对着风格菜单猜而是直接生成 3 张单页预览让你看到再选。旧 PPT 多一次活命的机会。给它一个 .pptx它会提取文字、图片和演讲者备注再重新渲染成网页版页序和备注都保留不是只搬正文。五分钟装好并跑起来Frontend Slides 是 ECC 项目里的一个技能模块先把仓库克隆下来git clone https://gitcode.com/GitHub_Trending/ev/ECC然后对 agent 说一句帮我做一份 10 页的 HTML 演示就够了它会自己读技能文档和预设参考再动手。如果你还想用 PPT 转换功能提前装一次 python-pptx 就行前置条件到这就齐了。从内容到成片实际操作路径先把内容丢给它要交代清楚的只有三件事这份演示是干什么用的演讲、推介还是内部汇报、大概多长5 到 10 页算短10 到 20 页是常规、你的素材是成稿还是只有草稿。有草稿直接贴进去就能开工只有主题也可以它帮你搭结构但效果以自己有素材最好。选你能看到的风格而不是要想象的风格说不出想要什么风格时它会先问你希望这份片子给人什么感觉被说服、被打动还是平静专注。然后生成 3 张单页预览每张都是自包含的字体、配色、动画效果直接看。你可以挑一张也可以混搭用 A 的配色B 的排版这种话它能听懂。要是心里已经有目标预设直接点名预览这步就跳过了。我试下来这一步最有趣三个预览摆在一起哪个对味一眼就能看出来。一个 HTML 文件就是成片生成完你拿到的是 presentation.html键盘方向键、鼠标滚轮、触摸滑动翻页都自带入场动画会随着翻页自动触发。唯一的多出来的是素材里有图片时它们会放在旁边的 assets/ 目录里。文件整体是纯文本放进版本库、以后改起来方便对比。如果你手上已经有 .pptx用仓库里自带的提取脚本先把内容抽出来再走同样的选风格 → 生成流程python3 skills/frontend-slides/scripts/extract-pptx.py deck.pptx三种最值得试的场景团队内部分享选瑞士现代、纸墨这类沉稳的预设信息密度可以放得高一些结尾附几个文档或仓库链接方便同事会后自己补。内部分享信息优先动画别花太多心思。产品技术推介Bold Signal 或 Electric Studio 适合需要镇住场子的时刻结构按问题、方案、优势三部曲走。数据页用一根会动的条形图加一个大数字比一整段文字更有冲击力。公开演讲或大会用终端绿、霓虹赛博这种偏技术的预设代码每页控制在 8 到 10 行——这是技能内置密度上限超了它会拆页拆两页其实比硬塞着读。上手前建议先知道的几件事 每页必须完整装进一屏不允许出现滚动。内容多了它拆页不会把字缩小到看不清。 演示前在手机上翻一遍。内置的视口适配会在小屏自动缩小字号和留白但真机过一遍最稳。 动画会跟随系统减弱动态效果的设置。对容易晕动的人这是刚需也是别人能感受到的体贴。⚠️ 一次别喂太多字。内置的密度限制比较严内容页基本就是一个标题加 4 到 6 条要点喂得越多它拆页越多。想玩得更深定制主题不用碰 HTML 结构颜色、字号、间距都定义成了 CSS 变量挑完预设后改一下 :root 里的变量就是自己的配色方案具体规则在样式预设参考里。它也能和仓库里其他模块配合想自动验证每一页在 5 种屏幕尺寸下是否溢出可以搭配 e2e-testing 技能做一次浏览器自动走查想要更有质感的视觉可以再叠加 liquid-glass-design 的风格。一句话总结想要一份任何浏览器都能开、不联网也能看、还好看的片子下次做演示前值得先试一次 Frontend Slides。完整工作流、密度限制和预设细节看核心技能文档即可。【免费下载链接】ECCThe agent harness performance optimization system. Skills, instincts, memory, security, and research-first development for Claude Code, Codex, Opencode, Cursor and beyond.项目地址: https://gitcode.com/GitHub_Trending/ev/ECC创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考