2026年11月9日现在就能使用 Figma agent 的 6 种简单方法Emma Webster，Figma 内容策略师World Peas website design in Figma beside an agent conversation showing a request to replace the main image with a close-up mushroom photograph.

从让设计更具表现力、自动化繁琐工作，到在画布上探索更多可能性，这里有六种方式借助 Figma agent 推动设计师更进一步。

分享：现在就能使用 Figma agent 的 6 种简单方法

    这个 Figma agent

    Figma 设计 agent 来了

    从今天开始，你可以直接与专为 Figma 打造的 agent 在画布上协作。

    它会在画布上与你并肩工作，帮助你推进想法，同时让你始终掌控设计。你可以在任何阶段把 agent 引入工作，从与团队初步探讨方向，到交付前打磨细节。但在实践中这究竟是什么样子？这里，我们分享六种在日常工作流中使用 agent 的方式，从减少整理反馈等繁琐工作，到通过自定义图像效果和动画让设计更具表现力。

    1. 使用转录文本为设计添加标注

    当会议或设计评审中反馈纷至沓来，很难对其进行归纳、判断哪些值得付诸行动，并保留相关上下文。使用连接器，你可以把来自 Granola、Notion 或 Google Drive 等工具的会议记录或转录文本导入 Figma agent，并提示它在相关设计旁添加反馈。这意味着你可以在会议期间专注于对话，因为你知道自己已经拥有把讨论转化为后续步骤所需的一切。

    试一试： 点击 agent 聊天框中的 +，打开连接器，并连接存放会议记录或转录文本的应用。然后分享链接并提示 agent： Annotate this design based on the crit feedback in this transcript.

    Four mobile designs selected on the Figma canvas beside a prompt asking the agent to annotate them using linked meeting feedback.
    让 agent 使用关联的转录文本为你的设计添加标注。
    Feedback annotations arranged beside mobile designs, with the agent’s summary of the transcript review in the chat panel.
    Agent 会在相关设计旁添加反馈标注。

    2. 将设计评论转化为后续步骤

    使用技能

    是一项可复用的指令集，你可以在 Figma agent 中通过斜杠（/）命令触发它。要使用 Figma Community 中的技能，请打开该技能的页面并点击保存，然后在 agent 的提示框中输入以选择它。你也可以创建自己的技能，以记录你想要重复使用或与团队分享的工作流程。当 Figma 文件中的评论堆积如山时，Figma agent 可以帮助你总结反馈并建议更新，把零散的评论转化为后续步骤。查看建议后，你 是一组可复用的指令，你可以通过斜杠（/）命令来触发。要使用 Figma Community 中的技能，请打开该技能的页面并点击保存，然后在 agent 的提示框中输入以选择它。 Figma Community，打开该技能的页面并点击保存，然后输入 / 在 agent 的提示框中输入以选择它。你也可以 创建你自己的技能，以记录你想要重复使用或与团队分享的工作流程。当 Figma 文件中的评论堆积如山时，Figma agent 可以帮助你总结反馈并建议更新，把零散的评论转化为后续步骤。查看建议后，你还可以让 agent 将你同意的更改直接应用到你的设计中。试一试： 选择带有评论的画框，然后提示 agent： 要整理反馈，可以尝试使用技能——一组可供 agent 复用的指令。使用 /comments-do-try-consider 技能，把评论整理成待办、尝试和考虑三类。 以记录你想要重复使用或与团队分享的工作流程。

    当评论在你的 Figma 文件中堆积起来时，Figma agent 可以帮助你总结反馈并建议更新，把零散的评论转化为后续步骤。查看建议后，你还可以让 agent 将你同意的更改直接应用到你的设计中。

    试一试： 选择带有评论的画框，然后提示 agent： Summarize the feedback on these designs and suggest updates.

    要整理反馈，可以尝试使用技能——一组可供 agent 复用的指令。使用 /comments-do-try-consider 技能 把反馈整理成待办、尝试和考虑三类。添加该技能，然后提示 agent： Use /comments-do-try-consider to sort the comments on this design and add the summary to a new frame next to it.

    Two weekly insights screens with collaborator comments and a prompt asking the agent to summarize feedback and provide next steps.
    选择带有评论的画框，然后提示 agent：
    Agent response over weekly insights designs recommending a starting direction, consolidated sections, and changes to the content order.
    让 agent 总结后续步骤。

    3. 创建自定义着色器

    与 Figma agent 合作构建自定义着色器，为你的设计赋予独特外观。着色器——由代码支持的效果或填充——可以为设计带来独特风格，例如液态金属、颗粒、玻璃扭曲或全息纹理。假设你想创建一个自定义着色器，为照片添加颗粒感的复古外观。你可以直接向 agent 描述该效果，并通过提示词不断优化。如果你是着色器新手， /shader-starter 技能可以帮助你入门。然后你可以提示 agent 将该效果应用到其他照片，包括来自已连接的 Google Drive 文件夹中的图片。

    试一试： 在你的设计中选择一张照片，然后提示 agent： Create a custom shader that gives this photo a grainy, vintage look.

    要把这种效果应用到更多图片上，请通过连接 Google Drive + → Connectors 并提示 agent： Find the photos in this folder and apply the same shader: [folder link].

    将你想要创建的自定义着色器直接描述给 agent。Golden Gate Bridge photo selected in Figma beside a prompt requesting a custom shader with a grainy, vintage look.将你想要创建的自定义着色器直接描述给 agent。Golden Gate Bridge photo with muted colors and darkened edges beside the agent’s generated Vintage film finish shader.这个自定义着色器为照片添加了颗粒感、褪色的色彩和柔和的暗角。Bridge, lighthouse, flower, rocky shoreline, and beach photos on the canvas, with an agent message confirming a matching shader treatment.让 agent 将同一着色器应用到多张照片上，以获得一致的视觉效果。Vintage film finish shader selected under Created by you in Tools, with an Apply button beside a selected coastal flower photo.在“工具”中找到你的自定义着色器，并将其应用到另一张图片。

    4. 一次生成多个方向

    需要帮忙把你的应用或网站放到画布上吗？只需一键即可将最新版本导入 Figma，使用 Figma Chrome 扩展，然后与 agent 一起推敲布局或内容。

    要找到最佳方案需要不断探索，但过去在画布上构建多个方向意味着要投入大量前期时间。现在，Figma agent 可以通过一次提示为某个屏幕或功能创建多个变体，这样你就可以权衡各个细节，或在画布上比较几个不同的方向。例如，假设你正在设计一个每周洞察屏幕，想尝试不同的布局，比如改变主图的尺寸以及标题的位置。你可以让 agent 在一次提示中创建这些变体，然后并排比较，看看哪种图文平衡效果最好。选择你团队的设计库后，agent 就可以使用你现有的组件、样式和变量。

    试一试： 打开 agent 提示菜单中的 Open Libraries，选择你团队的库，然后选择你的设计并向 agent 输入提示： Create three layout variations of this weekly insights screen. Try different sizes for the main image and different placements for the heading and introductory text. Keep the existing content, colors, and visual style.

    5. 将静态设计转化为代码层

    Figma agent 可以帮助你处理那些仅凭静态屏幕难以判断的交互决策。假设你在轮播中设计了一叠卡片，用户可以滑动浏览。在继续之前，你想看看滑动浏览它们的感觉如何。agent 可以将你的设计重建为代码层，即画布上由代码支持的交互式原型，这样你就可以把一张卡片拖到一边以露出下一项，并优化过渡效果。

    试一试： 选择你的设计框架，然后选择 Build this with code，然后向 agent 输入提示： Make this card stack interactive so users can swipe or drag the top card aside to reveal the next item. Keep the stacked layout and animate the transition between cards.

    让 agent 把静态卡片堆叠转化为可交互的代码层。
    滑动浏览产品卡片，以测试画布上的交互效果。

    6. 添加并试验动效

    Figma agent 可以为静态设计添加动效，无论你已经明确想要什么样的运动效果，还是需要几个选项来比较。例如，如果你用一只手形图标来演示应该触摸屏幕的哪个位置，可以比较一个手缓慢点击的选项和另一个手俏皮旋转的选项。agent 可以在一次提示中创建这两种变体，这样你就可以回放它们，决定哪一种更符合你的设计，而无需手动构建每个动画。

    试一试： 选择你的设计框架，然后向 agent 输入提示： Create two animation variations for this design: one where the hand spins before clicking and another where it slowly presses down. 然后将工具栏的切换开关切换到 Motion，选择每一帧，然后按播放进行比较。

    Figma agent 已在 Starter、Professional、Organization 和 Enterprise 计划以及高等教育计划中提供。Collab、Dev 和 View 席位可以在其草稿中使用该 agent。

    在我们的帮助中心进一步了解 Figma agent。 帮助中心.

    Emma Webster 是 Figma Story Studio 团队的撰稿人和编辑。此前，她曾在 Faire 和 Audley Travel 担任撰稿人。

    免费开始使用

    免费开始使用