算法驱动的设计：人工智能如何改变设计？

未来不是雇用越来越多的设计师，更多常规工作都交给计算机。玩转字体的将是计算机！

我关注算法驱动设计这个理念好几年了，这种设计方法的工具能帮我们构建UI，储备组件和内容，定制个性化用户体验。但相关方面的资源一直不多，而且没有系统性。

然而，到了2016年，它的工具的技术基础得到发展，设计社区也开始对算法，神经网络和人工智能（AI）产生兴趣。现在我们重新思考设计师在新时代的这个角色也变得合乎时宜。

用Prisma and Glitché处理过的相册封面

机器人会取代设计师？

目前业内算法驱动的设计最令人瞩目的成就来自The Grid网站。这个网站能自动选择模板和内容呈现样式，修饰和整理照片。此外，系统给用户提供A / B测试（对比测试），让用户选择最合适的版本。产品目前仍处于测试阶段，我们现在只能通过其出版物和广告来了解它。

The Grid

算法完全替代设计师的这个想法听起来像是对未来的预测，但其实整个想法是错误的。产品设计师的工作不可替代：产品设计师能将最初的产品理念转化为一个精心设计的用户界面，这种用户界面有一定的互动原则，良好的信息架构和视觉风格，因此他们能帮助公司实现其业务目标并强化其品牌。

设计师在设计过程中还需要做很多大大小小的决定 ; 很多决策是不能用清晰的流程进行描述。另外，一个项目的需求并不是100％清晰和一致，因此设计师必须帮助产品经理解决这些问题 ，才能拿出更好的产品。这不是仅仅选择一个合适的模板和填充内容就能做到的。

然而，如果是创造性的合作的话，比如设计师与算法并行一起解决产品问题时，那么未来我们可以看到很多优秀的作品和实力。算法可以改进我们在网站和APP上的一些常规工作，这也是它的有趣之处。

设计师与算法的创意协作

现在设计师已经能娴熟地使用许多工具和技能，因此才出现了“ 产品设计师 ”这个新的术语。产品设计师是一个产品团队的最活跃的成员，他们了解用户研究的运作，他们可以做交互设计和信息架构，他们可以创建视觉风格，他们可以用运动设计让静态界面充满动感，并对代码进行简单的更改。因此这一类人对任何产品团队来说都是不可替代的。

然而，平衡这么多技能通常很难 – 产品工作的各个方面你不可能亲力亲为。当然，最近新出的一些设计工具缩短了从开始到交付所需的时间，进一步扩展了我们的能力。然而，这些工具仍有局限性。整个环节中仍有过多的常规工作和新的问题，它们仍在不断消耗这些工具帮我们节省下来的时间。我们还需要将我们的工作流程进一步地自动化和精简化。主要从以后三个环节入手：

构建UI储备组件和内容定制个性化UX

我会给出一些例子，针对这三个工作环节提出新的工作方法。

构建UI

像Medium，Readymag和Squarespace这类排版工具已经简化了作者的工作，无数的高质量模板给作者提供了漂亮的设计，作者不需再花钱请设计师设计。未来这些模板会做得更智能，设计的难度变得更低。

Medium

Readymag

Squarespace

比如，The Grid网站虽然还在测试阶段，Wix网站已经取得成功，它的设计开始具备算法驱动特点。这家公司对外公布了Advanced Design Intelligence功能，这个功能类似于The Grid的半自动化设计方式，非专业人士从此也能创建网站了。Wix提供许多高质量现代网站的示例来教授算法。此外，它提出风格方面的建议与客户行业相符合。非专业人员很难挑选出合适的模板，像Wix和The Grid这样的网站就成为他们的设计专家。

Wix的Advanced Design Intelligence功能

