昨晚飞格玛完成 m c p 能力全面升级,正式支持 ai agent 的 直接操控画布, ai 可以 在画板里实时生成修改设计元素,还能直接调用你的组建库与设计规范。今天我用 codex 实测一下,看看落地效果如何。在 codex 里面点击设置, 选择 m c p 服务器,找到右边 figma, 打开右侧开关,即可自动登录连接 figma, 然后打开 figma 画板,复制画板链接,打开 codex 粘贴链接,并询问他可以看到 figma 画布了吗? 我们看一下他的回答。可以,我这边已经读取到你的 figma 画布结构了, 然后提出相关需求,请根据当前页面内容和风格,帮我把个人中心页面在飞格玛里面画出来。回到飞格玛画布,可以看到个人中心页面已经绘制完成,但是部分细节还原的并不是很好,你们觉着这个效果怎么样? 后面我有测试了几个页面,选择最新的 gpt 五点四模型,效果可能会更好一些。 我将持续更新 ui 设计相关 ai 工具与功能,欢迎大家一起交流,互相学习。
粉丝113获赞1289

想用 ai 快 速生成可编辑的 figma 设计稿,那么我推荐你用它。 hello, 大家好,我是南瓜,今天教大家如何用 ai 快 速生成可编辑的 figma 设计稿。 今天我们的主角是 codex, 没有下载 codex 的 小伙伴可以先来到它的官网进行下载。下载完成之后,我们来到 codex 的 首页,我们点击技能往下滑,找到 figma, 点击加号,显示技能已安装。接着我们来到左下角的设置, 点击 m p p 服务,找到 fig 码,点击安装。接着我们点击进行身份验证,它会弹出这个弹窗,我们点击同意, 同意之后如果页面显示这句话,就说明已经安装成功。我们回到 codex, 现在我们来开始进行创作,让 ai 帮你生成一个 codex, 生成完之后,我们根据他提供的网址进行查看,双击进入我们就能看到他提他生成的一个官网。如果觉得风格还不错,我们先到 figma 新建一个设计,首先点击右上方的分享,再将模式改成可编辑。 接着来到左边右键,点击复制链接,再跟 ai 说。 上传完之后,我们来到 fig 码,我们就能在我们的 fig 码里看到已经可以编辑的 fig 码文件啦。好的,以上就是今天的分享,如果您喜欢我的内容,麻烦给个免费的关注和赞吧,感谢您的观看,我们下次再见!

天天跟开发在飞格玛里面对稿的应该不止我一个吧?前几天我摸索出一套绝杀连招,你看这个 ai 写的代码页面,直接往飞格玛里面一丢,它就变成可编辑的设计稿,更炸裂的是回程成代码,你看这还原度,我直接惊了,而且我还拿它直接读需求出交互稿, 连主健库都能一键帮我搞定。这几天扣的跟科森轮番兼青,我研究了好几天,这三招特别好用,一定要试试。先说好,这期没有恰饭分,个人经验,我自己玩了好几天,该踩的坑基本踩了一遍,操作步骤和提示词我都给你整理好了,求个小关小注,我直接发给你。 废话不多说,直接开始。先说 figma 和代码之间的双向同步,我专门挑了一个复杂一点的 app 页面来演示。其实设计搞转代码这类的功能, 之前有类似的插件,但说实话用过的朋友都知道,基本没法用,布局错乱,元素乱飘,跟原稿根本对不上。但是磕碜昨天更新了一个逆天功能, 直接可以读取这个码里面的设计稿生成代码。把同样的车库页面丢进去试了一下,你看这页面效果,布局颜色全都对的上,基本都能对的上,这还原九十高的我当时直接惊了,你有病!但是当我扒开这个代码页面一看,这底下居然全是图片截图! 所以实际的情况是,它确实会比以前那些插件好那么的一丢丢,但不多。 虽然 figma 转代码这个确实是有一点取巧,但反过来也就是 code 转回 figma 这个方向导入的效果倒是相当的不错,直接说一声,界面就直接可以推送到 figma 的 画布上,变成可编辑的设计稿,图层全是可编辑自动布局,也有,连命名也挺规范的。单向的还原度确实是非常能打的, nice! 虽然所谓的双向互动目前确实还是有点水分,但是这套代码一键生成设计稿的单项功能就已经足够我们搞很多事情了。比起以前我们纯属说设计稿,有了这些功能,你完全可以换一个较为打击的工作流程。 但这还没完,还有两招,压箱底的技能,你有没有接触过这种需求?文档看一眼头都大,还要去啃业务,拆页面化交互,累死累活搞个两三天,结果产品来一句再改改,我直接原地爆炸啊! 现在呢?别管这个文档有多糙,直接丢给他,他会先理解你的需求,把功能和页面自己拆好,你看就几分钟, 全部页面一键给你生成出来。我们来检查一下需求,问页面能不能对得上。注意看这登录页,校车信息、排班、 五 g 报表,文档里的功能点全部都能跟你对得上,逻辑也没有跑偏哦,拉回这个码直接就能编辑的,你自己爱怎么改就怎么改。重点来了,同样的文档,换一个指令,直接能出一个可以交互的原型,甚至他也给你加了点小逗笑, 厉害,没灵感或者感兴趣的时候,先让他出个出版,真的是能救我狗命啊!还有,千万不要让产品知道这个套路, 哈哈哈,压轴这一招呢,是懒人必备的,之前从零搭建一套主件裤,少说也得死磕个两三天吧。颜色规范、字体层级、交互状态,一个个手调,眼睛都快废掉了。现在把这一张设计稿丢给他,告诉他我要哪些主件就行了。你看字体、颜色、 图标、按钮,不到五分钟全部给你做出来了,连交互状态的样子都给你做好。这圆角配色阴影跟圆稿的风格完全对得上,有些地方不满意也没有关系,还是一样直接让 ai 改就行了。 搞定之后我发回这个码,你也搞进去一整套出来,我就问你好不好用?我的天呐,这三招配合体验下来,我自己的感受是,以前那些手搓主键,一点点还原设计稿的体力活真的是可以省掉了, 咱们只负责想脏活累活就交给 ai 来,视频里面用到的所有提示词、操作文档,连怎么安装我都给你们写好了,相信我,真的很好用!觉得有用的话记得点个赞,我是专注 ai 体校的木马,下次再带你们体验实用又好玩的 ai 工具。

