PART 01START
起步与入口
- 03Codex 下载与安装
- 04两种不同的使用方式
- 05购买国内 API 节点
Pages 03-05
起步与入口
03 / 36
Download Setup
Codex 桌面应用程序 下载与安装
入口、系统下载、安装和账号登录压成四个轻标签，页面重点交给固定截图，像参考网页的产品入口区。
01
打开入口
chatgpt.com/codex/cloud02
选择系统
页面中央下载按钮03
安装 App
桌面端开始使用04
账号登录
ChatGPT / OpenAI 账号本页固定图片：原 PPT 第 2 页截图，完整保留并放大成主视觉。
起步与入口
04 / 36
Two Ways To Start
两种不同的 使用方式
01 Plus
没有 Visa 卡时，可以通过 Google 支付或手机端方案处理，适合作为最稳的主路径。
02 国内 API
作为另一条路，后续会接到 API 节点配置页。复杂度更高，部分能力可能受限。
正规 Plus 充值
https://pay.ldxp.cn/shop/binai优先推荐
Google / 手机支付
补充路径
起步与入口
05 / 36
API Access
购买国内 API 节点
基础配置
07 / 36
Interface Tour
基础设置 界面认知
功能栏、项目栏、对话记录这些核心区域，用四张固定截图做成入口导航区。
A
主界面
B
新对话
C
项目栏
D
记录入口
基础配置
08 / 36
Proxy Setup
安装后第一步 设置
原 PPT 的重点不是截图本身，而是 `.env` 里的四行代理变量。页面用命令说明加固定图片来承载。
.codex /.env
HTTP_PROXY=http://127.0.0.1:7890 HTTPS_PROXY=http://127.0.0.1:7890 ALL_PROXY=http://127.0.0.1:7890 NO_PROXY=localhost,127.0.0.1
默认端口是 `7890`，如果你改过代理端口，只替换数字部分即可。
保存后重新进入项目或重开对话，代理通常就会正常生效。
基础配置
09 / 36
Port Variant
不同端口也能 同样处理
port from dialogue
$env:all_proxy=http://127.0.0.1:17891 HTTP_PROXY=http://127.0.0.1:17891 HTTPS_PROXY=http://127.0.0.1:17891 ALL_PROXY=http://127.0.0.1:17891 NO_PROXY=localhost,127.0.0.1
端口号直接从你当前代理里抄出来，不需要手动猜。
只要把对话里出现的端口替换进这四行 `.env` 配置，其他写法保持不变，就能按同样方式处理。
基础配置
10 / 36
Project Threads
尽量在项目下 对话
长时间在同一个对话框里持续对话，容易出现思考很久的体感。更稳的做法是按项目开新线程。
Long Thread
项目式工作流
把文件夹拖进项目栏，再围绕这个项目开对话，能明显降低上下文混乱感。
Project Sidebar
权限与设置
12 / 36
Quota View
基础功能 套餐用量
这一页只有一张固定图，所以直接做成中心主图页，旁边只保留最必要的额度解释。
5 小时内额度用完，就需要等下一轮刷新。 一周的额度通常按周维度重置。
权限与设置
13 / 36
Settings Entry
从左下角进入 设置界面
一张是入口菜单，一张是设置页本体，用“入口到页面”的顺序排开。
设置入口
设置页面
权限与设置
14 / 36
Full Access
常规权限 全部打开
这一页强调“完全访问权限”这件事本身，所以左右各保留一张固定图，中间不再塞复杂文案。
权限与设置
15 / 36
Feature Toggles
基础设置 打开
单图信息页，保持大图占比，让听众一眼知道要打开的是哪一块。
权限与设置
16 / 36
Control Layer
电脑控制与浏览器控制 全部打开
这一页固定图更适合做双卡对照，直接把浏览器控制和电脑控制分成两个大块。
浏览器控制
电脑控制
插件与远程
18 / 36
Plugin Hub
插件和自动化 功能入口
主要插件就这几个，也可以自己创建技能或从网上安装。固定图用“入口页 + 插件卡片页”的组合来承接。
Plugin Hub
主要插件
浏览器、电脑控制、设计类技能和自动化功能，都是后续高阶工作流的关键入口。
Installed Skills
插件与远程
19 / 36
Plugin Strategy
插件、技能与自动化 怎么选
这一页不重复解释入口，而是用同一组固定图切换到使用策略：先装常用，再按任务加能力。
插件与远程
20 / 36
RedSkill Store
安装小红书 技能商店
这一页保留“先检查是否安装商店”的提示，把桌面文件夹图和安装引导图组合成轻流程。
技能目录
安装商店
先检查，再安装
按提示检查 Red Skill 商店是否已存在，再根据安装文档继续处理，不需要盲装。
https://redskill.xiaohongshu.net/install.md插件与远程
21 / 36
Plugin Shortcuts
@、$ 与快捷方式 调出插件
这一页有 3 张固定图，最适合做参考网站里的产品卡矩阵：一张讲入口，两张讲调用方式。
@ plugin
$ skill
shortcut
插件与远程
22 / 36
Remote Control
电脑控制 通过手机远程操作
一张桌面端，一张手机端，让这个功能更像参考网站里的配套入口展示页。
桌面端入口
手机端联动
实际操作
24 / 36
Practice Setup
本次演示会用到的 技能和插件
先把技能库和控制插件准备好，后面演示就不是单纯聊天，而是让 Codex 直接接管真实素材、浏览器和本地文件。
当前个人 skills 目录里存在的技能
重点会用到生图、主图、详情页、技能商店和字体设计这些能力。绿色标记的是这次演示更可能直接调用的部分。
| 技能目录名 | 用途描述 |
|---|---|
| api-image-generation | 通过 OpenAI-compatible 中转 API 生成图片 |
| doubao-api | 调用火山方舟 / 豆包 Seedream API 生成并保存本地图片 |
| ecommerce-main-image-prompts | 写、改、诊断电商主图和参考图提示词 |
| find-redskills | 小红书 RedSkill 商店搜索技能和安装入口 |
| generate-detail-page | 生成 10 屏电商详情页 AI 图片提示词 |
| gpt-image-2-style-library | GPT-Image2 风格库与工业提示词模板 |
| gpt-main-image-generation | 电商主图完整工作流：需求分析、提示词、生成和迭代 |
| sxtex | 中文手写标题字体设计生成 |
| web-design-engineer | 高质量 HTML / CSS / React 视觉网页文件 |
使用到插件
\\渲染a组金宏文\渲染A组金宏文\金宏文\codex插件
电脑操控要提前打开
实际操作
25 / 36
Computer Control
电脑控制 打开 C4D
这一页演示的是让 Codex 直接控制桌面应用：从一句需求开始，调出电脑控制工具，打开 C4D 并继续推进真实软件里的任务。
一句话说明目标
先告诉 Codex 要打开桌面的 C4D，并做一个简单的三阶魔方动画。关键是把目标讲清楚，而不是自己一步步点。
让它进入真实桌面
电脑控制打开后，Codex 可以识别桌面、应用窗口和按钮，再继续执行打开软件、运行脚本、检查结果这些动作。
实际操作
26 / 36
Main Image Skill
使用生成主图技能 全自动流程
把需求文档和产品图交给技能后，Codex 会完成提示词、生成、保存和结果检查。我们只需要下好需求，再看最终产物是否符合目标。
下好需求即可自动执行
示例里直接调用生成主图技能，根据表格和文件夹里的产品图生成主图，并把最终文件保存到本地目录。
输出可检查的最终图
生成完成后会给出预览和文件路径。主图、提示词和无文字版本都可以继续作为下一轮修改的基础。
实际操作
27 / 36
Result Check
插件实测三张主图 16 分钟
这一页展示真实跑完后的结果：技能通过浏览器工作流生成 3 张主图，并保存提示词、图片链接和本地文件。
Main Image Result
16min插件实测三张主图约 16 分钟完成，消耗约 5 小时额度的 15% token。适合把重复的主图产出流程交给 Codex 执行。
生成数量3 张主图输出文件PNG + prompts.md验证尺寸1254 x 1254
实际操作
28 / 36
丹橘 856 喷雾夹板轮播图 · Carousel Brief
先把需求和素材 放进同一文件夹
以丹橘 856 喷雾夹板轮播图为例，先准备产品图和需求表。材料越完整，技能越容易理解产品卖点、参考方向和重点画面。
Ready to Run
建个新文件夹
放入产品图和需求表。把两类材料放在同一个项目目录，让 Codex 同时读取视觉素材和需求文案，再围绕真实任务开始执行。
01
产品图：保留不同角度、细节与可用素材。
02需求表：写明文案、效果参考图、重点呈现和参考链接。
实际操作
29 / 36
丹橘 856 喷雾夹板轮播图 · Dual Model Output
豆包与 Gemini 两条出图路线
同一份需求可以交给不同模型执行，再从风格、构图和卖点表达中选出更合适的方向。Codex 负责串联流程和管理结果。
豆包出图
适合快速铺开电商轮播图方向，一次获得多张可比较的方案。
批量生成中文电商语境
Gemini 出图
作为另一条视觉路线，与豆包结果交叉比较，扩大构图和表达选择。
5 小时额度消耗 8%共生成 12 张图
实际操作
30 / 36
丹橘 856 喷雾夹板轮播图 · Feedback Loop
每次生成后 把问题反馈给 Codex
不要只拿走图片就结束。把不满意的地方、品牌偏好和修改结果继续告诉 Codex，它会不断总结规则，下一轮越来越贴近你的判断。
Continuous Learning
不断总结学习，会越来越懂你
01
每一次生图完成之后，把具体问题反馈给 Codex。
02让 Codex 总结可复用的品牌与构图规则。
03把有效规则沉淀到技能或项目说明中。
实际操作
31 / 36
丹橘 856 喷雾夹板轮播图 · Skill Expansion
同样的方式还能 批量做详情页
主图流程跑通后，可以继续发散：提供需求文档和产品图，让技能批量生成详情页场景图、卖点图和不同用途的视觉素材。
使用技能 · GPT 生成主图 · 思维发散
需求文档 + 产品图
可以使用同样的方式批量生成详情页场景图。输入方式不用改变，只需把目标从“生成主图”调整为“生成详情页场景图”。
A
主图、轮播图和详情页共用产品资料。
B按页面用途调整提示词、尺寸和构图。
实际操作
32 / 36
使用 Codex 制作个人网页 · Website References
制作个人网页前 先找到视觉方向
可以从 Refero、Motion Sites 等设计网站寻找参考。先确定页面结构和视觉氛围，再让 Codex 实现，比直接说“做个好看的网页”更稳定。
从成熟案例学习版式
观察信息层级、留白、字体和按钮位置，把喜欢的特征整理成明确需求。
从动态模板寻找氛围
https://motionsites.ai/收费网站，每天有免费次数；原 PPT 提示次数用完也可以从其他渠道寻找服务。
实际操作
33 / 36
使用 Codex 制作个人网页 · Template to Code
复制喜欢的模板 先让 Gemini 写代码
从参考网站选中一个模板，把截图和目标描述交给 Gemini 生成基础代码，再将代码交给 Codex 放入真实项目继续修改。
实际操作
34 / 36
使用 Codex 制作个人网页 · Code Handoff
把初版代码交给 Codex 真正落地
模型给出的代码只是起点。让 Codex 在本地创建文件、补齐资源、运行页面并检查效果，才能从一段代码变成可继续维护的网站。
Local Workflow · https://motionsites.ai/
从代码块到可打开的网站
01
https://motionsites.ai/这里随机找一个模板复制，先给 Gemini 写出代码。
02把代码给到 Codex，建立 HTML、CSS 和 JavaScript 文件。
03启动本地服务器检查效果，再围绕现有代码继续修改。
实际操作
35 / 36
使用 Codex 制作个人网页 · Visual Refinement
截图加注释 完成局部修改
修改网页时可以直接截图，在画面上标注需要调整的位置，再把图片和要求发给 Codex。建议先准备页面草稿与内容大纲，沟通会更高效。
怎么修改 · Three Ways to Edit
让修改需求更具体
打开本地页面，边看效果边描述问题。
也可以截图，通过对话框发送需求并圈出修改区域。
先确定内容顺序，再处理样式和动效。