欢迎体验 Motiff 妙多：AI 时代设计工具

回到 2021

Motiff 妙多这个项目始于 2021 年 10 月。不同于很多初创团队有着“找寻并聚集团队全员”这样更具创业色彩的故事，我们在那时已经有一支工程师文化浓厚的团队，也不乏一些优秀的 AI 科学家。在过去，这只团队在教育领域成功实践了不少全球性的项目。

如果要回到开始一个新商业方向的最初灵感，可能要追溯到我们使用 Github Copilot。那时，大部分我们团队的工程师们并不觉得这款软件会发挥多大的价值，而是直觉上认为“距离 AI 有能力帮助我写代码的时代还很遥远”。可到后来，Motiff 妙多几乎所有的工程师都在使用 Copilot。这让我们感受到，如果能找到合适的用户场景，将 AI 适当地融入专业工具中，会在专业用户的工具使用中产生效率变革。看到 AI 对于专业工具领域变革的潜力，我们跃跃欲试。

萌生了想法，接下来就是“找到合适的用户场景”。经过一系列讨论，我们把起点定在“产品设计”领域。这主要有两个原因：

• 设计和研发在线产品是我们这支团队过往持续实践的事情，团队也一直热衷于使用最先进的工具，我们对自己在这个领域的专业理解更有信心。
• 这个世界已经存在无数丰富的用户界面了：仔细观察这些界面，它们在设计模式上的相同，远远胜过了它们在样式、风格上的不同。这样的规律让我们相信 AI 可以持续在这个领域发挥价值。

打造一款 AI 时代的用户界面设计工具，这便是我们的开始。

AI 时代的界面设计工具，需要怎样的编辑器

编辑器是一个用户界面设计工具的核心。Sketch 通过简化和改进 Photoshop 的部分功能，打造了一个专为 UI 设计师使用的编辑器，这本质是一次 “编辑器革命”。“无限画布”“画框”“矢量工具”这些功能，让 Sketch 定义了专业界面设计工具的“矢量时代”。而 Figma， 则通过“协同”让游戏发生了改变——编辑器被直接放在云端，设计师只需通过浏览器就能实时协作。这场新的革命，也让 Figma 成功超越 Sketch 成为当下更流行的工具。

回到 Motiff 妙多，如果面向 AI 时代期望再引发一次变革，我们需要一个怎样的编辑器呢？

最初，我们试图思考一些更广泛的问题：在编辑器的功能定义上，我们究竟倾向于颠覆，还是借鉴？如果 AI 将在设计工具中扮演更重要的角色，下一个时代的编辑器会和我们现在所熟悉的截然不同吗？

这些问题难有定论。但回顾过去，我们确实经历了一些推演。

• AI 对编辑器的改变也许是渐进的，原因是编辑器里每一个功能被 AI 改进是相对独立的命题。如果我们在渐进的创新中需要更多用户反馈，则需要让用户有一个全面的编辑器来持续使用我们的产品。
• “AI 生成”也许是一个非渐进的改变，毕竟我们已经体会了大模型的日新月异。但 Motiff 妙多仍旧认为更好的设计需要人来完善，因此全面精细的编辑器似乎不可或缺。

随着我们边做边思考，愈发觉得一个全面的编辑器很重要。它就像我们的“内功心法”，如果没有内功，我们很难在此基础上施展华丽的“AI 招式”。

当下，如果你已经使用了 Motiff 妙多，会看到一个具备完备云端协同能力的专业编辑器。

打造一个全面的编辑器确实花费了 Motiff 妙多团队不少精力。在这里要特别感谢 Figma 让我们少走很多弯路。 Figma 用近十年的时间开创了一个复杂又精细的在线图形编辑器，是我们长期学习的对象。我们的产品和技术团队常常从 Figma 的 Blog 分享中收获良多。我们同时也发现，对于一款在线图形编辑器，“性能”尤为关键。

Figma 在性能方面一直很优秀，Motiff 妙多则尝试做得更好。

事实上，我们现在已经在很多关键的场景下，将性能优化得更好。例如，在最新的评测中，Motiff 妙多在超过 100 万图层元素的单画布中，依然可以顺畅编辑。我们可能是全世界第一个达到如此性能的在线图形编辑器。

