#03 Codex 新手非常值得装的 10 个插件部署Codex 新手教程TOOL LIST · 实用清单2026.07 · 操作 · 开发 · 办公 · 视频4 个工作场景 · 10 个工具 · 1 套选择方法装得越多效率越高未必。Codex 真正拉开使用体验差距的往往不是提示词写得多复杂而是工具有没有选对、权限有没有管好、工作流有没有跑通。工具装得太多会带来更多权限、更多配置和更多排错成本。更实用的做法是先按照自己的工作场景选择一组工具跑通一个最小流程再逐步增加能力。作为一份面向新手的实用清单本文从四类高频场景中挑出 10 个值得优先了解的工具操作与连接、设计与开发、文档办公、视频制作。名词说明下文统一称它们为“插件”。严格来说其中既有插件、连接器也有 Codex 的内置能力和 Skills。不同账户、地区和客户端版本入口名称与可用范围可能不同请以当前界面和授权页为准。颜色标注说明蓝色核心能力这个工具能做什么橙色使用建议什么时候值得用、怎么用更稳绿色适用场景适合拿来解决什么问题先看结论按工作流选不要按数量装你的主要任务建议先看推荐理由操作网页、填写表单Chrome适合处理登录态网页和重复网页操作跨网页、文件夹和桌面软件Computer Use覆盖更完整的桌面流程找开源项目、维护代码GitHub把搜索、协作和版本记录接进工作流做网站或内部工具Build Web Apps Figma从视觉参考到前端实现更连贯写报告、方案、说明书Documents面向正式文档交付做汇报、课程或路演Presentations把资料整理、叙事和页面制作串起来清洗 Excel、生成报表Spreadsheets适合数据整理、公式和可视化做信息型动效HyperFrames擅长标题、图表和网页感动画批量生成完整视频Remotion用 React 组件化管理画面和时间轴最小起步组合如果你刚开始用 Codex可以先试Chrome GitHub。一个负责“让它动起来”一个负责“让它找到现成方案”不需要一上来安装全部工具。01操作与连接先让 Codex 真正动起来CONTROL · CONNECT · COLLABORATE这一组工具解决的是最基础、也最容易感知的问题让 Codex 能在真实浏览器、桌面应用和项目仓库里完成工作而不只是停留在聊天窗口里。TOOL 01Chrome核心能力在获得授权、且当前版本支持的前提下Chrome 连接器可以让 Codex 操作你正在使用的浏览器并在部分场景中复用当前浏览器会话。它适合打开页面、整理网页资料、填写重复表单以及在多个页面之间对比信息。使用建议涉及登录态网站时先确认当前打开的是哪个账号、哪个页面涉及提交、付款、删除和发布保留最后一步人工确认。纯网页任务通常优先从 Chrome 开始比跨桌面操作更直接。适用场景登录态网站、网页资料整理、重复网页操作、后台信息录入。TOOL 02Computer Use核心能力Computer Use 的覆盖范围不局限于网页还可以处理文件窗口、原生 App 和部分系统界面。当任务需要在浏览器、文件夹和桌面软件之间来回切换时它能把这些步骤放进同一条流程。使用建议先让 Codex 列出计划和将要操作的窗口再允许它执行。不要把“删除、覆盖、发送、发布”这类不可逆动作设置成无人确认的最后一步。适用场景跨应用操作、原生软件、文件整理、系统界面操作和完整桌面流程。TOOL 03GitHub核心能力GitHub 连接器可以把代码仓库带进 Codex读取项目结构、查看提交和改动、整理 Issue并在具备相应权限时参与分支、代码评审或 Pull Request 流程。它的价值不只是“让 AI 帮你写代码”而是把 Codex 放进项目协作链路。每次修改有记录出了问题更容易定位也更容易回退。使用建议第一次授权优先选择只读权限能指定单个仓库就不要开放全部仓库。让 Codex 修改代码时先看差异diff再决定是否合并。适用场景开源项目调研、代码仓库管理、版本协作、Issue 与项目维护。这一组怎么选只处理网页先选 Chrome需要跨网页、文件和桌面软件考虑 Computer Use只要涉及现有代码、开源项目或版本记录GitHub 几乎是最值得优先接入的基础工具。02设计与开发从“能运行”推进到“能交付”DESIGN · BUILD · DELIVER很多 AI 生成的页面“功能能跑”但视觉上容易有模板感。设计与开发工具的作用是把参考图、组件规范和代码实现放到同一条工作流里。TOOL 04Build Web Apps核心能力Build Web Apps 提供面向网页设计与开发的 Skills帮助 Codex 把视觉参考、页面结构和前端实现连接起来。它可以用于生成新页面也可以用于优化已有的 React、Next.js 等前端项目。使用建议不要只说“做得高级一点”。先提供参考图、品牌色、字体、页面结构和组件要求再让 Codex 通过 image-to-code 或明确的界面规格还原。这样比单纯依赖文字描述更稳定。适用场景落地页、工具站、内部管理界面、React / Next.js 项目和前端视觉优化。TOOL 05Figma核心能力在启用 Figma 集成的情况下Codex 可以围绕设计稿、组件信息、变量和页面结构完成设计理解、原型迭代与前端还原。使用建议Figma 最适合已经有设计稿或视觉规范的项目。把页面、组件和交互状态说清楚Codex 就不必凭空猜测界面交付前仍要人工核对字体、间距、响应式断点和交互细节。适用场景设计稿转代码、组件整理、原型迭代、设计师与前端协作。一个更稳的设计开发链路Figma 定义视觉与组件→Build Web Apps 负责实现与迭代→GitHub 记录改动并交付这条链路的重点不是“一键生成一个网站”而是让设计决策、代码实现和版本管理彼此对应后续修改才不会越改越乱。03文档与办公让 Codex 不只会写代码DOCUMENT · SLIDES · DATA如果你的工作核心是报告、汇报和数据Codex 同样可以成为一套办公生产力工具。关键是给它明确的输入、样例和交付格式而不是只说“帮我写得专业一点”。TOOL 06Documents核心能力Documents 面向正式文档交付。除了撰写内容还可以协助整理章节结构、统一样式、检查表达并生成更接近成品的长文档。使用建议先提供受众、用途、字数、参考范文和必须保留的事实生成后重点检查数据、引用、合同条款和敏感信息不要把格式漂亮等同于内容已经准确。适用场景项目方案、调研报告、产品说明书、会议纪要、合同草稿和规范格式的长文档。TOOL 07Presentations核心能力Presentations 可以协助梳理大纲、拆分页面、提炼每页重点并进一步完成版式、图表和视觉呈现。它真正好用的地方不是单纯“一键生成 PPT”而是把资料整理、故事线设计和页面制作放进同一条工作流。使用建议先告诉 Codex 汇报对象、时间限制和希望对方做出的决定再让它设计页面。交付前逐页核对数据来源、图表单位、页码和品牌规范。适用场景工作汇报、课程课件、路演、方案提案和内容型演示文稿。TOOL 08Spreadsheets核心能力Spreadsheets 可以帮助处理结构化数据包括清洗字段、补充公式、整理表格、生成图表和解释结果。面对结构复杂的表格时比在对话框里反复粘贴数据更容易核对最终文件。使用建议开始前先说明字段含义、计算口径和输出样例涉及工资、客户或财务数据时先脱敏并确认文件保存位置。生成公式后抽查边界值、空值和合计数。适用场景Excel / CSV 数据清洗、公式处理、报表分析、图表生成和结果解释。办公场景的共同原则让 Codex 负责整理和加速让人负责事实核验、权限判断和最终签发。正式成果尤其要保留人工复核。04视频制作从动效到完整视频MOTION · VIDEO · AUTOMATION视频工具可以分成两条路线一条偏网页感动效和信息动画另一条偏完整的视频工程和批量生成。选对路线比同时安装很多工具更重要。TOOL 09HyperFrames核心能力HyperFrames 适合用 HTML、CSS 和动画代码制作信息型视频与网页动效。标题动画、数据图表、产品界面展示和动态文字都可以通过可复用的组件完成。使用建议先固定字体、颜色、尺寸、转场和动画节奏再替换内容。把视觉规则写成模板后同类视频不必每次从头设计。适用场景AI 教程、产品介绍、数据动画、知识类视频包装和网页式动效。TOOL 10Remotion核心能力Remotion 的核心思路是用 React 代码制作视频把画面、字幕、动画和时间轴变成可以编程和复用的组件。使用建议先定义视频的时长、分镜、素材比例、字幕规则和输出规格再开始写组件。需要批量生成时把标题、图片、数据和配音等内容做成可替换参数。适用场景批量视频、模板化内容、程序化剪辑、数据视频和完整视频工程。HyperFrames 和 Remotion怎么选对比维度HyperFramesRemotion更偏向网页感动效、信息动画完整视频工程、批量生成常见内容标题、图表、界面展示分镜、字幕、素材、时间轴复用方式固定视觉模板替换内容React 组件和参数化数据适合的起点想快速做出有动感的片段想长期维护一套视频生产线选择建议如果目标是“做一个漂亮的信息动画”先看 HyperFrames如果目标是“持续批量生产结构稳定的视频”优先研究 Remotion。两者也可以组合先用 HyperFrames 做视觉片段再把成熟片段纳入 Remotion 的完整工程。结论真正值得留下的不一定是 10 个这 10 个工具不是“全部安装清单”而是一张按需求选择的地图。工作流入门组合适合的第一步网页和电脑任务Chrome Computer Use先完成一个可回退的重复操作开源项目和网站开发GitHub Build Web Apps Figma先调研现成项目再做一个页面 MVP文档和汇报Documents Presentations先用一份真实但已脱敏的资料测试数据和报表Spreadsheets Documents先定义字段、口径和输出样例内容和视频HyperFrames Remotion先做一条 30 秒模板视频推荐的安装顺序先装一个“操作工具”Chrome 或 Computer Use确认 Codex 能完成一个小动作。再接一个“协作工具”GitHub把项目、版本和修改记录管起来。按工作选择“交付工具”网站选 Build Web Apps / Figma办公选 Documents / Presentations / Spreadsheets视频选 HyperFrames / Remotion。最后再扩展只有当现有工作流确实遇到瓶颈再增加新的插件或 Skill。安装前的 4 个检查先确认工具来源、维护状态和当前版本是否匹配。能只读就不要一开始开放写入能授权单个项目就不要授权全部项目。涉及删除、付款、登录、发布和发送时保留人工确认。先用测试数据跑通确认结果和保存位置后再接入真实资料。最后一句话高手和新手的差距很多时候不在于谁装得更多而在于谁能把少数几个工具组合成稳定的工作流。先选对再用熟最后把有效的方法沉淀成自己的 Skill。蓝色看能力橙色看方法绿色看场景。这就是这份清单最简单的阅读方式。