Figma AI新手入门:理解Agent与Make的区别【教程】

云静同学_6649

云静同学_6649

2026-06-19

527人浏览

原创

figma make是“造物者”,专从零生成完整可交互原型;ai agent是“编辑员”,仅在已有文件中批量优化设计。二者定位不同,不可混用。

☞☞☞AI 智能聊天, 问答助手, AI 智能搜索, 多模态理解力帮你轻松跨越从0到1的创作门槛☜☜☜

figma ai新手入门:理解agent与make的区别【教程】

你想用Figma的AI功能快速把产品想法变成可演示的原型,但打开界面发现“Make”和“AI Agent”两个入口,点进去风格完全不同——一个从空白开始画,一个在已有设计稿上改,根本不是一回事。

先搞清核心定位:它们根本不是同类工具

Make 是“造物者”,专干从零到一的事:你一句话,它生成完整页面、导航、交互逻辑,甚至带基础代码;AI Agent 是“编辑员”,只在你已有的 Figma 文件里干活,比如批量换字体、统一按钮状态、根据评论自动调整组件。

如果你刚画完线框图想立刻加动效,选 AI Agent;如果你只有“做个健身打卡App首页”这个念头,还没动过一个矩形,就该用 Make。

【千万别把 AI Agent 当作 Make 的升级版来用——它不接受空白提示,也不会凭空生成新页面】

用 Make 生成第一个可交互原型

第一步:登录 Figma → 点击左上角“+ New file” → 选择“Make”模板(不是“Design”或“Prototype”)。

第二步:在中央输入框里写一句完整需求,例如:“设计一个极简风格的待办事项网页,顶部有标题‘今日任务’,中间是带复选框的列表,底部有‘添加新任务’按钮和统计数字。”

第三步:按下回车。等待约3秒,左侧出现高保真界面,右侧同步生成 HTML/CSS 代码块。此时点击任意复选框,会真实触发勾选/取消动作——这是 Make 自动生成的交互逻辑,不是静态图。

第四步:不满意?直接在原输入框追加修改,比如输入:“把按钮改成圆角、主色换成深青色”,再按回车,AI 会保留原有结构只改指定部分。

Sina Market (GSAgent)
Sina Market (GSAgent)

从新浪财经公开网页获取多市场行情数据并进行检查,适用于获取A股报价、香港股票等。

下载

用 AI Agent 批量优化已有设计稿

方法一:在已打开的 Figma Design 文件中,右键任意页面标签 → 选择“Ask Figma AI” → 输入指令,如:“把所有标题文字改为 Inter Bold 24px”。

方法二:选中一组按钮组件 → 点击顶部工具栏的 AI 图标 → 输入:“将这组按钮切换至悬停状态,并添加微动效” → 确认执行。

注意:AI Agent 会严格读取你当前文件里的设计系统(如已定义的颜色变量、文本样式),所以它改出来的效果必然符合团队规范;但如果你没提前建好样式,它可能无法识别“主按钮”该用哪个颜色——【必须先建立基础设计系统,AI Agent 才能准确理解你的意图】。

遇到问题怎么选对入口

你手上有草图照片?→ 用 Make:上传截图 + 描述“请把这个手绘稿转成可点击的网页原型”。

你收到17条同事评论说“卡片间距太密”?→ 用 AI Agent:全选卡片容器 → 输入“统一增大内边距至24px”。

你要给投资人演示三套不同风格的首页?→ 用 Make 的“Plan Mode”:输入“生成三种方案:科技蓝、自然绿、暖橙色”,AI 先列出执行步骤再并行生成。

你正调试一个交互流程,发现跳转逻辑错乱?→ 用 AI Agent:选中整个流程图 → 输入“检查所有连接线,修复断开的页面跳转”。

相关文章

PHP速学视频免费教程(入门到精通)
PHP速学视频免费教程(入门到精通)

PHP怎么学习?PHP怎么入门?PHP在哪学?PHP怎么学才快?不用担心,这里为大家提供了PHP速学教程(入门到精通),有需要的小伙伴保存下载就能学习啦!

下载

相关标签:

figma ai figma agent

本站声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

相关专题

更多
Gradle插件开发入门教程
Gradle插件开发入门教程

本专题介绍Gradle插件开发的基本流程,涵盖插件类编写、自定义任务注册、扩展参数设计和插件应用方法,帮助你理解插件如何组织构建逻辑,减少多个项目之间的重复配置。

2026.10.22

0

11

Gradle Wrapper配置教程
Gradle Wrapper配置教程

本专题介绍Gradle Wrapper的基本作用,涵盖文件组成、生成方法、版本配置和任务调用,帮助你理解项目如何使用指定的Gradle版本,减少不同开发环境带来的构建差异。

2026.10.22

0

10

Golangci-lint检查器使用教程
Golangci-lint检查器使用教程

本专题整理Golangci-lint常用Linters的用途与配置方法,覆盖错误处理、无效代码、安全、复杂度、命名和依赖检查,帮助项目合理选规则。

2026.10.22

0

15

Gradle怎么构建Java项目
Gradle怎么构建Java项目

本专题介绍Gradle Java项目构建方法,涵盖Java插件配置、依赖声明、源码编译、测试执行和打包检查,帮助你理解各阶段的任务关系,逐步完成项目构建。

2026.10.22

0

10

PHP时间戳漏洞修复教程
PHP时间戳漏洞修复教程

本专题汇总PHP常见时间戳漏洞,包括2038年溢出、时区漂移、时间戳伪造、重放攻击、时间盲注与日志审计失效等,并给出升级64位环境、使用 DateTimeImmutable、统一UTC、严格超时校验、预处理绑定、hash_equals 比对等修复方案,帮助开发者快速排查和加固时间相关代码。

2026.10.22

0

25

Golangci-lint配置文件与规则设置
Golangci-lint配置文件与规则设置

本专题聚焦Golangci-lint YAML配置文件,讲清运行参数、规则启停、目录排除、问题过滤及严重级别设置,便于团队统一检查标准。

2026.10.22

0

15

Golangci-lint安装与入门教程
Golangci-lint安装与入门教程

本专题讲解Golangci-lint的安装、初始化、基础命令和首次代码检查,覆盖本地环境、Docker及多平台用法,帮助Go开发者快速上手。

2026.10.22

0

15

PHP2Shell高危漏洞修复教程
PHP2Shell高危漏洞修复教程

PHP2Shell漏洞是什么,哪些PHP版本和运行环境会受到影响,服务器应该如何检测与修复?本专题提供版本自查脚本、Linux与Docker升级命令、PHP-FPM和Apache排查步骤,以及修复验证、临时缓解和应急响应方案。

2026.10.22

20

12

剧云人物设定与关系管理教程
剧云人物设定与关系管理教程

本专题介绍剧云人物设定与关系管理,讲解角色小传、性格职业、人物目标、背景资料和关系网络的创建及维护方法。

2026.10.22

0

16

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
Figma AI使用手册
Figma AI使用手册

共0课时 | 0人学习