stitch可以导入figma吗

朋友们大家好，我们上一期讲了用 sti 做 u i 原型，那这期我们来讲如何将这些原型图转换成我们真实项目的产品。首先我们要把我们的 sti 原型图 导入到黑格玛里边，因为我们的开发工具像雀咬，现在用的比较多的就是雀，他现在有 mcp 黑格玛的 mvp， 那有了飞格玛 mvp 之后，我们在开发页面的时候，他就可以通过 mvp 去调用飞格玛的原型甚至是图标。那比如说我现在要开发这个页面，以这个页面举例，直接右键或者是点导出， 打出到 figma 转换，这个时候我们到 figma 页面来，我们先添加一个页面，这边好了点复制到这边， ctrl c ctrl v 直接粘贴就可以了。我们的圆形图，那在这边我们是可以去调整你不需要的，或者是需要修改的地方，点击从市场添加搜索 figma bigger big 码，我现在用的是这一个，你也可以现在用这一个，它这边需要你输入 bigger 码的 access token， 先返回 access token， 在 我的个人中心里边 setting secure， 我 这边已经生成好了。 如果你没有点击 generate new access token， 这边说一个 token 名字，比如说过期时间可以选九十天， scop 就是 他的权限，这个全点上吧，生成 test 的 好看，点击复制。然后再回到我们的开发工具里面，把你需要的填进去，打开，稍等一下，他会检测你这个 mvp 是 否可用，稍等， ok， 这就说明你的飞格玛的 mvp 配置好了。配置好了之后，我们就可以在这边 build with mcp， 这边你就可以让他去调用你的 mvp 帮你去开发了，今天我们的课程就到这里，再见。