这是设计稿,这是我们刚刚用 codex 实现的 ios app, 我 们来看一下还原度如何啊?这边也可以上下滚动,然后角色可以左右滚动。这边设计稿也是可以上下滚动,角色左右滚动,然后可以选择一个 角色聊天。这边的话也可以选择一个角色聊天啊。哈喽,大家好,我是温特妙,欢迎来到 web coding app 实战的第十个课时,在这个课时呢,我们就 直接来使用 figma 来生成我们的 ai 聊天 app 的 一个设计稿 啊,并且呢我们会使用 codex 来将这个设计稿实现成一款 ios app, 并且是会接入一个后端 api 的 啊。呃,不管你有没有编程经验,你只要跟着我一起啊,这一个课时你就能够来实现一款这样的一个 app。 ok, 我 们先来看一下我们的一个设计稿的一个效果啊,这是一个引导页面, 我们通过左右滑动啊,这卡片的话是会嗯,有一个这个卡片的一个切换效果的啊,这样的话我们可以来选择我们的一个陪伴角色。嗯,选好之后可以点击聊天, 然后像我们如果第一次没有登录的话呢,会跳入到这个登录页面,登录页面的话呢,呃,这边的话我们直接用测试账号来登一下就好了。幺零零八六验证码一二三四。 好,登录进来之后呢,进入了一个首页啊,首页的话呢,上边的话呢显示的是我们刚刚选择的一个角色,我们可以和他聊天, 然后聊天背景也是这个角色的一个背景图啊,然后这里的话呢,我们也可以和别的角色来聊天。 嗯,然后这边的话呢,还可以重新选择角色啊,大致就是一个这样的一个形态啊,然后我们真实,我们用 codex 实现的真实的 app 呢,我们还会接入一个真实的接口, ok, 那 我们就先来看一下啊啊,这是我们这个这个课程的一个简介, 嗯,然后呢,这是这个课时的一个步骤,我们的话呢会呃,先来看一下我们的一个设计稿是怎么样去实现的, 然后呢,我们会来配置一下 codex mcp 啊,因为我们是要使用 codex 来读取斐格码这个设计稿的,所以的话我们需要在 codex a p p 里面配置一个斐格码 mcp, 可以去读取 figma 上的一个那个素材的一个信息啊。然后呢,我们会用 xcode 的 啊,也就是 ios 的 一个开发工具来创建项目, 然后再接着呢,我们会把一些项目的一些规范呃写入到 agent 点 md 里面去啊,因为 codex 它每次干活的时候呢,它都会来读取 agent 点 md, 所以 的话你可以理解为 agent 点 md, 它就是这个项目 啊需要遵循的一个规范,需要呃一直记住的一个东西,这样的话 code x 在 后面帮我们来进行一些调节的时候,它就不会跑偏。 然后呢,嗯,我们就要用 code x 啊来嗯实现 figma 的 这个设计稿呢啊,并且呢我们还会 嗯来接入通过我们的一个后端 api 的 一个文档啊,来接入后端 api 来实现一个真正的一个 ai 聊天 app。 然后最后呢,我们还会去呃迭代一下功能,因为像我们设计稿上是聊天页面是不可以添加图片的啊,但其实我们的一个后端 api 是 支持添加图片的啊,所以的话,我呢我们再来迭代一下功能,然后呢我们也会去优化一下,因为像聊天 app 的 话呢,有一个体验上最核心的一个东西啊,就是一个输入框, 所以我们可能会针对输入框去调优一下。嗯,那我们先来看一下啊,我们的一个设计稿是怎么实现的? 嗯,来这边看一下啊。嗯,我们这边直接用的就是 figma mac 来帮我们用 ai 生成的一个设计稿,我可以给大家看一下 figma mac 啊,它的一个官方地址就是 figma 点 com 杠 mac 啊,然后我们在这里只需要输入自然语言,它就能够生成一些设计稿啊, 我们来看一下我们给他输的一个语言,是这样的啊,让他帮我设计一个 iphone ai 陪伴聊天 app 的 一个引导页啊,然后主题是这样的,然后有四个角色啊,然后四个预设的。预设的角色呢,使用横向滚动的卡牌形式展示,用户可以左右滑动这些角色 啊,一次展示以一张角色卡片,左右会露出相邻的一个卡片边缘 啊,然后,嗯,页面包括哪些东西,风格的一个要求,以及角色的素材我也给他啊,把角色的这个头像以及角色背景给他啊,这些素材的话呢,我们通过后端 api 都是可以拿到的。 嗯,我们后端 api 的 一个文档是这里啊,也是一个公开的文档,大家也可以跟着我这个照着做就可以了啊。这,嗯,这是我们上个课时完成的一个后端 api 啊,它的文档我已经把它放到 github 的 一个公开页面上去了, 然后像角色获取的话呢,是在。嗯, chat service 啊,在这里,角色获取是这里啊,是不需要健全的, 直接调用就可以了啊。嗯, chat ross 啊,它的一个后缀是这里,我们把它后缀复制一下, 然后再拼接一下它的一个链接。呃, chat service 的 一个链接,我们来看一下啊, chat service 啊, base your ads 啊,在这里。 chat service 的 一个前缀链接在这里啊,把它拼接一下 啊,拼接一下之后呢,就会来得到的是一个 jason 啊,这个 jason 就是 我们的一个角色卡片 啊,角色卡片在这里啊,当然也可以更加简单一点,我们不需要这么复杂啊,我们直接把刚刚拼接好的这个链接 让 check gbt 一 次性把我们做做掉就可以了啊,这是一个更加省事的一个做法,我们直接让 chat gpt 来帮我们生成给 figma mac 的 一个 promote 啊,你看也是。嗯,用非常自然的一个语言描述就可以了啊。我正在开发一款 ai 陪伴聊天 app, 用户可以和不同的角色聊天 api 已经完成了, 这是引导页需要展示的角色接口,请帮我提取数据啊,我让他我把这个 url 给他啊,让切记 b d 帮我来提取数据就可以了啊,然后我还把整个后端 api 文档也给他了,其实这个时候不不用给他也可以啊。 呃,我告诉 chat, 我 说引导页是这样子的啊,然后测试号是这样子的,然后 chat 它就会帮我来生成这个呃, fig 码的一个 promote 啊,其实也就是和这段 promote 是 非常类似的一个生成直接给他就可以了啊,不需要我们自己写。 然后呃 chat 它生成的这 promote 呢?它好像没有把那个 呃角色的一个 u r 角色的一个图片链接带进去啊,那这样的话呢,可能会有些问题,因为你,因为我们是有一个角色的背景卡片和头像卡片的,我们直接带进去的话呢, figma mac 它就它就不需要瞎猜 啊,那直接用我们现成的就可以了。那,那没关系,我们再跟亲爱的 g p t 说,我说还要把这个头像链接和背景链接也带进去就可以了 啊,那那 chat gpt 它最后就给我们生成了最终的一个 promote 啊,最终一个 promote 是 这样的,我们也可以直接复制一下啊,复制一下贴进去就可以了啊。贴进去之后呢? figure 嘛,它会帮我们生成设计稿 啊,生成设计稿之后呢,可能有一些呃要求我们还不满意啊,像像我这边的话呢,我们我是先生成了引导页,引导页是这样子的,然后呢,我再让 fig 嘛,帮我生成了设计首页啊,首页的话呢,我们点进去啊,这边再登一下 啊,再生成首页啊,首页这个东西啊,也是叉 g p t 给我的,嗯,然后包括我有一些地方不满意,我再继续和它调优 啊,你看我和他呃一直调优啊,然后呃一开始聊天背景页面,他不是那个不是这个角色的一个背景,我告诉他聊天背景页要角色背景啊,然后 fig 嘛, 在这边 fig 嘛,就直接帮我来改改,改好最终,嗯,改到这个版本呢,我是还比较满意的,那我们就用这个版本来做 啊。嗯,然后如果 figma 它给你的设计稿改改的不好怎么办?就是上一个版本你很满意啊,那, 那它你让它改了之后改的不满意的,那也没关系。嗯,我们可以比方说我的一个版本六我是很满意的。版本七我不满意,那我点这个版本六,把它 restore this version 就 可以了啊,就是把版本六变到现在的一个版本, 那他就会呃回回滚到版本六,所以的话也是非常方便。然后像这个,嗯,链接的话,我已经公开了的啊,这个链接的话呢,我是公开了。公开了是在哪里呢?也给大家看一下。 这个 fig 码的一个设计稿的一个公开地址是在这里啊。嗯,大家的话呢,需要先保存到自己的一个项目里面去才可以啊,我给大家打开看一下。嗯,在这, 嗯,在这地方你需要把它先加到自己的一个项目里面啊,加到自己的项目里面之后呢,大概就也就是变成类似于我这个样子的,然后你再点一下这个 share 啊。啊,你啊,我们最好先回到首页,回到 default 页面啊,回到 default 页面是这里啊,这边的话可以选择设备的 啊,选择一个预览设备,这个不不影响啊,不影响,就是到时候可得 x 帮我们来还原设计稿啊,最好的话把它切到这个默认的一个页面去,然后点这个分享啊,分享的话这里有个 copy link, 这个链接的话呢,就是我们会让 codex 来读取的一个链接。 ok, 那 我们再看一下,接下来我们要干啥啊?接下来的话呢,我们要来配置 codex 的 一个 mcp。 嗯,我们打开我们的一个 codex app 啊?打开,打开 codex a p p。 呃,在这个设置里面啊?我们登录好了之后在设置里面,设置里面呢?有一个。

