做产品时，参考图往往不缺。浏览器里存着喜欢的首页，聊天记录里躺着一张旧版本截图，文件夹里还有几张已经找不到源文件的方案。
真正卡住的，是下一步：把其中一句标题换成自己的业务，把按钮移到合适的位置，再补上这次要展示的内容。
截图保留下来的是画面。文字、图片和背景在里面叠成了一张图，直接导入设计工具，通常还不能像编辑原稿那样分别修改。UISeek 寻界提供的截图分层能力，正是从这里接上：识别页面内容，重建文字和图层，为后续调整准备一份可操作的文档。
怎样判断这条路径适不适合自己？可以先完成一次小修改，再决定要不要继续做整页。
先写下要改什么，再挑参考图
假设你要做一个课程介绍页，看中了一张卡片式首页。可以先把本轮要完成的事写下来：标题换成课程名称，主按钮改成“查看课程安排”，卡片里的图片换成自己的素材。
这是一个示例需求。它的作用，是给后面的转换结果一个明确的验收标准：这些内容能否独立选中，改完是否还排得下，页面是否更容易让读者看懂。
如果真正要改的是整套业务流程，或要把所有图标重新绘制成统一风格，就需要预留更多整理工作。分层能提供起点，但原页面的信息顺序是否适合新业务，仍然要重新判断。
选图时也尽量用清晰、完整的页面。文字已经模糊、内容被裁掉的截图，会减少可供识别的信息。与此同时，确认参考素材的使用范围；能够转换，不代表可以直接沿用别人的品牌和内容。
第一处修改，从一句真实文案开始
完成截图识别后，先找到你最需要替换的文字。
下面是项目保留的“针藏”首页设计样例。图中的“立即收藏”被单独选中，右侧可以查看文字内容和字体属性。它展示了一个明确的编辑起点：这处内容已作为文字对象存在。
拿到自己的结果，可以依次检查：是否能选中目标文字，内容有没有错字，一句话是否被拆成了多个对象。再把它换成实际要使用的文案，观察画布是否按预期变化。
这里容易忽略的是文字长度。“立即收藏”和“查看下周课程安排”占据的空间不同。新文案输入成功以后，还要检查按钮宽度、字号、行距，以及它与相邻元素之间的距离。
这也是为什么不建议等整页排完，再换掉占位文案。真实标题、服务名称和价格说明，越早进入设计，越容易发现布局哪里不合适。
再整理布局，让内容按新业务排列
文字改对之后，再看卡片和图片如何组织。
如果准备把一张推荐卡往下挪，先确认卡片里的标题、图片和按钮是否属于同一组；只想移动图片时，则检查会不会顺带选中其他内容。自动重建的分组可以作为起点，后续仍可能需要重新组合。
移动元素后，记得检查它原来的位置。截图没有记录被前景挡住的完整背景，重建时只能依据已有画面处理。遇到纹理衔接不自然、边缘残留或空白区域，需要再修补或更换背景。
看整体时用接近实际阅读大小的视图，检查细节时再放大。前者能看出信息是否清楚，后者能看到字形、边缘和对齐问题，两种观察都用得上。
想改图标轮廓，走单独的处理流程
页面分成了图层，图标也能选中，并不意味着它已经成为可编辑的矢量路径。位图可以调整位置和大小；要修改轮廓、局部线条，就需要对应的矢量对象。
UISeek 插件为此提供了单独的图标矢量化流程：在画布中选择图标，先查看原图预览；点击矢量化后，取得 SVG 结果；拖动滑杆比较两种效果，再决定是否替换原对象。
当前插件代码将这一入口限定为单个图标，宽高均不超过 100 像素，导出的 PNG 不超过 100 KB。这是图标处理入口的限制，与整页截图识别是两回事。
比较时可以重点看外轮廓、细线、留白和透明边缘。输出格式是 SVG，只能说明结果采用了矢量表达，视觉效果是否适合页面，仍要具体检查。复杂插画也不宜直接按小图标的处理预期来判断。
在当前插件会话中，替换后还提供还原操作。准备切换任务或关闭插件前，先确定要保留哪一个版本，并保存好设计文档；不要把会话里的还原状态当作长期版本备份。
交付时，把可继续编辑的部分一起留下
完成修改后，展示图片和可编辑文档各有用途。前者方便沟通，后者决定下一次能不能接着改。
UISeek 的编辑器提供 PXUI 文档导出入口。保存后，建议在支持该格式的编辑环境中重新打开一次，检查文字内容、位置和图片是否符合预期。原截图也可以保留，方便说明哪些地方沿用了参考，哪些地方已经重新设计。
如果还要交给开发，补上按钮去向、内容来源和必要的页面状态。例如“查看课程安排”打开哪个页面，没有可预约课程时显示什么，长标题会怎样换行。这些规则无法仅凭静态截图确定。
从参考图出发做设计，最有价值的一步，往往是把一次明确的修改真正做完：选中目标、替换内容、检查排版、保存并重开。走通这一小段，再决定继续复用哪些部分，重做哪些部分，后面的工作会更清楚。
文中功能说明依据 UISeek 项目代码核对，日期为 2026 年 10 月 22 日；编辑器配图展示的是 10 月 7 日的既有设计样例。产品入口：UISeek 寻界。