今天给大家做一期谷歌 stitch 的 完整教程，那我用它呢，纯粹是因为它的审美很好，所以我的很多网站跟产品都是在里面去用它来玩的， 它可以支持修改导出到 figma， 然后近期有两个核心的功能升级，第一个就是 design 点 m d， 现在你可以根据你自己喜欢的风格，让他帮你生成一套完整的视觉体系，有了这个设计体系之后呢，你的设计风格就能稳定的产出产品，产品的页面不会跑偏。第二就是他可以在线预览你的 产品交互，你可以把你做好的设计图直接框选上，点击预览，它就可以生成一个能够让你点击操作的产品示意，相当于在进入开发之前，你已经提前看到了产品最后长的是什么样子，也非常有帮助。我们会讲一下里面的功能板块都有哪些， 然后我认为正确的操作流程跟顺序是什么样。然后在最后呢，我也会给大家讲几个我个人用起来比较好用的进阶使用技巧。在开始之前呢，我们先来明确一个定位，就是 stitch， 它不是一个用来替代 figma 的 工具， 它更像是在做一些脑爆创意，非常适合让你的一些想法提前变成一个看到的产品形态，减少很多的沟通效率。然后你可以给 ai 去看，也可以让设计师或者说开发去看， 这都非常的好用。首先呢我们进入到 stitch 的 首页左侧，它是往期的项目，正中间是开始的界面，下面的功能键依次是，你可以上传图片和网址作为你的设计参考，可以选择你要到底是做 app 还是网页期间选择一个设计的系统。 呃，然后就是模型的选择，我一般呢会选择一或者二，如果你的产品界面比较多，像 a p p 什么，我会建议大家选二。呃三是给现有的网站去做重新设计。然后最后一个 ideate， 它是用来更多早期的产品发散 作用，但我用的比较少。开始之前你首先需要做的是你要知道你到底要做一个什么样的产品，自己都不知道，你很难在这里面进行各种脑爆。 它是一个 app 还是网站？解决什么问题，叫什么名字？它可能会有哪些的页面跟功能？那我们今天这个案例呢，我们就用一个比较简单的例子 来做一个网站的落地页，整个创作的步骤分成三步，第一步就是确定设计体系，第二步生成产品页面，第三步是局部的调整跟导出。那如果我们以 一个网站落地页为例的话，假设我想要做一个 ai 笔记工具的网站首页，我们就在输入框输入，首先它是一个 什么东西，它解决了什么问题，什么的板块，还有一个很重要的点，就是你可以输入希望用户在看到你这个产品的时候，它是什么样一种感受，那我希望用户感受到的是一种沉浸式的体验，我希望用户能够进入到新流模式 去进行打字啊写作。然后在这边呢，我会建议大家提前去找到你喜欢的设计风格，那可以是图片，也可以是网页，它会基于这些元素去帮你发散，而不是用文字去描述。那我们这边呢，就用 苹果的官网作为视觉参考，我们点击左下角的加号，选择网页网址，点击开始。 接下来呢我们就进入到了 stitch 的 实际创作界面，它的整体创作界面是一个无线画布，可以支持拖拉 拽，所有的深层的内容都会在这边展示。底部是你和 ai 沟通的区域，左上角是 ai 回答的部分，这边唯一的区别就是这两个东西是分开来的，跟我们一般的 ai 工具不太一样。 然后你要改这改那，然后在左下角呢是我们每次对话的记录，你可以理解为它是一个历史记录，我们可以找到之前的修改，在最右侧是具体的编辑，调整修改里面的字的内容啊，或者说去调整别的东西。然后呢我们就进入到第一个阶段，我们要做的就是要首先确认你整个产品的设计风格， 那前面我们已经选择了苹果官网，他已经给了一个初步的视觉，你可以看到这个画板的样式， 它其实就是一个设计系统，相当于它已经根据你给的网站总结了一套苹果风格的设计体系。然后你双击，你甚至可以在这边去直接调整它的颜色，字号，还有圆角，它都会对应的去反映到这个设计系统里。点击右上角的 design d m d， 它是一个文字版的 设计规范，它告诉了 ai 哪些需要遵循，然后你甚至可以把这个东西啊给到真的交互设计师，或者给到 ai 都可以让你的产品更好的去被做出来。那假设这并不是我想要的设计系统呢？那我们也可以去再上传不同的网址或图片啊，让它去创建新的设计风格， 最后用图片描述，让他重新产出一个设计系统啊。在这一步我们不需要去看里面的设计细节，我们要做的只是确认整体的一个风格。第二步，当你确认了设计系统之后呢，我们再去创建页面 啊，这样所有的页面它都会遵循同一套体系，那因为我们的案例是一个落地页，它就一个页面，但假设它是一个网站，网站会有不同的页面，那我们就在这个聊天框输入，帮我们根据这个设计体系去创建。比如说产品页啊，价格页面，关于我们产品功能页面 就越具体，它会深层的，会越符合你的要求。你可以在这边提前预览你的产品效果框，选所有的页面，比如说我们做的这个网站， 它所包含的所有页面，然后点击上方的播放按钮，它就会做出一个交互的界面，这个就是你可以上手去点按钮，然后看到实际的交互跟跳转，可以在开发之前就看到一个最终的一个效果啊，你甚至可以录屏放到网上，让用户看一下这个产品的样子，提前拿到用户的反。 在第三阶段生成完成后呢，最后我们要做的就是局部的调整，如果是大的修改，比如说像整体的颜色空间，那这一类可能会影响到全局。你就直接点击一张图片，然后在下方去用文字描述大体的改一下。那还有一种方式就是点击图片 在上方的 modify， 点击 annotation 这个功能，你可以在页面当中去框选具体要修改的是哪一个部分， 你也可以去输入具体的文字，对于一些小的修改，比如说改文字的内容啊，就来到右侧的铅笔图标，我们点击，然后回到图片，选择 edit text 调整里面的内容就可以。有些地方如果是图片，你也可以直接把一个图片的地址给复制粘贴过来，进行一个大致的图片替换， 看一个大致的效果。确认完之后呢，我们点击右上方，可以导出到 figma 去做更细的调整。最后呢再给大家讲两个进阶的使用方法。那第一个就是我会推荐有一个工具叫做 component library， 它里面包含了各种的设计元素跟术语， 你可以更加准确地去跟 ai 描述你需要一个什么样的交互形式。然后它这边也会有也有很多现成的设计系统，你可以选择自己喜欢的，可以甚至点进去把这个网站复制，作为你的一个 设计的一个参考。第二个技巧呢，就是我会提前画一个手稿，因为我发现其实给 stitch 一个圆形可以让它更好的依据你的这个圆形效果去产出设计。 那我们原先是先有需求文档，再有产品文档啊，需求是告诉我们这个产品解决什么问题的，然后产品呢，是具体说的每个板块都是做什么，我们不需要去学这个东西啊，但是你可以简单的就画一张图，然后去把这个框架给框出来，说这里是什么，这里是什么，然后把这个截图上传给到 stitch， 然后让它基于你的这个源泉去做设计，它会做出更加符合你要求的东西。我觉得 stage 是 一个迭代飞快的产品，介于了在你想法跟实际产品中间的那个设计部分。 最近一直在用，我觉得它是一个很值得大家去上手学习去了解的工具。而且在未来我觉得它真的有可能会替代掉 figma， 去做一个能够直接在里面做非常精细调整的 ai 原声工具，有任何问题直接在评论区跟我留言。好的，我们今天的视频就这样，希望大家喜欢，我们下期再见。

