大家好，我是樱木。

前端客户市场或者甲方，这边设计稿一出来，恨不得当天就要出结果。每家公司的研发总是滞后于市场的，这个是客观存在的。

AI 编程，越来越贴近市场环境，不再纠结于语言、范式等等。

客户发设计稿，我们使用字节 Trae，配置好 MCP，一个 UI 界面就出来了！

首先打开 figma 的官方网站：

https://www.figma.com/

没有注册的用户，进行注册登录就好。

然后我们左上角，点击 Setting

点击这里 Security，切好到这个标签。点击最下面的 Generate new token。

创建 token，先起一个名字，方便查找，token 失效时间我们用默认的 30 天失效，同时一些读取权限打开，最后点击生成 token。

生成 token，这个 token 后面会用到，效果如下：

我们打开 Trae

点击右上角的齿轮设置图标，点击 MCP。

点击添加，从市场添加。

点击添加 Figma AI Bridge

token 是我们刚刚复制过来的，填入进去。

打开 figma，在里面找到一个 figma 模版，点击 share 

点击 Copy link

我们输入：我提供的fgma链接：<刚刚复制的链接> ，帮我生成静态网页。

出现运行，点击运行。

最后效果如下：

这种模式，适合独立开发者，快速交付。好消息是，公司里面也在推进这个事情。

总结一下，这种 UI 自动化出界面，拼到最后比的是：大模型能力。

好啦，今天的分享就到这里了。有帮助的帮忙点个赞。

 AI 系列入门手把手教程：AI教程合集

我是樱木，持续探索 AI 领域，主要分享最新的 AI 工具动态，评测，提效。