UI Replica

Overview

这个 skill 用来把“看图写页面”约束成一条可校正的工程流程：先拆页面骨架和规格，再决定哪些内容应该原生实现、哪些应该矢量重建、哪些才值得裁切成素材，最后基于固定尺寸截图对比逐轮修正。目标不是做一个风格类似的页面，而是尽量精确复刻设计图，同时保持实现策略合理、可维护。

When To Use

在下面这些场景触发：

• 用户明确要求“精准还原”“像素级还原”“按设计图实现”。
• 输入里包含设计稿截图、登录页视觉稿、活动页参考图、APP 页面截屏。
• 任务重点是布局、尺寸、位置、颜色、圆角、阴影、透明度、层级、留白的精确还原。
• 任务重点是还原不规则边框、科技感描边、HUD 外框、异形卡片轮廓。
• 任务需要从截图中提取图标、按钮标识、品牌标识或小型 UI 素材，并转成可复用透明背景资源。
• 需要先输出结构化规格稿，再开始写代码。

下面这些情况不要优先用这个 skill：