找到了一个笨办法，能够把 figma 里头的图经过二次导手，再导回 figma 里头编辑。 嗯，首先是就生成完之后，这边会有一个嗯播放这个按钮，可以变成这这个界面，就是打开你所有的项目吧，然后我们找到刚才的这个项目，就是他这有时间你可以看这个时间，不知道为啥我这界面出不来。 找点击刚才做这个项目，他就是比较还算比较完整的一个界面，然后这个地方他能够有一个导入到嗯，飞克玛 design， 但是好像要登录还是什么 会员吧？我没搞那个，我就直接给他整张截图了，截图之后就扔到 space 里头，然后跟他简单的描述一下我这是什么东西，然后你给我一笔一复刻一下，然后一定要说先弄成中文，全部是中文， 然后我就可以看出他导出这五张图其实也是两模两样了，但是大部分功能还是在的，就是最起码你是可以编辑他嘛。然后我就稍微的又调整了一下，就是像这样子，就是把这个底色换了一下， 就可以看到生成了五张，跟原来生成那个图还算比较像的，然后也就是 这五张，对，就是生成了这五个界面，然后到这一步就可以，就是你可以把这五张图全部打包复制到点这个猫，然后复制到飞格玛里头，就这个地方就是这样子，然后点转换，然后就会等待一段时间，等个一分钟吧，半分钟 五十秒，反正等一会，然后点复制之后就可以导到 fig 里头，直接打开一个界面，然后粘贴进去，就可以完全的编辑去了。

谷歌真的不讲武德，帮我设计一套小红书风格兴趣电商网站的 u i， 包括首页、列表页、详情页、订单页、个人中心页等等，正在设计中，请稍等。哇，太棒了！小红书风格的电商网站已经创建好了，你想看看哪个页面 把这些页面生成一套交互原型？我可以设计一套包含订单详情和追踪的完整流程，让你的电商体验更加流畅。正在生成中，请稍等片刻互动流程页面已经完成了！ 一句话，生成一套交互图，能点能动，太适合做屏审了！而且 space 还自带一整套 ui 规范， md 格式的 直接丢给任何 ai 都能读，你自己设计的规范也能喂给它设计和开发。第一次真正打开，这就叫专业！最重要的是完全免费，赶紧去试试吧！关注我，每天一个 ai 小 技巧！

stitch 又更新了， figma 股价硬升大跌，带你感受一下这可能是未来的 ui 设计方式。上传一张参考图，输入提示词，制作一个宠物周边商品电商平台，并给出要它做的页面列表。 这次比较大的更新是它每次输出页面之前会先做一套设计系统，这套设计系统我们可以随时修改里面的配色、字体、圆角等内容。有点正儿八经的 ui 设计工具内位了。 看看他给出的页面，其实就是正常煎饼奶的能力。但是这次更新在功能上有了很大变化，比如可以自动生成可交互原型，这个不需要像 figma 那 样手动连线， stitch 会给你把页面跳转全部设置好，并且你也可以通过 ai 补全页面，他会给你推荐一些欠缺的页面， 你可以按它推荐的补充，也可以自己输入提示词去补充页面。同样的，新增的这些页面同样也会被连入交互原形中。可以点击单个页面，如果你想要修改，可以直接点击你要修改的部分，比如把这个改成滚动 banner， 并将图片改成猫咪，它也能很快改好。 当然你还可以通过语音跟他沟通进行修改，但是目前我感觉这个功能意义不是很大。还有一些之前就有的功能目前也得到了完善，比如可以随意切换的移动端、电脑端设计稿，目前可以同屏展示多个不同尺寸的设计稿。 再比如，你可以框选你所有的设计稿，一键复制到 figma， 之前只有 flash 模型生成的可以复制到 figma， 现在 pro 版本的模型也可以，并且到 figma 中查看一下效果，整个内容做得非常规范，三格系统自动布局，整个颜色、字体等元素的一致性 我觉得真的很不错了。有些人可能会杠做复杂产品的问题，但是这个真的只是时间问题。总体来说，斐格玛在 ai 这块确实慢了一步， stitch、 pencil paper 都在探索一种 ai native 的 ui 设计方式，可能就是未来的趋势。