Motiff 妙多对 AI 应用的思考

如何在专业设计工具中融合 AI 能力？从创立 Motiff 妙多开始，这就是整个团队长期思考的问题，也是最重要的问题。

那么，AI 能帮助 UI 设计解决哪些问题？

事实上，在经过了多次头脑风暴后，我们已经有了一份长长的 AI 功能创意清单。这份清单上每一个“点子”都很酷，将这些“点子”转化为产品原型也并非难事。但解决 AI 融入工具的难点往往不是创意本身，而是这些创意是否真的能够被 AI 稳定、精准地实现。

在过去，几乎任何的业务需求都可以被产品和工程研发实现，只是产品质量和开发时间难以保证。但对于 AI 功能，更关键的是找到一种 “PTF”，即 Product-Technology Fit。

技术可行性和产品设计需要一个平衡点。我们需要理解 AI 各种模型当下的能力范围和边界，再定义合适的产品形态，从而使它能够准确又稳定地应用现有的 AI 能力。

从 2021 年至今，我们完成了一些“PTF”的产品方案，并成功在设计团队日常工作中实践。

观察设计师的日常：或许一切都可被 AI 重塑

Motiff 妙多在 AI 功能上的很多灵感，都来源于对设计师日常操作的观察。这些观察会伴随一个目标：如果设计师们日常有一些操作场景是高频复杂但 AI 易于学习的，那或许 AI 在这些场景下能发挥价值。

我们的产品经理做了一项“枯燥又有趣”的事情——让 Motiff 妙多早期测试用户将日常在 Motiff 妙多上工作的操作录屏，然后产品经理通过观看这些录屏来试图找到一些灵感。同时，我们也会在这些最少 3 小时的录屏视频里分析这些产品设计师的具体行为，例如使用了哪些基础工具、快捷键，再对应到录屏里他们完成了哪些工作。

设计师最高频的目标：重复

虽然这些操作分析并不严谨，但从有限的“录屏”样本里，我们观察到产品设计师们 50% 以上的操作是为了“重复”——他们往往通过反复的“复制&粘贴”来完成重复——而事实上，“重复”在产品界面设计里无处不在，它本质上降低了各个产品用户的理解成本。

但“粘贴”一般并不是“重复”的终点。设计师使用“复制&粘贴”，往往是因为期望沿用相同的设计模式，但同样设计模式下的内容又需要有所差异，或是只有复用已经出现过的成套的信息才能更贴近真实的用户界面。

“AI 复制”这个功能的灵感源于我们对重复这件事的思考和理解。

如果你想了解更多背后的故事，可以去看看我们的产品经理超然分享的关于“AI 复制”的思考：《AI 复制：让复制粘贴有所不同》。

自动布局非常好，但糟糕时，也非常糟糕

自动布局是一个非常实用的功能，它让产品设计师可以具备更好的结构化布局能力，这是 Figma 极具开创性的发明。Motiff 妙多也继承了这个功能。

但通过观察设计师在布局时的操作，我们发现：

• 很多设计师从来不用自动布局，有些人觉得这个功能上手的门槛比较高，另一些人则是更喜欢自由地进行设计。
• 如果说学会使用自动布局是一个“困难模式”，那修改，特别是修改他人的自动布局，堪称“地狱模式”。绝对定位可以解决有限的问题，但层层嵌套后的自动布局让设计师很难回归“自由”。

Figma 的产品副总裁 Sho Kuwamoto 在 2021 年时的一场演讲，将设计划分为 Free-form Design （自由布局） 和 Structured Design （结构化布局）。这给了我们一个启发：既然自由布局和结构化布局都是设计师需要的，那是否存在一种方法，让用户可以在有需求时就可以创建结构化布局来结构化调整，而想自由设计时又能回归到自由设计？

“AI 布局”这个功能应运而生。

当前，“AI 布局”支持了两种模式来解决上述问题。如果你想详细了解，可以看看我们的产品经理杨茗的分享：《AI 布局：在自由与结构化设计间灵动自如》。

设计系统：从生产流程看实践的效率改进

