你可能已经在时间线上看到过一些三格拼图。下面介绍如何用 @bot 在 @figma 中创建它们。
https://x.com/kazarov_d/status/2094470313862136145
任何设计师都知道如何制作一个，只是有点麻烦。
https://x.com/studiobakers/status/2095077637639262295
所以我们应该问的是："如何利用 AI 让这个麻烦减少 90%，这样我就能专注于设计中酷炫、有创意的部分？"
Grok Bot 正好能做到这一点。
如果你不关心"怎么做"，只想要一个 @bot 模板，可以在这里找到：https://x.ai/bot/dYpPe1PCZv2WJDVTYDwhc
否则，下面是我如何构建我的模板：
构建照片拼贴
我对 Grok Bot 的通用方法是：分解你自己如何创建这个素材，然后提示 @Bot 做完全相同的事情。
在这个案例中，工作流程是在 Figma 中设计。
https://x.com/justinsunyt/status/2096635033603756354
这只是一个包含主视觉的画布，被组件化并分割成三个面板。我们可以通过查看 X 上现有的帖子来逆向工程出宽高比。
我让 Bot 完全按照这个来做——这是我优化后的第一个提示。
将 Cursor Gothic、[图片链接] 和 [插入文件] 替换为你的素材。
1逆向工程这个发帖格式——它是一个由三张图片组成的照片拼贴，在共享背景上拼接成一张宽屏截图。23https://x.com/kazarov_d/status/20944703138621361454https://x.com/studiobakers/status/209507763763926229556- 以全分辨率拉取每个面板，并获取宽高比。78- 裁剪三个导出面板（左 / 中 / 右）910- 在附加文件 [插入文件] 中创建一个新设计——保持在一个部分内1112- 在所有三个面板上设置新背景 [图片链接]——使用这个素材，而不是参考帖子的背景1314- 主视觉：在模拟的 4K 显示器（2× DPR）上截取 cursor.com 的截图。缩放页面，使 UI/文字在远处也能阅读。确认截图确实是着陆页（导航 + 标题）1516- 窗口上的居中投影 + 真实的圆角。网页顶部角落需要一个裁剪/遮罩层，否则看起来会是方的1718- Arc 风格的 Chrome：深色 Cursor 墨色外壳，彩色信号灯，居中 URL 使用 Cursor Gothic 字体。标题栏 + URL 文字应紧贴高度。页面周围 L/R/B 内边距相等1920- 在 Figma 中使用组件组织，这样一次粘贴就能更新每个面板——背景、主视觉（Arc）、主版，以及主版的三个导出裁剪2122当编辑背景或主视觉一次就能更新主版和所有三个导出时，你的工作就完成了。
发送提示后，每隔几分钟检查一下你的 bot——如果事情进展不顺利，问问原因。
也许 bot 没有正确使用自动布局。也许内边距不对。也许某个边框半径需要调整。
做出修改，记下为什么需要修改，然后将这些内容整合到你的下一个提示中。
看着我的 bot 运行
几个元要点：
- 我使用了精确的语言。注意我称它为"照片拼贴"，而不是"一个图片里的图片，三个东西在一个东西上"
- 我一开始不知道什么是照片拼贴，但我问了 Grok "三张图片拼成一张大图的拼贴叫什么"
- 每个提示都应该从初学者的心态开始——我如何学习做好这件事所需的一切？
- 我的第一次尝试并不完美。我是通过问 Grok Bot "告诉我你一开始需要什么才能第一次就做对" 才得到上面的提示的
- 始终要问，"我如何复制这个工作流程，或者确保 AI 下次能做所有事情？" 这是 @poteto 反复强调的一点。
- 我没有为此使用专门的 bot——只是一个连接到 Figma 的通用 bot。对于一次性任务，这没问题，但对于重复性任务，我可能会创建一个专门的 bot。
Grok Bot 不仅仅是关于有效使用 AI——它是关于如何有效使用计算机。
这意味着第一性原理思考、有效沟通以及有耐心。使用 Grok Bot 主要是关于解决问题。
完成的素材
此外，我现在有了一个可以重复使用的持久素材——就像我在这个帖子中做的那样：
为 iPad 发布帖子重新利用我的素材
如果不理解这种格式，我就无法及时制作出 iPad 发布的帖子。
创意人员的角色是唤起情感。
Grok Bot 让我能够专注于素材选择和图像，而它负责处理其他一切。
我收到的最常见问题是"我如何使用 Grok Bot"——这里有一个用于设计的方法。