打开任意一个网页,然后在这里输入这段脚本,它就可以直接把整个网址都爬下来。我们再打开 figma, 按下粘贴, 它就变成了一个可编辑的设计稿了。哈喽大家,我是派大星啊。今天我在测试 figma 跟扣 d s 它们的联动的时候,我发现 figma 的 m c p 它一直在调用一个 js 文件呢。 打开看,它是一个获取网页布局的 js 文件,所以我就把它分装了。分装成一个脚本,就是我刚刚开始演示的脚本,你只要按在控制台粘贴以后,它就会直接读取整个网页。同时它还有个功能,就是你点击区域选择, 它就会出现一个选择框,你只要按下复制,在这里粘贴一下,它就能直接取下来了。但是有些用户我发了出去之后,有很多人都不知道怎么配置这个脚本,所以我又把它做成了一个插件,对, 叫 web to figure mark, 你 只要安装以后在任意一个网页,我这里用阿里云的网页测试一下,你只要点击插件图标 ok, 它就能直接整个网页都拉取下来了, ok, 然后再直接粘贴,稍微等一下,因为它图片的资源比较多,它就会慢一点啊,可以你看它实现出来的效果,我觉得基本跟 网页显示的效果一样,而且他最好的点是什么呢?他直接变成了一个自动布局的形式啊,我看一下他的文件在哪里,你看他有一个自动布局,同时你看可以看到他这里是一个雪碧图,是因为他网页他这里是一个会动的图标, 所以他这里就是水墨图。如果你这里是 svg 的 话,他这里显示的就是一个 svg 的 文件。对,然后我已经把整个插件已经分装好放在这里了,你们可以有需要的话就直接来找我。那好了,就这样,拜拜。关注我带你解锁更多 ai 体校技巧。

