logo
帮助文档/妙多 AI/妙多实践 | 使用妙多 AI,完成专业产品设计

妙多实践 | 使用妙多 AI,完成专业产品设计

妙多 AI 2.0 上线后,我们收到了很多来自用户的反馈,其中不乏产品经理、独立开发者等非设计师遇到的设计难题。为了帮助你充分利用妙多 AI,我们制作了本期内容,为你展示使用妙多创造的更多可能。

如果你有一个产品想法、想要做出一套视觉效果还不错的 UI,但不知道如何上手,本期视频或许可以帮到你。

我们希望你可以将妙多 AI 当做你的智能设计伙伴。你可以随时将它唤起,通过点选、框选等直觉的交互,用自然语言完成产品规划、生成界面、生成局部、修改方案等任务,让妙多 AI 成为你的灵感源泉、产品架构师和界面设计师。

以下是我们推荐你使用妙多 AI 的完整流程:

实践流程

  1. 1.规划页面:把产品想法输入对话框,让妙多 AI 帮你生成一整套产品 UI 规划。
  2. 2.确定风格:使用自由风格,让 AI “抽盲盒”,为你生成多个界面备选,成为灵感来源;或者选择你喜好的主流设计系统,并调整风格参数,确保妙多 AI 在设计风格一致的前提下生成界面。
  3. 3.连续生成:万事俱备,你只需按照妙多 AI 给你的页面规划,连续生成界面。你也可以点击已生成界面中的文字或按钮元素,让妙多 AI 基于设计语境帮你生成更多子页面。
  4. 4.编辑结果:界面中的瑕疵你可以选择手动调整,或选中局部,让妙多 AI 帮助迭代。你还可以要求妙多 AI 帮你生图改图、翻译或改写文本,无需求助其他工具。

到练习场试玩妙多 AI


妙多 AI 使用指南

妙多 AI 能帮你做什么?

妙多 AI 2.0 是你的设计伙伴。你可以在文件的右边栏中选择「AI」将它唤起,也可以使用快捷键 ⌥ Option + 8 / Alt + 8 ,快速进入 AI 模式。

通过自然语言指令,妙多 AI 可以完成生成 UI、智能编辑、生成新模块、图片生成、翻译改写等等产品设计中的各种复杂任务,帮助你把更多时间投入到创意本身,将重复、繁琐的工作交给 AI 处理。

了解详情

编写 AI 生成 UI 提示词

提示词是你与 AI 沟通的桥梁,它通过自然语言为大语言模型(LLM)提供任务指导。高效的提示词能帮助 AI 更精准地理解需求,生成符合预期的高质量 UI 界面。

高效的提示词通常由以下几个关键要素组成:

应用类型:说明应用的类型,以生成符合行业需求的界面。

目标用户:明确目标用户群体,以便调整设计风格和功能模块。

页面名称:描述界面的核心功能,明确页面的用途。 详细的页面模块:描述页面的主要组成部分和功能模块。

风格描述:指定设计风格和视觉元素,包括主题色、字体和模式等信息。

了解详情

使用妙多 AI 用现有风格生成界面

妙多 AI 可以为你构建专属于你的风格。通过学习你产品的典型页面,妙多 AI 能够生成与你产品风格高度一致的界面。

你可以在 AI 面板中点击「自由风格」,选中「AI 学习风格」旁的 ,打开学习风格弹窗,并选择整理好的典型页面文件让 AI 学习你的风格。

在开始学习你的产品风格前,建议你从已有的产品界面中挑选出 20-50 典型界面,并整理到一个文件中。

典型页面是指你产品中各个核心场景的页面,举例:登录流程、下单流程、社交论坛…,每个场景可选取 3-5 个典型页面。

需要生成新界面时,你只需再次点开「自由风格」,选择你已经学习好的风格,并输入设计需求,妙多 AI 就会据此生成对应的设计界面了。

点击查看分步骤演示

常见问题

如何快速调整界面布局?

妙多 AI 生成的界面中,大部分都自带“自动布局”,使用自动布局可以高效完成设计工作。

添加自动布局后,很多繁琐修改会变得简单。例如自动布局下的按钮和界面可以随着内容的增减发生响应式变化。

你可以为一个容器、组件或其他选择的多个图层添加自动布局,也可以将任何图层添加到自动布局中。

了解详情

如何快速选中所需图层?

当嵌套层级过多时,你可以使用穿透选择功能快速选中需要的图层,按住修饰键 ⌘ Command / Ctrl ,同时在画布内点击需要的图层即可。


功能背后

代码即界面:生成式 UI 带来设计范式重构

妙多一直坚信 AI 会重塑 UI 设计,并推出了多项业界首创的 AI 功能。大语言模型的快速进展,进一步提升了我们对于 AI 功能的想象力。

妙多希望 AI 功能不仅可以作为设计师的 Copilot,也能实现设计领域的 Autopilot,甚至可以生成完整的设计稿。

点击查看