别再给 figma 交智商税了，谷歌 stitch 全免费设计完成，直接无缝对接 ai 编程！你绝对不会相信，谷歌刚出了个 ai 设计神器，不仅完全免费，还把 figma 给卷哭了！它简直是一人公司的福音， 从设计到开发都能搞定。这是我用 stitch 耗时五分钟生成的访 ios 系统天气 app 设计稿。以前你要切图写标注，现在呢？设计稿更新后，无缝对接 ai 编程效率直接翻了十倍！它支持导出到 google ai studio、 figma、 juice 设计图、网页以及原型图。不想用 google 全家桶也没关系，无缝对接其他 ai 编程工具选择 m c p， 支持 vs code、 cloud code、 open code、 codix、 jameneki 等。

一分钟教会您如何用 stitch 生成这种高质量的用爱并导入到 fk 码的全流程。来到 stitch， 首先切换模式，模式大概有四个，我们今天进行演示的是第一个和第三个，第一个可将设计导出到 fk 码， 第三个优先保证最高质量与推理能力。下面我们来设计一个音乐 app 首页，输入我们提前准备好的咒语。下面我们来设计一个音乐 app 首页，让模型进行处理。 这是用的第一个模式生成的界面，我们看到页面样式相对粗糙，且有的中文，有的英文，虽然可以直接到出道 figma 后期修改工作量大，下面我用第三个模式三点零 pro 再生成试试。 我们可以看到第二次生成的页面，从功能、风格、视觉都相对统一，效果更好。下面我们可以看看怎么 stitch 导入到 fake 码。使用第一种，如果用发色模型可以直接点击默认，点击复制到 fake 码即可。 可以看到所有元素都是可以编辑使用的，图标也是矢量的。若用的是三点零 pro 的 模型生成的界面，可以通过点击末点击查看代码， 点击复制代码，来到飞格码中，找到插件 html 处理载引，然后把刚刚复制的 html 粘贴到输入框中， 再点击运行，等一会儿页面就可以完美生成可编辑的页面。现在看这个页面也是可以编辑的啦！喜欢这个教程的宝子们记得点赞加关注哦！

hi， 今日分享 stitch figma make 同样条件下的效果对比给原型图与提示词，先看 stitch 的 效果， 提示词里没有写中文，所以是英文网页，美观度可以，但是跟原型图没啥关系， 再提示词加入中文再生成，美观度不如英文版的，而且对于原型内容的提取不完整，再来重复操作一次，已经不按照原型图的需求再出图了。 再来看看 figma make 给同样的原型图与提示词生成效果。 按照原型图的布局做了设计，内容获取完整，重复试了几次，效果都还不错，没有跑偏，是适合中文网页的，可以拿来做参考再优化设计。

哦哦哦。