大家好,我是杰杰。 figma mcp 呢,有个非常好的升级,现在你可以直接在 figma 画布上使用 ai agent 进行设计。它呢主要是通过 user figma 的 tool, 让你通过 cc, codex 或者其他 mcp 的 客户端生成修改你的设计系统相关联的设计资源。 figma mcp 呢,已经存在有段时间了, 以前呢,有一个工具是 generate figma design, 可以 将实时应用和网站的 htlm 转化为可编辑的 figma 图层。那全新的 userfigma 工具呢, 就是让 ai 根据你的设计系统直接在它的画布上进行操作。 figma 和它的合作伙伴还分享了九个 skills, 大家可以看一下。 scales 呢,它可以通过自我修复,循环塑造输出的细化方式。当你使用支持视觉的 ai agent 的 时候,它会不停地截图,然后迭代不匹配的地方。而且这次 figma 开放了对 code connect, figma joy, 还有 figma 的 界面的访问。 figma 官方的 mcp 免费用户,它呢是提供最多呃,每月六次工具调用,基本上是不能做些什么的。 如果你想让 ai 在 figma canvas 上做设计,那就需要去啊订阅它的 dev 或者是 for 席位。 figma 的 figma 的 核心功能呢,有这些,那它怎么安装呢?比如我这里用的是 cursor, 那 我就在它的设置里有一个 marketplace, 找到 fake 码,点击一下安装就行了。如果你是在 c c 里,那可以通过这行命令来安装官方的 fake 码。安装后呢,需要你印证一下身份。如果是在 codex 里使用,那先添加各个 skill, 再之后呢,在设置里面添加 mcp server, 并且点击 fake 码服务器的安装并且认证。现在来看一下 fake 码 mcp 各个工具的讲解。 get a design contest, 它可以获取 figma 选择的上下文,默认输出是 react 和 tailwind。 你 可以这样提示 ai generate figma design 呢,它可以将网页捕获,导入或者转化为 figma 的 设计。 get a variable defines 呢, 它是返回设计中使用的变量颜色。 get code connector, 它可以解锁 figma 节点 id 与代码库中 相应代码主键之间的映设。 user config 码,这也是一开始提到的,可以让 ai 在 它的啊 canvas 里面做一些设计。 search design assistant 呢,这也非常好理解,可以搜索所有连接的主键库。 create new file, 你 可以提示 ai 呢,在 config 码里面新建文件, 不需要给它一个既定的链接。使用。 m c p 有 一些最佳实践。飞格玛官方呢,还推荐将飞格玛 mac 和飞格玛 m c p 结合在一起。现在呢,就来介绍一下我通过飞格玛 ai 来帮我做了哪些事情。我在酷狗里面提示 ai 呢,呃,当时用的是 op 的 四点六, 我让他根据一份设计系统的文档来生成可折叠手机应用的新的 figma 设计页面。在这里呢,我选择了 plan 模式 opt。 四点六,在这里呢,做了六个阶段的计划,再接着就让他去开始执行。 我们看到他在呃和 m c p 对 话中,先会解锁一下我这个 figma 有 没有认证过。 然后呢,开始使用啊,创建 new file tool 来创建一个新的文件。 再接着呢,就使用 user 呃 figma tool 在 figma canvas 里面做设计。之后他就开始创建设计 token, 颜色变量集合,检查字体。 再接着呢就创建第一个屏幕了,创建好了之后他还截图验证了一下,我们先不看这个书名和这个作者 啊,它这个其实没有一一对应上,整个截图可以看出它的设计还是比较淡雅的。再接着它创建第二个 screen, 再之后第三个,第四个等等 一次提示,他就帮我创建了这么多页面。创建好了之后呢,也给出我相关的链接,并且告诉我完成了四个中文页面。来到飞克玛的页面,我们可以看到四个图层都是呃 ai 帮我去生成的,他遵循的是我一开始给他的设计系统语言。 我们看到这里的内屏展开的主页,还有书架部分,还有包括沉浸式阅读这一页,其实我特别喜欢它的设计啊配色,包括它这里选的文字也都是非常不错的。外屏呢还有一个折叠态, 它还模仿了这里的 wifi, 还有电量时间,下方呢就显示如果一开始进入这个书架 会最近的活动是什么,还有快捷操作。我觉得 open 四点六在这一点上设计是相当好,我在上一期视频里面有讲到谷歌的 stitch, 我 就是通过谷歌的 stitch 提示它生成可折叠安卓的阅读应用, 它就帮我生成这些我们看到的画面。左边呢是它的设计语言,当我点击右侧有一个画板图标, 选中它,然后有一个 design markdown 复制一下,我将它翻译好呢,然后呢就放在 cursor 里,让 opt 四点六根据这个设计系统来生成我们在 figma 页面上看到的这些页面, 我个人觉得它的整个啊颜色设计语言保持的还是相当不错,包括我们现在在这里看到的这样的一个啊,排版渐距风格 也是非常像啊。一开始 stitch 在 这里设计的样式,换一个模型, 让 ai 通过菲克玛 m c p, 它会设计出什么样子呢?这里是呃 curda 最近推出来的 comproger, 二来设计的它帮我是做了两个简单的页面,这个页面呢,整体是比较简单的, 色彩的话和我一开始给他提供的啊设计语言 markdown 文件还是非常像。再看一下他的折叠台,这里呢,他的设计就不是特别像折叠屏了,折叠屏的话,虽然说他的屏幕也很大,但是左侧这样的一个图标设计还是太小了, 包括它展现的内容也比较少。那我在这里呢,一是用到了 compose 二模型,第二呢,当时是没有通过计划模式来让它多展现一些内容, 所以他一开始呢帮我构建的页面我们看到是非常简单的。现在来看一下如何让斐格玛 m c p 来做出这样的小鸟儿童理发店的 landing page 页面,并且最终呢让 ai 生成一个真实的页面。 我们看到这些图片是 curses 调用 banana 来生成的。下方啊有服务项目,理发流程, 门店环境、家长评价、提前预约等等,包括这里的有常见问题,这个程序我是通过 gpt 五点四 medium 的 推理程度来最终生成的。在做应用之前,我是先找到了多宁国的网页 啊,这里只是作为一个演示,我们可以看到多宁国的这个风格呢啊,它的图标 logo 是 绿色的,整个页面是比较可爱的,会有一些这种圆角的元素。在克尔这里就提示 gpt 五点四, 让它基于多宁国的网站,在飞克码中创建一个完整的设计系统,创建一个包含遍体的主件库,并拉取真实的 logo 文件, 使用真实的字体和颜色系统将所有这些内容创建在一个新的 figma 文件的单页上。它呢,就先获取多灵国的素材,我是参考 啊 factory ai 它的一个提示。然后呢,开始调用 figma mcp, 在 过了一段时间之后,它就提示我, 他已经拿到了这些真实品牌资产。然后我就告诉他,用真实的颜色和官方真实 logo, 同时把字体规范写进设计系统。但主页里的可编辑文字呢,先用别的一个字体来代替, 再接着他就生成了这样的页面,放大一点呢,可以看到他用到哪些色彩, 还有字体真实的官方的 logo, file, 还有可变的主键库,输入框,卡片素材等等。再之后呢,我就提示它参考目前设计风格, 做一个单页小鸟儿童理发网页 fik 码,设计页面需要是中文页面,在 fik 码上它就会呈现这样的页面,并且呢它提示我啊,它可以将这个网页再细化,做成高保证的版本,于是我就让它做成高保证的版本。 有一个卡片呢,用到了橘色的一些元素,那我觉得这个橘色呢跟整个页面不是特别搭, 所以我就手动调整了这个卡片的一些背景字体颜色。那之后就新开一个 cursor agent 页面,将这样的一个链接放这里。这个链接怎么获取呢?就是在左侧 选中一个 layer, 右键选择啊 copy link to selection, 就 可以把这一股整块都选中了。做一个 link, 放在 ctrl 对 话框里, 让 ai 呢根据链接生成 react 应用。然后它就调用 get designcontestinfact 码,开始编辑代码了,很快就将程序写好了。 他说呢,呃,现在这个里面的有些插图和图标用的是 figma mcp 返回的远程资源链接,这类资源通常不是永久的,它可以生成一些图片, 于是我就让它调用图片生成功能,为网页生成合适的配图。它会调用谷歌的生图 nano brother。 啊,我看到他生成的这三张图片呢啊,除了第三张可能没有那么完美,前两张还是非常不错的。接着我就让他把这三张图放到当前的页面里,换现在的远程飞克马图片,并且让他适当的添加一些啊谋选动画效果。 最终呢,就让 gbt 五点四生成了我们现在看到的这样的一个样式。在这里呢,没有调用 flunt and skills, 而是使用了 figma mcp。 啊一开始设计好的一个设计的元素, 然后最终生成了这样的页面。我个人觉得啊,飞格玛 m c p 在 这里应用还是非常好,非常方便的。刚刚介绍的这两个案例呢,都是让啊 ai 通过 user 飞格玛 to 来生成。 那现在呢,再看一个案例,是调用飞格玛 m c p 呢,来根据我现有的一个程序 来做一些啊元素的一些调整。我首先让他看一下我现有的代码文件,问他可以通过 figma m c p 来做哪些?呃,主键之后五点四呢,告诉我建议先做这几个部分,然后呢我就让他 啊做一个 voicerm studio 主键页,并且要深沉到 figma 的 canvas 里。 当时我是给他新建了一个新的页面,即使你不给他创建一个新的页面也是可以的,他是自己会创建一个新的页面。之后就可以看到 ai 呢在 figma 的 页面上去生成了这样的一个页面, ai 在 生成截图发现呢,这里啊高度有些问题, 他又自己去调整了一下,这个就是他当时生成的一个主键库页面,左边是主键集, 右边呢是一个组合视力。再接着我提示 ai 把这些视觉主键呢继续升级成更规范的 figma 设计系统。补一页完整的 memo voice studio web 页面端界面,这是一个 cover, 这是设计系统的基础样式集,那我们可以看到它这里列出了不同的 color 字体, 还有包括字体有不同的大小,这里也展示出来了,还有不同的啊,主键,这是 actions 啊,这是 feedback。 之后呢,他又帮我去做了啊,五个页面,那我们可以看到呢啊不同的 web 端页面, 还有桌面端 setting open 的 状态。最后呢还有手机端展示的一个页面,整体而言做的内容是非常丰富的。最终呢, g p t 呃,给到回复说已补全这些不同的页面。 创建了啊样式集啊,包括变量集合,颜色,羽翼,渐距羽翼,文字样式,阴影样式, 还有这些主键库,他也是帮我拆解出来了,大家帮我们做出这样非常详细的一个拆分,那就非常有利于我们后续啊程序功能的增加调整 啊,不同页面设计语言保持一致。最后再给大家看一下如何让 ai 啊将一开始 啊这样的一个设计,之前是通过飞格玛 ai 做的一个页面,然后让它调整生成右侧我们看到的这样的一个设计。首先呢,我先获取到一开始设计的 url, 让它改成啊瑞士设计风格。 然后呢,它告诉我在读取这个页面之后就触发了 starter plan 的 调用上限,所以它没办法改。 之后呢,我就开始升级 plan 了,包括我们刚刚看到的其他三个案例啊,都是我升级 plan 之后去做的。再接着他就开始设计了,我们看到这边呢有一大块是呃空白的, 于是我就截图让他去调整一下,这是 ar 优化后的, 可以看到有了一些改变,当然这部分内容的话,可能你手动一下会更好一点啊,毕竟调用这些 ai 的 话也不是特别便宜。 最后呢,我还让他把页面呢导航做的更醒目一点,整个页面做成中文,让他确认某个字体可用之后, 瞬间呢就啊切换成了中文这个页面。虽然说目前这个页面呢还是有不少的问题,但是呢,我们可以看到 ai 在 调用 usefigma 啊这个 tool 的 时候,生成效果还是非常好的,它的修改速度也是非常好的。 我个人呢是啊,不怎么会使用 figma 的, 那通过 figma mcp 它可以来帮我们去轻松地来做到这一点。