当然，像The Grid网站在创建过程中完全没有设计师的参与，得到的设计结果是老套和平庸的（即使它提高行业的整体质量）。但是，如果在这个过程设中设计师能与计算机进行“搭档设计”，那么我们可以轻松解决许多常规的工作。比如，设计师可以在Dribbble或Pinterest上创建一个情绪板，然后算法可以快速地将这些收集的风格运用到原型中，生成一个合适的模板。在这个协作过程中，计算机将成为设计师的学徒，设计师则是这些学徒的艺术总监。

当然，这种设计方式创造不出一个革命性的产品，但我们可以有更多的时间创造一个。此外，许多日常工作实际上是功利主义的，不需要去变革。如果一个公司非常成熟，有自己的一个设计系统，那么算法可以使这个公司更强大。

例如，设计者和开发者可以一起定义包括内容，环境和用户数据的逻辑，平台将使用这些原理和不同的版本来生成设计。这样我们就可以对特定使用场景的细节进行微调，而无需手动绘制和编码几十个屏幕配适。Florian Schulz向我们展示了如何使用插值的想法创建组件的不同屏幕配适。

我从2012年左右对算法驱动设计产生兴趣，当时我在Mail.Ru Group的设计团队接到一个自动化的杂志排版的需求。现有内容的板式结构已经过时，但手动更新成本太高。我们需要帮他们解决的是即使主编不是设计师时，他们依然能得到不错的现代板式设计。

一个特殊的脚本会自动解析一篇文章，脚本再根据文章的内容（文章的段落数和每段的单词数，照片数量及其格式，插入的引号和表格等），选择出文章最适合的板式来呈现。脚本还会混合不同板式，最终得到的设计富于变化。这样可以编辑帮助节省调整过时板式结构的时间，设计人员也只需要添加新的演示模型。Flipboard在几年前也推出了一个非常相似的模型。

Flipboard排版系统

Vox Media 用类似的想法创建了一个主页生成器。它的算法可以找到网上所有有效的布局方式，对组件库里的不同元素进行组合。再根据某些特性对每种布局方式进行检查和评分。最后，主页生成器会选择出“最佳”布局方式 ：基本上是得分最高的布局方式。这比手动去寻找这些元素更有效，推荐引擎Relap.io也使用同种方法。

Vox的主页生成器

Relap.io

储备组件和内容

设计师最无聊的工作之一是创建不同版本中普适的图形切片。这个工作需要花很多的时间，而且令人沮丧，设计师可以把这个时间花在更有价值的产品工作中。app推广平台

算法可以分担一些简单的工作，比如说颜色匹配。Yandex.Launcher用算法根据APP图标自动生成APP的配色。其他变量都可以自动生成，如根据背景色改变文字颜色，突出照片中人物的眼睛来传达某种情感，贯彻参数排版。

Yandex.Launcher

算法可以创建整个板式组合。Yandex.Market使用促销图像生成器来制作电子商务产品列表。营销人员只需要用一个标题和一个图像填写一个简单的表格，生成器据此提出了无数的不同版本，所有这些都符合设计指南。Netflix的做法更胜一筹 ，它用脚本裁剪海报中电影角色，再制作出一个风格化和本地化的电影标题，然后对一部分用户进行自动测试。Engadget已经培养了一个机器人学徒来写小工具的新闻报道。

Netflix电影广告

engadget

真正的黑魔法是在神经网络领域。Prisma app将照片风格化处理，使照片看起来像著名艺术家的作品。Artisto也用类似的方式处理视频（甚至流式视频）。

Prisma

Artisto

然而，所有这一切仍处于早期阶段。当然，你可以在你的手机上下载一个APP，并在几秒钟内得到一个结果，而不需要在GitHub资源库中苦苦寻求。但是如果没有教授给神经网络，你依然不能生成你自己的参考风格，并且得不到一个理想的结果。然而，当神经网络足够强大时，插画师就过时了吗？我想神经网络还无法撼动那些具有坚实和独特的风格的艺术家的地位。但如果你的文章或网站需要得体的插图，不要求有特殊的处理方法时，神经网络就可以处理了。

