以下是关于 AI 出设计图的教程：
使用 Midjourney 生成 UI 界面：
使用 Claude 生成设计稿的技巧：
进阶技巧和关键词：
如果想指定AI生成某个页面(首页、登录页等)，只需要再加一段页面指令描述就可以，例如「landing page、Profile Page」。社交平台关键词：「landing page」，一个社交平台的登录页设计就出来了。信息类关键词：「Profile Page」，生成人力资源类产品的个人资料页，里面包含照片、自我介绍、基本信息等内容。最后通过一系列的AI出图操作能发现，Midjourney产出的设计图视觉效果都很不错，更适合在APP设计的初始阶段，例如头脑风暴和风格探索等过程中，为设计师提供更多灵感和创意。如果想让Midjourney产出的UI设计图直接落地开发，目前来看仍有一段距离，但按照AI现在的技术迭代速度，这个距离应该也不会太远…
这就导致你让Claude写样式的时候他就会过渡自己发挥，美观度也就没办法得到保障，而且你对样式要求多之后他要从头写的CSS也就越多浪费很多Token。这里我们可以要求Claude用CDN引用TailwindCSS来写组件样式，Tailwind CSS封装了一套非常美观和简洁的样式，可以让Claude直接调用，确保在色彩、响应式和基础组件的美观度不出大问题。基本上有这四个技巧你就可以让Claude设计出非常美观的界面或者组件了。当然，我知道大家最需要的是什么，提示词也是有的，我让Claude根据这几个技巧写了一套提示词。方括号［］的部分就是你需要填写的部分。如何生成设计稿：昨天群里一个朋友提了一嘴能不能转设计稿想了一下，居然还真可以，而且可以帮你生成带自动布局的Figma设计稿和对应可复用的组件。具体的方法也很简单1.1.只需要将你生成的代码部署到线上，如果你用Claude或者POE都有这个功能，如果你用的软件没有发布能力的话可以用这个yourware.so产品。2.2.获得了线上的链接之后，我们只需要使用html.to.design这个Figma插件就可以很好的将网页转换为设计稿，不过每天只免费十次，如果你高强度用的话还是付费。好了这就是全部的教程和内容，如果你觉得有帮助的话可以帮我点个赞?或者喜欢?，也可以转发给需要的朋友。
这个周末尝试了很多种风格的AI出图，一般图片内容我们会分为二维插画以及三维立体两种主要表现形式。为了生成自己想要的图，上面说的3个结构确实可以帮我们大致输出想要的图片：1.1.主题描述：可以描述一个场景和故事以及其组成的元素、一个物体或者人物的细节、搭配。比如一个动物园，里面有老虎、狮子、长颈鹿、大树、围栏等等或者一个小女在森林里搭帐篷，她穿着红色的裙子以及戴着白色的帽子，但是有时候AI不一定能识别每一个描述的元素，如果要描述一个场景中的人物，大家记得进行独立描述，不要用一长串文字去表达，AI会识别不到，比如一个穿着红色盔甲的男孩站在山顶，那么我们最好把他拆分以下：一个男孩、穿着红色盔甲、站在山顶，这样会更加接近我们想要的场景。但是一个大场景中有多个角色的细节就不太容易通过关键词去生成了。1.2.设计风格：设计风格其实很多设计师没有办法直接表达出来，所以我们在这个步骤会去找一些风格类的关键词参考或者是你找到一张想要的风格的图片，放进去，这种我们就称之为垫图/喂图，让AI根据我们给出的图片风格，结合我们的主题描述生成该风格的图片。还有我研究了一下玻璃、透明塑料、霓虹色彩以及一些透明、反射等材质的关键词，比如你想让一个物体表面透明，但是不要把物体里面的机械结构体现出来，可能需要加一些[设计师](https://www.uisdc.com/tag/%e8%ae%be%e8%ae%a1%e5%b8%88)风格，单纯的控制材质很难达到要求，因为系统判断你表面透明了肯定能看到里面的结构，但是有了结构的话物体就会很复杂，不高级。所以这里面关键词的道道非常多，目前也只能通过大家针对某一种风格单独去进行“咒语测试”。未加风格只描述材质