_{🌐 中文 · English}

Identity Skill

「给它参考图，拿回一个 1:1 还原的个人网站。」 "Hand it the reference images. Get back a personal site that actually matches them."

先出参考图，再写代码。设计你先过目，实现照图还原。

用 Image 2 把每个分区的设计出成参考图，你确认并锁定后再做 1:1 还原。设计这一步交给最强的图片模型，补上 Codex 的短板；实现完成后，再用逐区截图、保真台账和确定性验证检查交付证据。

npx skills add Sac-Y/identity-skill

主要面向 Codex，装好后直接说话即可触发。

案例演示

以下网站都是用该 skill 生成：

1 · 马斯克

2 · links（国内知名旅游摄影博主）

3 · Sac（仓库作者）

让 agent 做网站，通常是它直接开始写代码——你看不到设计长什么样，只能等它做完，而它的审美又不稳定。

这个 skill 反过来：先用 Image 2 把每个分区的设计出成参考图给你确认，再照图高保真还原。你在写代码前就锁定了设计；交付前还必须留下逐区对照证据并通过验证，不能只凭 agent 自己宣称“已经完成”。

每一步都有明确产物，前四步之间有阻塞式确认关卡——你在关键决策点拍板，而不是等它做完一整个错的网站。

步骤	做什么	产物	确认关卡
1 · 内容与风格锁定	读你的简历/LinkedIn/项目链接，定站点形态和分区，推荐最多 3 个可视觉想象的风格方向	内容与站点形态文档 + 风格选项	✅ 确认内容和风格
2 · 参考图锁定	每个分区出一张横向参考图，锁定真实人物/产品的来源策略，完成视觉质量与可实施性审查；确认后保存不可覆盖版本和 SHA-256	分区参考图 + render contract + 哈希锁	✅ 接受参考图
3 · 素材拆分清单	逐张拆解参考图：哪些留代码、哪些出背景图、哪些出前景素材，并测量每个素材的几何（包围盒、长宽比、占宽 %）	参考图→构建映射 + 素材清单	✅ 确认拆分方案
4 · 素材生成评审	只生成已批准的素材，每张锚定参考图区域生成、生成后逐一对照检查	素材成品 + 复刻简报	✅ 接受素材
5 · 高保真复刻与 QA	交给 builder 契约做 1:1 实现，逐区对照参考图，检查桌面/超宽屏/移动端截图，完成 fresh-context 审查并运行确定性验证	网站 + 保真台账 + 完整证据	—

npx skills add Sac-Y/identity-skill

装好后，在 Codex 里直接描述你的需求即可触发：

「用 identity-skill 帮我做个求职用的个人网站，我有 LinkedIn」
「照着这几张参考图 1:1 还原成网页」
「帮我做个作品集站，风格大胆一点，给我几个方向选」

它会从第一步开始，在每个确认关卡停下来等你拍板。

第五步交付前，skill 会运行随包提供的验证器：

python3 /path/to/identity-skill/scripts/verify_identity_run.py /path/to/site-project

验证器会检查不可覆盖的参考图哈希、逐 section 的桌面/超宽屏/移动端截图、截图尺寸、保真状态、fresh review 和必要台账。退出码为 0 只表示证据完整；最终视觉质量仍需逐图审查。

还在持续迭代，接下来计划：

关注本仓库，持续更新中。

第二步参考图生成使用了 Taste Skill 的 imagegen-frontend-web（by Leonxlnx · MIT）。感谢！