对于真正独特的艺术风格，神经网络可以帮助我们快速生成一个风格化草图。在动画片《料理鼠王》中，皮克斯的艺术家尝试将几种不同的风格运用到电影的场景和角色中，如果未来用神经网络来绘制这些草图呢？我们也可以创建故事板和运用漫画来描述场景（照片可以很容易地转换为草图）。当然神经网络还可以运用到很多地方。

最后，神经网络还可以用到动态标识中。动画在品牌化中变得非常受欢迎，例如，Wolff Olins为Brazilian telecom提供了一个动态 Oi 标识，这个标识能对声音做出不同的反应。如果没有一些创造性的协作与算法，你是创造不出这些好玩的东西。

Brazilian telecom Oi

定制个性化用户体验

如果想获得清晰和完善的需求，可以为精准的受众群体甚至特定用户制定个性化产品，如Facebook的新闻推荐，Google的搜索结果，Netflix和Spotify的推荐，以及许多其他产品。定制用户体验除了能减轻用户过滤信息的负担之外，当产品开始关心用户的需求时，用户与品牌的关系变得更加密切。

然而，关键问题是设计师在这些解决方案中所起的作用。我们很少会具备创建这样的算法的能力 —— 工程师和大数据分析师才能做到。CX Partners的Giles Colborne从Spotify的Discover Weekly这一功能看到其中的运作：这个产品中唯一的由传统UX设计的元素是播放列表，而个性化的工作则是由一个推荐系统完成，这个系统用好的音乐填充这个设计模板。

Spotify的Discover Weekly功能

Colborne向设计师提供如何在这个新时代实现其价值的建议，以及如何使用各种数据源来构建和教授算法。了解如何使用大数据并将其集成为可操作的洞察力非常重要。比如，Airbnb学会如何回答这个问题：未来某一天的预订房价会是多少？，这样老板就可以制定有竞争力的价格。Netflix的推荐引擎也可以举出无数的例子。

Airbnb

一个相对较新的术语：“ 预期设计 ”，从宏观角度说明UX个性化和用户期望。我们的手机上有类似功能：Google会使用位置历史数据自动提供回家的路线，Siri提出了类似的想法。然而，关键因素是信任。为了执行预期的经历，用户必须允许大公司在后台收集个人使用数据。

我已经提到了Netflix、Vox Media和The Grid的设计的不同版本的自动测试。算法还可以通过另外一种方式个性化UX。Liam Spradlin描述了突变设计的有趣概念，它是一个很好的自适应界面模型，可以根据特定的用户采用不同变量。

设计师的装备

我已经举了几个算法驱动设计的现实例子。那么，现代设计师需要用到什么工具呢？如果我们回顾上世纪中叶，计算机被看成是扩展人类能力的一种方式。Roelof Pieters和Samim Winiger详细分析了计算历史和增强人类能力的想法。他们提到设计工具发展的三个阶段：

第一代系统，能够模拟具有数字处理手段的工具。第二代是辅助创新系统，人和机器通过密切的行为反馈循环来协调创新过程。第三代是辅助创新系统3.0，它通过更加精准的对话、增强创新能力、并加速从新手到专家的技能获取来协调创新过程。

Creative AI

算法驱动的设计应该是产品设计师的装备：增加决策通过的数量和深度。设计师和计算机应该如何合作？

未来数字产品设计师的工作流程看起来可能像这样：

探索问题空间，并选择业务和用户需要解决的最有价值的问题（分析工作）。探索解决方案空间，并选择最佳解决方案来解决问题（分析工作）。开发、发布和推广解决这个问题的产品（综合工作）。评估产品如何为真实用户服务，并优化产品（分析和综合工作）。将解决方案与公司的其他产品和解决方案相联系和统一（综合工作）。

这些工作分成两种类型：隐式表达信息和正在进行的解决方案的分析，及其需求和解决方案的综合。我们分别需要哪些工具和工作方法？