今天想分享一下如何让一个没有什么美学训练，没有什么美学功底的一个小白，也可以做出很美观同时很实用的前端界面。 那我说实用指的是整个网站的信息价格都是严格按照你心里想的用户的使用习惯，然后去定制的，同时他可以很好的介绍你的这个产品或者服务。美观的意思则是说他可以根据不同的使用场景选择好对应的风格，然后让人眼前一亮的感觉。做三个关键层面，认知矫正。首先就是一个优秀的设计，他不只是要美， 还要让风格服务于目的。比如说你要想做一个音乐分享 app， 那 复古风格可能比较适合，但是复古风格不一定适合一个体育网站。然后就是，呃，对于缺乏美学训练的开发者来说，其实给他降低一定的自由度，多一些约束， 把一些美学角色交给 ai 反而是个更好的一个现象。然后就是如果一个美的设计啊，它如果不能附线，只能靠一个灵光一现的一个提示词，那对于开发者来说是不实用的。所以我今天讲的这套方法是可以完全的做到上面这三个点。那使用的工具呢？一个是 antigravity， 呃，但你也可以用其他的一个 agent skill， 有 agent skill 这个东西去动，有时候 call 什么都可以的，然后你们会用到我用的一些东西，然后就是一个 stitch。 这个其实我之前分享过一个类似，但我现在对这个方法做了一个升级，然后增加了一些其他的部分。 ok， 那 下面就是我这个完整的一个工作流。嗯，首先第一步就是要生成 i a document， 也就是一个信息架构图。呃， 简单来说就是用户看到哪些页面，然后先点哪，后点哪，那这个它决定了你的网站是不是真的可以投入去使用。那我是用我自己做的一个 i a planner 啊，它可以去读 p r d， 然后知道我这个项目大概是要干什么，所以就针对性的设计网站和 app 的 一个技术架构，页面规划等等。然后它会在结尾的时候生成一个线框图。呃，你看到线框图以后，你大概会对这个页面的布置会有一些概念，最后它会交付一个 i a 的 这样一个文档， 然后下一步就是把它传到一个 visual schema 里面，那这一步它主要生成的是静态的一个视觉的一个设计。 嗯，你把 p r d 还有这个 i a 一 块给它，它里面这个 v i p r 这个是也是我做的一个东西，那自己也可以用 a 阵去配，它会跟你去沟通，然后确定一个色彩，一个整体的一个调性，最后给你的一个东西差不多很像是 d， 三点 m d， 然后你就要把这两个东西分别传到 stitch 上面啊，让它去按照这个信息架构和视觉去完成一个设计。呃，你可以看一下， 多弄几个方案，然后试一试哪个你最喜欢，然后你就点一下那个 export to， 呃， code to on clipboard 就 可以，让你复制给那个变成 agent 就 可以了。最后一部分是我觉得还需要加一些动态的部分。 嗯，如果你做完前几步，你会感觉这个页面还没有那么惊艳的话，那是因为它没有一些很丰富的动效，以及呃很出色的底图，所以这个调用这个 u x designer 这一步呢，它就是帮助你去设计一个动效，然后甚至音效呃动画，然后 它也会告诉你你需要准备哪些美术素材，你放到对应的文件夹里面，就是那个 assets 里面，它就会把那些那个底图啊图片素材去引用上， 然后做出来这样一个效果。它还会提供是 stm in canvas 这个东西，它是一个比较新的一个技术，呃，会有一些比较有趣好玩的一个动态效果，如果你感兴趣的话，你可以去使用一下。那里面这些呃， workflow 就是 agent， 其实都是我自己去定义的，当然你也可以根据我刚才的描述去自己去生成，呃， 或者你直接直接可以找我领也可以的。那其他的它里面涉及到，比如说生成框图啊，生成这个生成提示词，这些都是对应的 skill， 它会在这个过程中调用不同的 skill， 那 skill 这个部分 你也可以不用自己写，你交给 i 去交给他就好了。

勾勾史蒂兹真的太牛了，我亲测下来四点，感受最深。第一，生成效果非常能打，这里我让他做一个游戏组队友的设计稿，一分钟就出来的设计稿说不上完美，但是调整后完全可用。第二，输出格式非常丰富， 支持图片、 frame 等多种格式，甚至能直接导出代码。这意味着你扣完音时不再需要再跟太编程工具反复调样式，编码效率直接起飞。第三，对持续迭代支持的特别好， 支持多人协助手动编辑，局部微调，还会自动生成设计规范，改版不再痛苦。第四，也是最重要的，完全免费，每天四百积分根本用不完。