openai 刚刚为 codex 发布了史诗级的插件生态,这次更新彻底颠覆了以往的开发体验。全新的插件系统让 codex 进化成了能用工具的全能助手,你只需输入指令,从 note 提取文档,用 flagma 生成网页,最后到 clik 向团队汇报,它自动去拉取资料。 李瞬间排版出一张高质感的设计稿,最后连带链接发送了一份完美的图文报告。为了让大家尽情折腾这些王炸插件,官方直接大设天下,重置了所有订阅计划中的 codex 使用限制,大家现在可以无限量白嫖测试了。

openai 今天放了一个大招啊,就是 openai 旗下有一款 ai 产品,叫做 cortex 这款产品,它推出了一个插件系统功能。这个插件系统功能有什么作用呢?它能够直接帮你调用各种办公软件,比如说像 lowson, 像 jimmy, 像 figma 等应用。 那这就意味着你不再需要自己手动在各种办公软件之间复制粘贴或者切换等等之类的。你只需要对着你的 cloud 下一条指令,它就能够帮你横跨多个软件平台,帮你把整套工作流程全部给你跑完了。 虽然啊,虽然隔壁的 cloud 早在一年前通过 m c p 就 领跑了这一条赛道,但是 cloud 它排斥华人呀,它一天到晚无休止的封号,反观 o p i 那 边的话,它不仅不会封号,而且它会经常帮用户重置一些额度,送给你一些隐形的福利。 如果你实在受不了 cloud 这种变态封号的政策的话,我强烈推荐大家去试一试 callance 这款产品啊,非常非常的好用。

figma 正式把设计稿直接为进了 code code 控制器这类编程工具里。 我配置好 m c p 后,给他了一个网页设计稿,然后让他帮我复刻出来。稍等一会儿,我们来看一下效果。效果真不错,基本完全复刻。甚至 ai 写完代码还能反向推回 figma 画布上迭代前端。 ai 正是从看图写页面 进化到了吃透上下文做页面。以前我们用 ai 写前端,为啥总感觉差一口气?因为 ai 拿不到真实上下文。过去的 ai 是 看图写代码,本质上是图像模仿,但现在 figa 放大招了, 通过 m c p 协议, figa 不 再只是一张张给人看的视觉图,而是变成了 cursor cloudmen 能直接读懂的结构化数据源。 ai 现在拿到的是你真实的组建信息,精确的变量约束和布局数据。甚至 ai 写完代码还能反向推回 figma, 划过上迭代。

以前 codex 像个坐在你旁边疯狂输出建议的天才实习生,想法很猛,但真要他帮我把这个需求同步到 slack, 再见个 no show 涅灭,他只能摊手,哥我没权限。现在他直接揣着你所有工具的钥匙,能读能写能执行, 一键跑完整个工作流插件系统的本质,给 ai 装上手和脚。这次 codex 的 插件不是简单的功能扩展,而是一次角色跃迁。插件把三样东西打包成了可附用工作流 skills 不是 代码,是做事的 s o p。 比如写屁 r 描述这个技能, codex 知道要先读 commit, 再查一视,最后按团队模板生成文案 apps, 直接打通 slack。 figma, ocean, gmail, google drive 相当于给 ai 发了各系统的员工账号, mcp service。 这个更狠,让 codex 能连你公司内部的系统数据库 e p i。 本地项目之外的世界,他也能摸得着。真正可怕的点,他开始吃写代码之前和写代码之后的活官,放那句,以后你不用自己当人肉路由器,在需求方设计文档、代码 测试之间来回传话了。举个真实场景,产品经理在 notion 写了需求拆任务, at 相关人设计师在 figma 更新稿子, codex 同步变更到 gera 加生成前端组建草稿。你写代码时问这个接口文档在哪? codex 直接去 google drive 翻最新版,顺便检查有没有被评论过。代码合入后, codex 自动写 release note, 发 slack 通知更新 notion 进度表。