分析工作

如果用户的隐式表达信息可以用定向研究，这种分析很难自动化。但探索现有产品的用户使用模式是可以做到的。我们可以提取行为模式和受众群体，然后再优化UX。广告定位已经开始采用，算法可以使用隐式和显式行为模式（在特定产品或广告网络内）对用户进行集群。

为了训练算法为这些用户集群优化界面和内容，设计者应该研究机器学习。乔恩·布鲁纳提供了一个很好的例子：遗传算法从对期望结果的基本描述开始。比如，优化航空公司的时间表可以节省燃料和便利乘客。它增加了各种约束：航空公司拥有的飞机数量，它运行的机场，以及每个飞机上的座位数量。它加载了自变量：现有的时间表上的数千航班的数据，或者可能随机生成的虚拟信息。通过数千，数百万或数十亿的迭代，时间表逐渐得到改善，变得更高效方便。算法还理解了时间表的每个元素（ 如37号航班从O’Hare的起飞时间）如何影响燃油效率和乘客便利的他变量。

在这种情况下，人类策划一个算法，可以添加或删除限制和变量。结果可以通过对真实用户的实验来测试和改进。利用持续的反馈循环，该算法也改进了UX。虽然这项工作的复杂性证实了分析师在执行这部分工作，设计师应该知道机器学习的基本原则。O’Reilly就这一话题最近出版了一本书。

综合工作

两年前，一个叫Autodesk Dreamcatcher的工业设计师工具很流行。它是基于生成设计的理念，生成设计已经用于性能、工业设计、时尚和建筑很多年。许多人知道Zaha Hadid Architects建筑设计公司; 它把这个方法为“ 参数设计 ”。

Logojoy这个产品能替代自由职业设计师进行简单标志设计。你选择喜欢的风格，选择一种颜色，Logojoy能生成很多不同的方案。你也可以优化一个特定的标志，查看该标志与企业风格搭配的情况，并订购一个包括名片和信封的品牌套餐。这个工具完美诠释了算法驱动的设计的运用。创始人Dawson Whitfield 描述了它背后的机器学习原理。

Logojoy

然而，机器学习还没有运用到数字产品设计，因为它解决不了实用性问题。当然，建筑师和工业设计师的工作本身有足够的限制和特殊性，但用户界面不是静态的 —— 它们的使用模式、内容和特性随时间而变化，而且变化较频繁。然而，如果我们考虑整个生成过程 —— 设计者定义规则，算法用规则创建最终对象 —— 我们可以获得很多灵感。数字产品设计师的工作流程可能像这样：

算法用预定义的规则和模式生成设计的不同版本。基于设计质量和项目要求筛选结果。设计师和管理者选择最有趣和得体的版本，进一步优化最终结果。设计系统针对一个或多个版本进行A/B测试，而人从中选出最有效的方案。

目前还不知道如何在数字产品设计中过滤掉大量的概念，因为数字产品设计的使用场景非常多样化。如果算法可以过滤生成的对象，我们的工作将变得更有成效和创造性。然而，作为产品设计师，我们每天都使用到生成设计，不管是在头脑风暴会议中，我们需要提出了几十个想法，还是当我们在屏幕模型和原型上迭代时。为什么我们不能将这部分工作交给算法呢？

JON GOLD LINK的实验

The Grid公司的Jon Gold 开发了一个实验性的工具Rene。Jon Gold 教授一台电脑做有意义的排版决定。Jon Gold 认为这与人类设计师学习排版没有差异，所以他把这个学习过程分为几步：

分析字形以了解字体中的相似性。制定组合字体的基本准则。确定字体组合的最佳示例以了解趋势。创建算法学习优秀的设计师的案例。

他的想法类似于Roelof和Samim说的：工具应该是设计师的创造性合作伙伴，而不仅仅是机械的执行者。

Jon Gold的生成设计：似真的组合