比如说在高速服务区开个酒吧，来填补服务区不卖酒的这个市场空白。今天我们不聊 web coding， 我 们来聊个 web designing。 谷歌去年发布了这个叫 stitch 的 黑科技产品。啊，不是这个 stitch， 是 这个 stitch， 他的推出直接解决了大部分设计场景的难题，有人说他是设计师的终极梦想，也有人说他是设计生涯的噩梦，他的推出直接干翻了很多创业团队和 sas 工具，我亲身实测了三个月，他确实很好用，所以今天这期视频有一点算教学视频，他适用于所有不会设计的小白，干货满满。废话不多说，我们直接开始。 在设计之前，我们可以先想一个创业 idea， 比如说在高速服务区开个酒吧，来填补平时不卖酒的这个市场空白，可以让旅途匹配的乘客们停下来喝个酒，小酌一下解解乏，我说的不是司机啊，嗯，不要瞎想。首先是第一种最常见的用法，就是用自然语言生成网页或者 app， 我们打开 stitch， 输入我们的需求，然后我们可以看到这里有个色盘，可以选择我们这个网页的主要配色，然后让我们来选择一下这个比较赛博朋克的颜色。好，左边的对话框已经出来这个网站的基本样式了，然后我们等一下， ok， 现在这个 app 的 整体框架就出来了，我们可以看一下整体的设计效果，然后对哪里不满意，我们就点击一下，你看就自动扩展到这个对话框了。 就是首先这个点单界面，你作为一个酒吧，你怎么可能只有这四款酒，所以我们点击一下它，然后输入，很明显酒品不够，请继续增加酒类。好了，新的菜单出来了，但是我们看这个新的菜单很明显上面有很多 bug， 很多图片是显示不出来的，这就是它现在出了问题，然后我们就继续扩着它，然后输入 请给我更多款式的酒，然后每一款都配上图片。 ok， 现在设置这个版本我们看起来也不错，然后把刚刚两个不要的扔到一边，把这四个需要的选择下来，然后点上面的 generate， 我 们可以预览一下这个界面， 我们可以看到右边有个 ai 预测热力图的这个效果，这个功能很屌，因为 ai 它会预测用户会点哪，会看哪，你可以直接根据这个来优化布局，我们可以看到点了这个上面会出现虚线，这就是热力图圈起来的地方。 ok， 下面让我们来浏览一下这个网页， 挺丝滑的，然后每个按键上都有跳动，然后他也帮我们设计了新的功能， 然后稍微高级一点的用法就是你用其他的 ai 来写一份设计说明书塞给他，这样他生成的方案可能会精确的多。 然后第二种就是手绘草图，秒变网页，这种适合对自己的画工比较有自信的朋友。然后我们来试一下这个功能， 然后我画了一张我理想中的酒吧主页图，然后看他能不能帮我设计出来，我们来输入这个提示词，然后既然要开酒吧吗，就让我们会想到红酒，然后所以我也希望他帮我设计出一个比较有意识风格的图来， ok， 让他生成，大家可以看到我画的这张图非常的有艺术感，顶部功能区，然后有一个拿着酒杯的意大利女生，然后喝酒有害健康的 slogan， 我 觉得这个图画的还是不错的，看他生成怎么样。 ok， 网页也出来了，这个网页的排版不是很好看，如果觉得不好的话，大家可以多生成几次，因为他也跟抽奖一样，毕竟你文案也是有随机性的， 我们可以看到，呃，每个按钮他都是有动效的，他也在我的 slogan 之上润色了一下，然后啤酒的分类也是有效果的，然后底下一句装逼的话， ok， 这个网站大概就是这样。 然后是第三种，是更加简单也更加好用的作弊方法，就是如果你想做出非常专业的网站，但是你又不会写 prompt， 你 又不会手绘，你可以直接把喜欢的网站截图丢给 stitch， 虽然他不会像素级的复刻，但是他会完美抓取你那个网站的大部分颜色啊，字体啊，包括他的灵魂，其实还原的还是不错的。然后我们来上手试一下， 然后我们在网上随便搜一家酒吧的主页，然后就以这个网站为例，他有还不错的动态效果，然后他的功能非常齐全，我们来截一张图，把他直接喂给 stitch， 叫他模仿这个网站，然后来帮我生成我这个项目。 然后我的要求是高级，因为他只有一张截图嘛，所以我让他向下自动补全完整网页，然后因为原版是英文，所以我希望生成一个中文网站，然后提交，感觉这个功能稍微有点慢。 ok， 出来了，我们可以看到整个网站的色调，包括风格其实和原网站还是比较对应的，然后甚至他还做了一个渐变的效果，然后我们把两个网站放在一起对比一下，大家可以看一看，功能很齐全，然后每个 icon 你 放上去都是有一些动态效果的，设计非常的不错，然后滚动也非常丝滑， 大概的效果就是这样了，我只是随机给大家展示一下，如果你对这个网页哪里不满意，你还可以继续为提示字给他继续去修改，继续去润色，然后多抽几次卡，也许会抽到你比较满意的版本。 stitch 的 这个界面也不错，他这个无限缩放的画幕就像 figma 一 样，所有的设计稿都在一个无限大的画布上，你可以随意的拖拽，修改文字和图片都可以，自由度还是蛮高的。 生成完整个应用，如果你觉得这个版本满意的话，你可以点右上角的 export 导出，你点击 figma， 等一会，下面会出现一个 copy 按钮，然后你可以把刚做的设计 copy 到 figma 的 界面上，在 figma 里面你可以修改文字，然后修改更多的细节，修改 icon， 修改 button 都可以。 以上就是最常见的三种使用方法。看到这里你是不是觉得设计师可能快要失业了？在过去几个月的实测中，我也发现了几个大坑，这个产品他也没有你想的这么完善。 首先第一他还在贝塔测试阶段，很多功能，比如团队协助 u i l 提取自定义组件库之类的， 他目前经常都用不了，还有待优化。然后第二就是速度太慢了，生成一次设计肯定要等好几分钟，我统计了一下，平均我每次生成的时间在两分三十秒到三分钟之间，而且每次还可能生成一些艺术性翻车的方案，需要反复调整。 第三就是他的审美眼光依旧有待提高。 ai 生成的东西虽然可以节省你手动设计的时间，但是要达到商用的标准，还是需要你手动去调很多东西的，比如说颜色、字体、排版之类的，毕竟我觉得目前人类的审美能力还不是 ai 可以 取代的。 ok？ 最后做个总结， stitch， 它确实大大降低了网页设计的门槛，对于像我这样的创业者或者设计小白来说，它的的确确是个神器，它能帮你完成一个产品外观上从零到一的雏形，但是后面从一到一百的精细化还得靠你自己， 哪怕现在的 google ai studio 也没这么好用，还得靠那些代码来完成。那么问题就来了，如果未来动动嘴，点点手机就可以做出一个产品，你最想做什么样的产品呢？欢迎在评论区交流。那么今天的视频就到这里，这里是 bryce， 我 们下期再见。

