上篇文章发出后，有朋友问到：用 Lovart 生成的 UI 界面怎么进一步做分层切图？
这篇就来把分层切图的完整步骤演示一遍，顺便再做一套「每日任务」UI，看完就能跟着做。
一、分层切图：把一整张 UI 拆成可用素材
我们还是拿之前生成好的这张「每日签到」界面来举例：
为什么不直接让 AI 出几十张碎图？
理论上，Lovart 确实可以帮你自动拆分，一次性输出几十张小图。但存在两个问题：
- 出图速度极慢，等得人焦虑；
- 每张图都消耗积分，几十张下来积分哗哗掉，性价比太低。
所以我更推荐的做法是：让 AI 把所有元素铺到一张大图里，自己动手拆。
操作步骤
- 在
Lovart中点击已经生成好的「每日签到」图，它会自动被设为参考图。 - 在输入框里粘贴下面这段提示词：
把这张图的全部UI元素独立分层，背景、按钮、图标、文字图层互相分离，透明底色素材，边缘干净无白边，生成后支持单独抠取任意按钮和图标。
最后把所有元素导出到1张2048*2048px的PNG上，注意：文字不要导出。- 等
Lovart生成即可。这是它输出的效果：
可以看到，背景、按钮、icon、装饰元素已经整整齐齐排列在一张底图上了。下载这张 PNG，然后用 Photoshop、Figma、MasterGo 或者一些在线切图工具，框选对应区域导出，就是单独的素材了。
建议：拆图后按功能命名文件夹，比如
btn/放按钮、icon/放图标、bg/放背景，后续开发不容易乱。
二、实战：制作一套「每日任务」UI
再实战做一套新界面——每日任务弹窗。
需要准备什么？
两张参考图即可：
- 第 1 张：之前用过的游戏主界面（让 AI 知道整体风格）；
- 第 2 张：你自己拼的简易布局草图，或者随便画个线框图也行（告诉 AI 你想要什么内容布局）。没有草图的话，用文字描述清楚结构也可以。
提示词怎么写？
把下面的提示词复制到 Lovart，把两张参考图依次上传：
第1张参考图是游戏主界面，第2张参考图是游戏当前的每日任务界面。你根据参考图重新设计每日任务界面。
每项任务中包含元素：任务icon、要求数量、任务描述、完成进度、领取按钮。
注意：是弹窗，非全屏。
要求：竖屏手机游戏UI，9:16比例，750×1334分辨率，欧美Q版卡通风格，原创不照搬原图样式。
生成3种不同风格的界面给我选择。提示：最后加一句「生成3种不同风格给我选择」，一次出几版，挑最顺眼的再细化，比反复改提示词高效得多。
出图效果
Lovart 生成的效果如下：
三版风格一次性摆在面前，选一个最符合的，再丢回 Lovart 继续微调细节即可。
三、学习交流
最后，如果你喜欢这套游戏 UI 的配色和风格，可以在公众号后台私信联系，我免费发你。
- 微信公众号：楚游香
- 个人网站：https://www.chuyouxiang.com/
我的公众号和博客会不定期更新 AI 研发、游戏开发技巧和上线实战经验，欢迎常来逛逛，一起交流。
往期文章推荐
Lovart实战教程2：10分钟搞定游戏UI常用弹窗（签到/收集/设置）
Lovart实战教程1：零基础10分钟生成一套游戏UI主界面（附送全套美术资源）
Lovart：如何生成好看的休闲游戏UI
Lovart：一句话搞定游戏UI的AI神器