Jon Gold的实验工具Rene是建立在这些原则之上的。他还谈到了编程的命令式和声明式方法，并指出现代设计工具应该选择后者 —— 关注我们想要计算的，而不是如何计算。Jon Gold使用生动的公式来展示这如何适用于设计，并已经做了几个低级演示。你可以自己试用一下这个工具。这是一个早期的概念，但也可以让你眼前一亮。

虽然Jon Gold开玩笑地称之为“暴力设计”和“乘法设计”，但他强调了专业控制的重要性。值得注意的是，他今年早些时候离开了The Grid团队。

工具已经存在？

令人遗憾的是，目前没有像Autodesk Dreamcatcher一样可以进行分析和综合的用于网站和移动设备的产品设计工具。然而，The Grid和Wix可以或多或少被认为是质量水平过关的直接解决方案。Adobe不断添加可以被视为智能化的功能：最新版本的Photoshop具有内容感知功能，当你使用裁剪工具旋转图像或扩展画布超出图像的原始大小时，它能智能填充空白。

Adobe和多伦多大学还开展了另一项实验。它的DesignScape工具自动为你精简设计布局。它也可以提出一个全新的设计方案。

你应该去关注Adobe公司的发展，因为该公司在MAX 2016会议上发布了一个名为Sensei的智能平台。Sensei使用Adobe在AI和机器学习方面的深厚专业知识，它将为Adobe在消费者和企业产品中增加算法驱动设计功能奠定基础。在其发布会中，公司提及诸如语义图像分割的概念（显示图像中的每个区域，中间包含类型标记 —— 例如建筑物或天空），字体识别（即，识别创意字体并推荐类似字体，甚至包括手写体），以及智能细分受众群体。

Adobe Sensei

然而，正如创造“人工智能”这个术语的计算机科学家约翰·麦卡锡（John McCarthy）说到：“只要我们成功了，我们就不再管它叫人工智能了”。曾经是最前沿科技的AI现在被认为是电脑的标准行为。这儿列出几个实验阶段的想法和工具，未来可能就成为数字产品设计师日常工具包的一部分：

1.   StyLit ：从草图创建一个3D模型。

2.   自动完成手绘动画：微软公司自动完成插图和动画的实验阶段工具。

但这些仅是未来的冰山一角。现在只是个别公司为简化工作构建自定义解决方案。最好的方法之一是将这些算法集成到公司的设计系统中。目标都是类似的：自动化大量工作来支持产品线; 实现和维持统一的设计; 简化上线流程; 更容易支持当前产品。

现代设计系统始于前端样式指南，但这只是第一步（将设计集成到开发人员使用的代码中），开发人员仍然手工创建页面。下一步是使用预定义规则进行半自动页面创建和测试。

结论

这是美好的开端，但我们应该记住算法的局限性 – 它们建立在人类定义的规则之上，即使规则现在通过机器学习来提高。设计师的强大在于他们可以制定和打破规则; 所以，在一年后，我们可能将“美丽”定义为完全不同的东西。我们的行业有高技能和低技能的设计师，算法将逐步取代后者。然而，那些可以在需要时去遵守或打破规则的人将会发现神奇的新工具和新的可能。

此外，数字产品越来越复杂：我们需要支持更多的平台，为更多用户群体调整使用场景，并提出更多的假设。正如Frog的Harry West所说，以人为中心的设计已经从对象的设计（工业设计）扩展到经验的设计（包括交互设计，视觉设计和空间设计）。下一步将是系统行为的设计：决定自动或智能系统的行为的算法设计。未来不是雇用越来越多的设计师，更多常规工作都交给计算机。玩转字体的将是计算机！

译者：oftodesign

原文作者：Yury Vetrov（Mail.Ru Group的产品经理）

原文地址：https://www.smashingmagazine.com/2017/01/algorithm-driven-design-how-artificial-intelligence-changing-design/

文章作者系 @oftodesign 翻译发布于人人都是产品经理。未经许可，禁止转载。