现在飞格玛刚更新的这个 m c p 的 服务,它可以直接在我们的 ai 代码工具里边生成原生的设计内容,我们这里边也可以看到它支持这个 m c p 的 工具都有哪些,可以查看完整的名单。有了这个支持,我们就可以直接在拷定的工具里边 从代码跟设计的图稿进行无缝的连接,可以直接让编程工具直接在 figma 的 画布里边直接画设计稿也可以。呃,编程工具读取 figma 里边的画布,比之前发截图去沟通要好很多。然后我这里边使用的是 codex, 在技能的这个列表里边,我们就可以直接看到有 m c p 相关的服务。啊,我把这些功能就全都添加上了。如果你不会安装 m c p, 你 也可以直接问他是吧,让他教你去怎么装。装上 m c p 了之后,我们就可以直接复制一个斐格玛的链接,他就可以直接 舞曲 figma 链接里边的内容。呃,在复制链接的时候,我们直接选中这个页面,点击右键这个 copy, copy 里边我们要选择这个按钮,选择这个链接了之后,我们就可以直接在聊天框里边发送过去,然后初次使用的时候,你直接发上去那个链接之后,它可能会有一些失败的提示, 在它运行的这个浏览器上没有进行登录或者一些什么样的原因,其实没有关系,它可以进行自查的,它查出来这些问题之后就直接这样说, 我就直接给他说,你去帮我执行,然后他就会去修改对应的配置,配置修改好了之后会直接提供给你这个登录授权的链接,你点进去登录一下,然后回复他,是吧?我登录好了,然后就会读取你刚才发的那个链接, 当这个 m c p 接通好了之后,并且拿到了你的这个授权,还有这个设计稿的链接,它就会帮你把这个 figma 的 节点去实现成代码,它运行好了之后,它会直接在这个本地文件进行保存,我们可以直接打开那个 html 文件去看它的这个视觉效果, 这就是它给我们从飞格玛设计稿里边去复刻出来的这个界面就是拿代码去写的,当然也会有一些小瑕疵,因为它这全是用这个,应该是用 svg 的 格式去写的, 肯定没有图片设计的那么好看。然后当我们再想修改和调整的时候,我们可以再把它开发的这个设计稿去直接复制到我们飞格玛的界面中,也就是说设计稿的原型它也可以帮助我们直接产出, 然后只需要用到一个这个简单的指令,他就可以直接帮助我们去生成,然后他在生成前就只给我简单确认了一下这个文件所属的团队在那里就行,很快他就把我们这个设计稿生成出来了,我们可以去看一下。 然后现在这个界面就是完全是可编辑的,这个设计稿的模式有所有的内容我都是可以去修改和调试的,然后在这里边去编辑内容的话,就比如说我把这个按钮去改一个颜色,我改好了之后,我想把这个样式去复刻到我的代码中,我要去怎么做? 就还是刚才的那个步骤,复制他的链接,就是他这个链接不只是页面可以复制,我单个的这个设计元素、设计组件都是可以复制的。我复制完这个链接了之后,然后让他根据这个设计稿里边的样式进行更改,然后他就会锁定我这个按钮的位置, 然后把代码里边的那个样式去更改掉,然后代码里边的这个按钮也就同步改变了这个样式。也就是说现在 figma 跟这个抠定工具连接的非常丝滑,所以我们现在可以完全从设计开始,我们先做设,先让 ai 帮助我们做设计,然后再根据设计稿去开发我们的代码,这样就会更稳定一点, 同学们可以看啊,我尝试了一下,就是直接让他根据刚才那个页面的风格,继续帮我在 figma 里面生成一套设计系统,他也是可以完成的。你看他先文字去分析了这个视觉的风格,在 figma 里边新加了一页设计风格的页面,然后把这个页面帮我添加进去了, 我们可以看一下实际的效果,这个就是他给我产出的设计系统的这个样式,我觉得效果还是很不错的。就目前来说,他的这个组建可能稍微简单了一点,因为我给他提供的内容就比较简单,这个就是纯我做测试用的, 大家就可以看它的衔接程度是什么样子的,够不够通畅。后续我们再扩展更多的好玩的玩法,包括我后面也测试了一下它根据这套设计系统能不能延展出其他的这个分支页面,并且它保持这套设计系统的样式是什么样子的, 有没有很完整?然后在这里边我们可以看一下这是它做的一些表格图的一些这个设置的页面,我感觉基本的样式, 它的字体的结构、卡片的布局还有色调都是比较统一的,跟我们这个设计系统来说没有什么太大的差异,所以我建议大家赶紧接上 m c p 的 服务,赶紧去试一试。

cloud 和 codex 到底有什么区别?为什么 web coding 用户离不开 cloud? 传统程序员却钟爱 codex? 看完这个视频你就懂了。 大家好啊,今天来聊聊程序员都在用的 ai 编程工具。先说 cloud, 它是 entropic 的 模型,采用 dance 架构。什么是 dance? 就是 每次推理,所有参数都参与计算, 这让它像一个高度整合的大脑,上下文连贯性特别强。为什么 vlog coding 用户更爱 cloud? 因为 vlog coding 用自然语言描述氛围和意图,需求往往很模糊。比如你说做一个像 notion 一 样的笔记 app, cloud 的 dance 架构能保持输出的一致性和细腻感,不仅功能正确,还有设计美感,不会出现割裂感。 简单说,如果你是创意探索,做产品原型, cloud 是 首选。再说 codex, 它是 open ai 的 代码专用模型, 采用 mo 架构。什么是 mo? 就是 混合专家模型,把乾坤网络拆成多个专家子网络, 路由器动态决定每个 token 激活哪些专家,这让他特别适合模块化、精确的代码任务。传统程序员在 ide 里修 bug, 核心需求是精确、可验证、快速迭代。 codex 的 专家专精设计,让他在处理 bug 描述时 能精准激活相关领域的专家,模块化处理能力很强。但要注意, codex 不 太适合大规模重构,因为它太谨慎了,效率会比较低。简单说,如果你是生产级 bug 修复, codex 是 首选。 其实很多人已经发现了,这两个工具各有各的好,与其纠结用哪个,不如把它们组合起来用。我的经验是, bot coding 脑报阶段用 cloud 做创意和规划, bot 修复阶段用 codex 做精准定位和修复。 现在像 cursor, wind surf 这种 ide 都支持多模型切换,你可以随时在 cloud 和 codex 之间切换。就像你有两个不同特长的同事,一个擅长创意设计,一个擅长精准执行。程序员也可以这样指挥不同的 ai 工具。 好啦,总结一下今天的内容, cloud 的 dance 架构让它成为 web coding 用户的最爱,输出一致细腻,适合创意探索和产品原型。 codex 的 mode 架构让它成为传统程序员的 bug fixing 利器, 精准高效,但不适合大规模重构。不同的场景使用不同的模型结合起来用效率最高。如果你觉得这个视频有用,记得点赞关注我们下期见。

现在我让抠大师给我干个活哈,就是我在某软件截图了很多封面图,但是呢,我需要把这些帮我截图出来,因为这些东西我都不要,就相当于每个就这样帮我截个图,并且单独帮我保存一张图片,你看这里一共有一百多张模板,你看 那么多要截图的是吧?那一张一张截图或一张张裁肯定要很久嘛。然后呢,我现在就用 q dax 自动帮我做,其实 q dax 不 仅能帮你编程,还能帮你做很多事哈。然后呢,现在大家可以看到哈,我这个 目录就放在这里,就是我这个东西就放在这里了,是吧,所以我现在开始教他干活了哈,大家看我,呃,大概怎么说的哈,还是用到我的麦克风。这个目录里有一个叫二零二六零三二七封面图截图的文件夹,然后这个文件夹有很多图片,我需要, 呃,如图所示,我把那个截图帮我裁成类似图片那样,那种没有任何边缘,没有任何其他修饰的截图, 帮我裁干净来,每张图都帮我裁干净了,并帮我帮我打出 g p g 格式。 ok, 然后截张图,嗯, ctrl v 粘贴,然后把这张也复制一下,拷贝, 如图一所示吧。那就如图需要,我需要如图一所示,反正就这样把把所有东西弄好,然后发给他,发给他,他就会思考了,是不是 看他怎么思考了。 ok, 他 在搜索我的东西啊, 我已经找到木偶了,里面是效果是有统一分辨率,是不是我们等他干完,好吧,马上就要干完的,你看,才过两三分钟哈,然后已经开始裁了,然后我发现我这里已经有一个文件夹叫裁后的 gpg, 可以 看一下哈。我靠,裁那么快啊? 哇,都都帮我裁好了,你看,我开始想了哈,因为我这边已经自动进行,你看已经裁好了都在这里是吧?一共一百二十三张。 ok, 我 们看一下他裁的准不准哈, 太快了,这速度啊,你看全裁好了,并且这个都是一遍过,真的牛逼牛逼牛逼牛逼。然后这个分面图对我来说哈,我是用来做参考的哈,后面我可以拖到剪映,比如说我,现在我做分面图哈,完全是靠剪映给我做分面图, 然后剪映真的字体啊,描边啊,真的可以媲美 ps 了,然后直接导出竞争图片就可以了,所以很方便。所以说这些封面图只是说用来我做封面图模板参考的啊,然后我就可以复刻这些封面图了, 那这些一百多张的方案特别好用,然后以后我要做封面图,我就可以直接导入我的那个 剪映吗?是不是?然后我就可以复刻他,是不是?你看我就给复刻这个封面图大概怎么制作的吗?所以特别好用哈, 所以说扣贷是哈,已经够用了,并且他的流量费就他他偷看基本上不用什么钱,说实话哈,大家尽可能白嫖,他真的能跟帮你节省很多效率问题啊,只要你敢想,他基本上都能帮你实现很多工作的。