这期视频教你们刚入行 ai， 零基础做一个完整的小项目的全过程，我也整理了一份完整的 ppt， 如果感兴趣的话可以评论区留言，我这边展示一下。如果你不感兴趣，可以直接快进到下一个章节， 它是用于储存平常我接触的一些单词和术语。接入了 deep seek， 比如这边我们不知道这 new term entry 啥意思，我们直接 ai translate， 然后等它翻译出来，我们就 save term， 直接保存，也可以自己输入。嗯，想自定义的意思。 功能方面，很简单的功能。然后我个人比较是在乎一下前端，然后我想着就是呈现的好看一点嘛，这边是一个统计表，然后上方是展示的一些词， 然后右边的话是进入了一个 deep tech 聊天的大模型，比如问他 what is smart contract， 然后这边他回答我了，我们可以大致了解一下吗？然后我这边带你们去做。 首先就是先去这个 speech 里面，我个人是比较在乎前端的，所以说我一般会先去这个 speech 里面设计好我的前端。 当然如果你不是很在乎的话，你可以直接跟他大致说一下你想要设置成什么样子，然后他其实生成的都不丑的，但是我个人比较挑剔嘛，我就一直在这里改了很久，然后我这个谷歌的 ai studio 没法用，然后我就直接导出到飞格玛里面了， 你们可以看一下我是怎么导出的，导出来之后在这里发给他，然后飞个马就会根据你写的去给你构建页面。 当然你把这个代码发给他，你也可以直接跟他说调整啊，然后比如这个仪表盘不好看啊，添加什么效果呀？也可以直接跟他说的 差不多，完成之后我们就要去 id 里开始准备去写代码了，然后这个时候我们就要去把这个导出去，然后导在我们的 id 里面进入 id。 先不要慌，先让他给你重构一下架构， 让他去给你对接一下前后端，然后这边给你们看一下我当时给他发的时候，他给我制定的一个 plan， 可以看到上面说的架构重构，前后端分离，去除占位数据。架构是什么东西呢？就是这这些东西看到没有？这一整个就是架构，这个东西也是非常重要的，这也是我所推崇的，你可以不学代码，一定要学架构， 这个任务书大致看一下就行，你真正做的话其实很简单的，这任务书你可以自己大致看一下，直接让他去做就行。 最后的话等你做完之后就是学习阶段，我这边给你们讲一下最后要怎么去学习。你让他给你写一份详细的项目说明书，因为你跟他说这些东西 让他给你做的时候，你并没有参与太多，在你做完一整个项目的时候，你让他写两份说明书，另一个是架构的说明书， 架构很重要，一定要去学一下架构。最后如果你有问题的话，也可以具体去找我联系，也可以去交流，最后我是不开心，祝你们天天开心。