自《原子设计》这本书开创性地提出“设计系统”这个概念以来，“设计系统”一直都是保持设计一致性的最佳实践。

我们认为“设计系统”真正的有效实践，是从协同时代一切都放到云端开始的。

“协同”解决了设计系统在同步上很多的痛点，但没有解决所有的问题——创建一个设计系统仍然需要花费大量时间来进行整理，而每个团队的组件库和规范也往往复杂，维护和应用并不容易。

如果我们将目光转向产品设计的生产流程，仔细审视其中的每一个环节，还会发现大量琐碎但创意价值感低的工作。一些资深的产品设计师迷失在琐碎中，甚至会开始怀疑作为设计师的价值。

将 AI 引入到设计系统的实践是一个非常直觉而自然的想法。AI 可以在很多场景下扮演助手的角色，代劳繁琐的工作。

当下，Motiff 妙多已经通过 AI 有效优化了设计系统实践的效率，包括：

• 创建设计系统时提高整理界面清单的效率；
• 维护设计系统时让系统的迭代更实时；
• 应用设计系统过程中设计师通过智能检查来轻松地校准规范。

如果你有兴趣，可以更多了解我们的产品经理孙强和冀平是如何构建整套 AI 设计系统：《AI 设计系统创建：一键开启 AI 时代的新实践》。

AI 生成 UI：设计师描述意图，AI 快速呈现方案

大模型让“生成”成为当下 AI 领域最热门的话题。毕竟，我们已经看到了“文生图”的飞速发展，“AI 生成 UI”没有理由不在未来实现。相比如何做出一套酷炫的“AI 生成 UI 的 Demo”，Motiff 妙多在“生成”方面的思考会更审慎地评估一件事情：AI 需要“生成”什么，对产品设计师当下的工作是更有价值的？

我们认为价值主要会产生在两个方向：

• 对于新创立的项目：设计师只有一个模糊的“意图”。在进行设计之前，设计师需要更多的灵感来参照，此时让 AI 快速提供一些“呈现”是有价值的。
• 对于已经运转的项目：此时的设计师“意图”更加具体。这些“意图”可能是描述，也可能是线框图，或直接是图文并茂的产品需求文档。如果让 AI 基于此生成界面，设计师更需要的是符合当下业务设计系统的界面。

我们在“生成”方面的工作也一直在围绕这两个方向循序渐进的开展，并不断探索如何将大模型的能力融入进来。

AI 魔法框：设计师勾勒意图，AI 完善意图的呈现

就像产品经理和产品设计师会不断交流，共同来完成一个新产品的设计，我们认为人与 AI 的关系也不只是”上游交付下游”，而会产生一种“圆桌共建（Round Table）”的合作形式。

“AI 魔法框”的灵感正是在这个假设下诞生。

我们观察到大部分的产品设计从最初到完成，会经过产品设计师不断地勾勒和尝试，最终选定一个合适的方案。“重复”地使用之前的设计元素或结构是一个非常高频的操作。正如前面所介绍的“AI 复制”在特定场景下帮助设计师提升“重复”操作的效率，我们希望“AI 魔法框”能从“意图”的维度改善设计师的“重复”问题——通过“AI 魔法框”，设计师只需要通过画一个框来“勾勒”意图，AI 便可以通过框和框所在位置的上下文来“完善”意图。

当前“AI 魔法框”的能力虽然仅仅是召回过往重复的元素，但我们相信未来它可以结合“生成”迸发出更多的魔法。更多思考，你可以阅读：《AI 魔法框：框向未来》。

欢迎体验 Motiff 妙多： AI 时代设计工具

经历两年半的打磨，在 2024 年 6 月，我们将 Motiff 妙多这款 AI 时代设计工具推荐给你和你的团队。

你和团队可以从尝试 Motiff 妙多的创新 AI 功能开始，来感受 AI 时代下的产品设计工具对效率、创意、生产力的改进。我们将致力于持续为更广泛的用户提供功能全面、性能卓越、AI 驱动的专业设计工具。另一方面，我们用公道的价格，来满足团队在基础功能和研发模式的使用需求，同时，当前所有的 AI 功能限时免费。

愿 AI 帮你摆脱繁琐的工作，回归设计本身。