windows 的 windows 桌面端已经出来了,我深度体验了三天,接下来就跟大家录一个视频,说一下我在使用的过程中遇到的一些问题。首先这个页面就是我们下载的这个页面,直接点进去就可以下载,它是直接连接 微软的软件商店的,所以我下载的时候遇到的一个问题就是我的版本跟这个商店他不符合,因为我的电脑版本我是 win 十,我没有升级到 win 十一,所以说我在下载的时候他就说跟版本不符,我这个时候就准备了一个这样的升级,就是关闭系统防护的升级,还有一个是这里升级的一个文件,就做了一个升级就可以下载了。 下载之后我看到有朋友说下载之后有闪白的问题,所以我没有遇到闪白的问题, 下载了之后就进入到这个界面,其实因为我是代码的小白,我不知道这个界面之后应该怎么去按嘛,我看网上的教程大部分都直接是这个界面了,所以我当时还研究了半天这个地方直接添加项目就好了,添加项目它会让你选择一个文件夹, 我就建建了一个这样的文件夹,再添加项目,选中这个文件夹之后就能来到这样的一个界面。这样一个界面之后,主要我是看一下我们的左下角,它这个地方有一个剩余的额度好像,因为我 gpt 开的是 plus 版本,好像是可以额外再给两倍,反正这个剩余的额度,比如说百分之百,百分之七十六,这个是一周的,每天会给你多少小时,这个就是剩余的额度反,每天都非常的够用, 我看遇到最多的一个问题,包括我自己也遇到,你给他发了一个东西之后,他一直在思考,你看我这个,我三天之前发的,他一直在思考,我又开了一个新的任务,他仍然在思考,这个是怎么解决的呢?我换了一个节点,把 gpt 的 网页版,网页版打开,打开 gpt 的 网页版,打开了之后,换一个节点,我们可以在新建一个新县城,相当于是在这里去给它输入新的任务,最新的应该一一的,它就可以正常的去操作了。 好,下一个就是关于怎么能更好地使用它,其实我是一个代码的小白,我不知道该怎么去使用,有人说这个地方会有一些 skills, 我 没有额外的安装,我觉得基础的就够了。我这里其实主要是想说不要把它当成一个 ai 工具,就把它当成一个纯写代码的一个东西。那么其他的我建议要跟一些 ai 的 工具去做一些搭配着使用。比如说我最开始是搭配着 gpt 去使用的,就相当于用 gpt 给我的一些指令,我再导入到 codex 里面,让它去给我运行。 但是我深度测试了三两天,我发现 gpt 出来的东西仍然不能看,最后出来的这个效果不尽如人意。我在昨天下午我又深度的去换了一下,我换了一个 germanlab juma 之后,我用的 pro 的 模式,虽然我的 gpt 也是 plus 版本的,但是出来的效果不太好。我又用到了 pro 的 这个版本,就 juma pro 的 版本,给它输出我想要的东西, juma 会把它翻译成机器能读懂的这个代码语言,我再导入到这个 codex 里面,让它去给我运行,最后花了半天的时间,昨天满打满算应该是一天的时间,我最终把这个东西给研究出来了,当然 最后的结果是失败了,我开发的这个东西它是失败了,但是我建议大家如果要去使用它的软件搭配着用,就用其他 ai 工具搭配着用,不要直接在 codex 里面去提问。你看我之前就是遇到一部,我就问那个 codex 它该怎么弄,它就给我弄得很乱,因为我不知道怎么写,所以我就跟着它的步骤去, 但是他给我的步骤就又长,他会你问他一句,他说一句,他就不站在那种能完完全全解决这个事情的基础之上。但是 german 呢?给我的感觉就是他想他能够对准我们的这一个核心的目标去给你拆解,因为这是我整体使用 codex 的 一个感想,如果大家有其他的问题,也可以积极的去交流。

各位朋友们晚上好,这两天设置 gpt 发了一个涉及令人愉快的前端,大致讲的就是你需要怎么去用它的 codex, 然后去设计 你的前端页面,然后使前端页面变得精美。它大概讲的是首先使用技巧,你可以基于它的这个入门提示词来进行修改, 你要先选择较低的推理水平,这是他建议的。其次就是说你需要告诉 codex 您的设计限制条件,例如字体调色板,布局, 大概它第三点是提供你提供需要参考的情绪模板,例如截屏各种各样的提示词,具体怎么做是跟用 chat g p 四,它这边已经有讲使用 code x 的 chat g p 四的一个模型创建 情绪模板,这里的情绪模板灵感来自于纽约咖啡文化的 y k 美学,就是你先创造一个大致的一个美术的一个风格,也就是情绪模板页面的一个情绪模板,再 给到它的 gpt 四或者 codex, 基于这个模板,基于这个情绪再去创造,那么会更好一些。总的来说给了我们一个入门的提示词,你可以根据这个入门的提示词去进行修改,再进行操作, 后面的其实就没有了。它还给了一个 skills, 你 可以根据 skills 来完善你自己的题词风格。这个安装的命令就在这边可以直接安装,根据这个 skills 来更加完善你的风格。 这个就是我基于它前面的一个介绍的一个风格来简单的设计了一下,用它给的一个体式词,我感觉我个人看过来还是挺不错的。

今天又靠 dyx 做了一个捉虫双击它,它可以切换动画,单击一下它在旁边的这边标签上也可以进行对它的动作的切换, 然后还可以对他进行拖动,拖动到你任何本来说你觉得影响到你的工作了,你就把他拖动到这个地方,或者拖动到其他的地方,只要不不挡到你视线的地方,你都可以进行,你都可以把他进行进行拖动, 但我喜欢他拖在放在这个角落,我把十一个的这个动画都分享给了他,让他改到这个里面去。单机这个动画是可以跟他闲聊的,你看是可以跟他聊天的,现在他的动画正在钓鱼, 对,回复的是非常快的, 它可以进行移动,都可以移动工作,上面的话其实是直接可以让它调用 codex 直接来工作的。对,来来个跑步的,跑步要拖动一下啊, 我每个都展示一下吧, 满地滚。 好,今天分享到这里,我是老黄,关注我,让你的 ai 更好玩。

卧槽,朋友们出大事了,刚才 openai 官方上线了一个 plugg, 叫做 codex plugin cc, 那 它干什么的?顾名思义就是允许你直接在 cloud code 里面调用 codex 携带码进行这个 review。 那 么刚才我本来是在录制一个 cloud code 的 一个教学视频,看了这个视频绝对是超过百分之九十九的人,那里面就讲到我们如何在 cloud code 里面调用 codex, 本来我们的方案是调用一个啥背景的,对吧?结果现在 openai 直接做了一个 plugg 让你调用, 那么它这个插件的第一功能叫做标准代码生产,就是帮你改 bug。 第二功能就是对抗性生产,那就是它不仅帮你改 bug, 同时它还会刺激你的架构设计,是不是合理?还有第三功能叫做救援模式,这个什么就比如说你现在写用克拉克写代码,发现 有个 bug, 怎么改就改不掉,对吧?那可以直接使用 rescue, 那 么它勾代码就会接受整个代码,然后帮你完成后续的。那么安装也特别简单,我把命令放在这里,大家直接去复制安装就好,赶紧去用起来体验一下。

这个软件大家一定要用起来哈,真的比小龙虾好玩多了。然后我现在做了一个自动切片的软件哈,然后我们开始批量切片哈,你你可以发现他开始切片了, 但是我不知道他当前任务进度百分之三十,我不知道他在执行哪个任务,写那么多任务。所以我看到第一个问题了,然后第二个问题就是这里有个选择目录,每次切完了之后,我想打开所在目录嘛,是不是没有这个快捷键?然后我就发现这些痛点, 所以说你只要跟上 get 说一下,你就截个图给他,我说我把这个进度放在这里,是不是这样有显示就可以, 是吧?就截个图试一下嘛,我就说我希望在每个文件名称右边都会显示时长啊,对,时长什么意思?就是我这个视频到底多长我不知道,一分钟、两分钟,如果我都看到一个,一个小时三十分钟,我就可以不切,因为太长了,切没多少意义,或者说很浪费时间。让我知道一下每个视频 时长,是不是所以右边显示时长,然后开始识别之后会有个进度,是吧?显,只要显示百分比进度就好,然后最终该视频 完成就显示百分之百。二、双击列表中带切片视频可以播放视频,意思就是我双击这个东西,我就可以马上播放视频,我知道这个视频到底是大概有没有必要切片嘛?不然我要找到这个啊,我的文件管理目录那里找到那个视频就没必要了,所以我可以 这里双击就可以播放嘛,是不是?然后我们看一下第三个啥,最终切片完会有个快捷键叫做打开切片所在 find 哈。 find 什么意思啊?在苹果里就是我的电脑意思打就打开所在目录个字哈,我们叫访达哈, 知道吧,所以这个是苹果专用的叫翻的啊,就就是打开所在目录的意思哈。啊,就放在选择目录旁边或下面都可以啊,就我的意思就放在这里这样点击一下就可以打个目录嘛。所以这就是我的一个需求嘛,是不是我只要发给他, 然后他就马上给你改软件啊?啊,我们看一下他是怎么思考的啊,你看改完之后我按照我立即生成并新的麦克 app 是 吧,他就开开始浏览你的电脑文件了,就是他会看你的代码,这是我代码文件嘛? 是 𠲎, 我 已经把这搞清楚了嘛,是不是他很快的我准备开始改代码啊,这次我干嘛干嘛?然后他开始浏览了这个代码,这意思啊,是不是所以他就有个过程他要思考嘛,开始编代码了嘛,是不是在编辑嘛,加了三个代码就加加了三个代码,然后减了一个代码嘛。啊, 又在思考了啊,然后这是我在切片切了好多是不是?你看我现在他在干嘛我都知道哈,我就把这个一定要一定要把它关掉,我就没什么用,比如之前我是这样切的,看他说的图就知道了,是不是?这是什么?是人还是物?是不是?你看这个明显就是一个春联吗?是吧? 然后呢?我现在我们看一下,因为太多了,你看切片整理,你看他现在就是怎么近景特写啊,我觉得没必要啊,很容易到时候会重名,但是如果说按照日期去的话就不会重名哈。 好了,我们再看一下它是怎么改掉我的,那我已经把功能逻辑修正了啊,然后现在它在编新的 app 哈,在编写新的 app 了,然后,哎,你看这个就有又发现一个 bug 了,没有终止任务,是不是? 是不是?所以我又开始说可以终止,你看只有开始切片工具啊,但是我因为我一下子放了一百七十四个视频哈, 然后每个视频可能就几十上百个镜头,是不是你这样算下来有几万个镜头了?所以说你看现在没有终止,所以你发现 bug 你 就修 bug 嘛,然后你就给他一个命令嘛,给他个命令他就会跟跟你改。好, 我现在终止不了。你看到搞了那么久,只只完成百,总金额百分之一,但是视频已经完成一两个了哈,你看我现在已经完成三个视频了,你看每个视频啊,都有那么多。这个东西是我自己做的一个软件哈,就它会提醒我完成了这个任务。好, ok, 我 们可以单机一下就能打开了, 我们打开看有没有改过来, ok, 我 们把这功能关掉哈,然后添加文件夹,比如我选择这个哈,你看一下 是不是这个。好好,我们开始批量切面试一下哈, ok, 你 看进度六,你看跟这个同步了二十一,你看他就帮我实现了功能,是不是老师上五十八秒嘛,我就知道哪个东西嘛,你看还有三十六分钟的,是不是三十六分钟就我们就要着重一下嘛, 下次我再加个功能,叫点击排序嘛,点击一下就可以排序的,然后这个进度不就是可以随着中指我再加个功能叫中指任务,然后改个红色嘛,是不是可以中指任务嘛?你看 他开始已经识别出来了,他要切片第二个了,但是因为我这些东西哈,都是只有一个镜头的哈, 大家好,我现在在和田的一个枣园里啊,大家可以看到吧,所以他只识别出来一个镜头, 所以现在就是刚刚那几个功能。是不是跟我帮我实现了一个进度条,一个打开所在的翻的,还有你看现在就知道了。切哪个镜头我就知道了他给我切了哪个镜头,我还有个东西叫什么啊?双击可以播放视频, ok, 比如说,我现在测试一下哈,比如说看一下这个, 呃,我穿越又失败了哈,这些双击你看马上能播放了,相信那么久 是吧。双击,咦,牛逼,如果说是吧,所以你基本上你要啥功能他就给你实现啥功能啊,等个几分钟就实现了哈,也不用写代码,也不用干嘛啊?是这样的哈,如果说你们看不懂 我的视频,到时候我会出几期置顶哈,你们可以看一下置顶有没有置顶视频置顶会讲一下。呃,扣代码是怎么安装啊?大概怎么使用,你们学一下入门,你看了入门之后你再看我的这个视频,肯定能看得懂的哈,如果看不懂也没关系。好吧,你们记得先看一下置顶, ok, 反正这个东西我也是随便的锻炼自己的输出能力了,我也不求多少人能看这个视频, 反正就是分更新一些,我在时时在做的一些事情啊,每天出一期两期,是不是我觉得这种视频还是对人有点帮助的哈,就是我的一些思路是怎么做的,是不是比较真实哈?