创造性学科的趋势很容易受到关注。毕竟，没有什么创新或创新的东西来保持“热点”的标签 - 除非你这样做只是为了不断推翻这一趋势。

但事实是，创造力是一个对话。

自从我们第一次学会在洞穴墙上的赭石和木炭中重新创造我们世界的元素之后，这个对话就一直在进行中。因为我们学会了用粘土把粘土雕刻的抽象符号变成充满意义的包装 - 即语言。

趋势只是这个庞杂而混乱的多音谈话的主线。无论我们选择采取还是抵制，我们的创意选择都与这些趋势并存。

他们提供上下文。因为什么是创新，如果不是从规范的突破？规范但去年的趋势是什么？

所以，就像去年一样，我和Webflow的crackerjack设计团队坐在一起，要求他们盯着他们的VR水晶球，看看2018年的设计定义。

这就是Sergie Magdalin，Ryan Morrison，Linsey Peterson，Nathan Romero和Darin Dimitroff不得不说的。（当然还有一些我自己的想法。）

1.破损的网格布局

在设计师们对于更有创意，更有吸引力的布局的追求中，我们一直依赖的网格为我们的布局带来和谐与逻辑，本身就成为一种约束。

这并不是说，破损的网格布局完全忽略了网格的概念 - 相反，它们允许图像和文本元素漂移进和穿过通常在更清醒的布局中作为硬停止的排水沟。在这里，图像和文本的通常谨慎的框开始重叠和汇聚，往往创造出美妙的意想不到的位图和字母的并列。

插图取中心舞台

我在数字产品营销领域目睹的一个比较有趣的挑战就是图像选择。我已经看过整个设计团队仔细研究这个争论，通常结束在两个地方之一：

产品UI镜头和GIF 编辑/生活方式摄影

前者强调产品内的体验，功能和功能，而后者试图强调产品的人性层面：它对人们生活的影响。

但是到了2018年，我们已经看到并将继续看到，插图画家的工作在市场营销和产品设计方面获得了全新的重视。

为什么这个事情让我着迷，而且我不能确定它到底是什么。也许这和我们在时尚界长期以来所观察到的同样的周期性 - 毕竟，直到60年代末，插画才占据了广告世界。

或者，也许Dropbox的设计团队就这样解释他们的新插画风格：

我们使用石墨创建草图，然后将它们与丰富多彩，抽象的形状配对，将创意过程变为现实。我们的风格受到你第一次有想法的时刻的启发，并且提醒人们“只有你做出第一印记，画布才是空白的”。

我的意思是......他们不得不重新设计一些东西 ......对吗？

在Shopify的北极星网站上可以看到，插图也可以将更多的抽象概念带入生动的生活中。Shopify澄清说，北极星的设计系统是为了让每个成员都能成为北极星的指引灯。

最后，值得注意的是，插图也可以巧妙地解决摄影带来的一些代表性挑战。

我们为各式各样的人类构建数字产品 - 但是当您捕捉到真人的照片并将照片弹出到您网站的英雄中时，人类就会将您的用户变成人物。并留下所有其他用户没有代表。

相比之下，Shopify Polaris的英雄形象中所展示的人类只是一个人。诸如种族，性别，国籍等诸如此类的说明者没有定义，使我们中的任何一个人更容易把自己投入到那个孤独的思想家的角色中，思考着指引光所照亮的创造性的可能性。

3.野蛮主义达到主流地位

2017年初，我们发表了一篇文章，谈到野蛮主义的兴起，并试图回答为什么新兴的风格：

野蛮主义...正在撕开一个设计师可以做他们想做的事情的空间，而不是他们应该做的事情。这里创作的作品避开了所有的优化建议和最佳实践列表，赞成生活在震撼之中的外观和效果，有时甚至在攻势（无论如何）都是边界上。

所以你可以想象，当所有网站类型中，两个电子商务网站跃上了残酷的流行时代，

巴黎世家

古驰

4.更多的有机和倾斜的形状

自然憎恶一条直线。

威廉肯特

网络和移动设计已经被基于卡的用户界面主导了好几年了。直到最近，这些卡片大部分都是（大部分）锋利和直角的，露出了其底层divs的几何形状，几乎是现代主义者对网页设计的关注。

现在，从Google Now到Twitter到Facebook的每个应用程序都拥有他们的卡片，输入框，轮廓头像以及更多的几乎大胆的圆角。

如果这些箱子得到任何全才，他们就会是椭圆形。

这不仅是那些生长更多有机形状的主要元素。背景现在充满了几乎amoeboid斑点的颜色，戏剧对角线，甚至现实世界的破折号几乎卡通。

但是，设计师不仅仅是在无穷无尽的寻找方式中寻找有机的曲线。许多人只是简单地将这些盒子转出他们平常的90°角度，用简单的视角改变他们的设计，就像在Stripe的主页上一样。

所有这些并不是说直角走向恐龙的道路。我们也看到了几个网站的直线翻倍，并有效地与更多的有机和球形混合。

您还会注意到许多网站UI中出现“闪烁”或“ 振动 ”的颜色。虽然这些颜色组合会产生令人难以置信的惊人效果，包括在您滚动时似乎留在您的眼睛中的幽灵般的残像，值得注意的是，它们代表从易用性的角度来看易碎的领土。

虽然可访问性通常被认为是为残障人士设计一个用户友好的设计，但值得记住的是，即使是那些有色觉的人也可能会遇到困难的色彩组合。

根据LinkedIn的可访问性工程经理Jennison Asuncion的说法，可访问性可以定义为：

设计和开发包括残疾人在内的每个人都可以独立使用和互动的用户界面。

那大家是关键。

5.更普遍的互动和动画

媒体是消息。

- 马歇尔·麦克卢汉

网络不是一个静态的媒体。尽管贾斯汀·杰克逊（Justin Jackson）的“ 这是一个网页 ” 这样的作品具有持久的美丽和真实性，但网页不仅仅是在页面上打印文字。如果麦克卢汉的着名谚语含有水，那就意味着至少有一些网络信息 - 它的含义 - 在于它的运动和交互能力：网页不能简单地向我们提供信息，而是为了使信息移动，更重要的是让我们与这些信息互动并影响信息。

一切都在运动中，但从不分散注意力。

越来越多地，当你浏览网页时，信息不仅仅是提供给你的信息，而是会放到你的意识之中，并逐渐引起人们的注意。

显然，我们不应该在这里过分 - 总有潜力的动画，使其他令人愉快的经历压倒性的，特别是对于认知障碍或敏感的运动。

但是做得对，即使是一个微妙的动画，也可以在合适的时间引导访问者注意正确的内容，从而确保他们不会错过重要的副本或转换驱动形式。

把这个美丽的网站Heco Partners为Black Sheep机构建成。当您向下滚动时，“当前”行的突出显示有助于您将精力集中在写得很好的副本上。然后，一系列大胆设计的工具提示开始争夺你的副本的注意力，呼吁你停止阅读，并点击另一页。这对于构建内联导航系统的挑战来说是一个创造性的解决方案 - 但是它也会给某些用户带来不必要的经验压力。

我们也看到大量的工具可以简化更复杂的动画和交互的创建 - 这是数字设计师工具包中的一个缺口 - 从我们自己的Interactions 2.0到Airbnb的Lottie。

更具体地说，我们期待更多的两种特殊的动画模式：不寻常的滚动速度和页面转换。

意外的滚动率

现在视差可能已经过去了，但这并不意味着设计师并不想以有趣的方式将滚动链接到元素移动。

例如，以Anna Eshwood的网站为例。网站上的每张照片都会正常动作，直到您滚过它们，此时它们会快速上升，比您的滚动速度快。这给了网站一个有趣的空灵的感觉，很好地与严峻的单色照片和严重的模型。

随着互动和动画成为我们在线体验中更为突出的部分，我们期望看到更多的突破性的增加香料的冲击。

页面转换

在一个充满漂亮动画的网站中，有可能清楚地告诉我们“这个网页上的东西已经改变了”，但是从一个页面移动到另一个页面总是感觉有点奇怪，不管你在哪个网站上。

状态改变的动画可能会把你从一个页面上移开，另一个在新的页面上打招呼，但是这些动画是谨慎的，没有必要链接它们。过渡本身看起来就像是每个页面之间的其他切换：事情变得空白一秒，然后新的页面加载进去。没有什么奇特的。

但是，我们已经开始看到越来越多的网站在这个美丽的国家发生了变化。以代理3dplas网站上的这些转换为例：

在这里，页面转换保持了体验的凝聚力和品牌。当你访问一个视图库中的另一个“视图”时，你并没有太多的“导航到一个新的页面”。完成一个以设计为中心的品牌的展示，这是一个不错的层面。

6.极端主义的出现

好的设计是尽可能少的设计

- 公羊公羊

多年来，它似乎是最强大和最令人垂涎的设计反馈，你可以得到的是：“它是干净的”。

那是极简主义时代的设计世界。深受迪特拉姆斯良好设计原则以及有影响力的排版杂志“水晶杯”的影响，视觉设计师一直试图通过提供尽可能少的选择和视觉干扰来摆脱用户的方式。

而对于一个生活在数字中的世界来说，这是一个新的，难得的经验，这个选择很有意义。我们需要放松到这个陌生的新世界。  

但今天，我们有类似以下的网站 - 这是公平的警告，可能会导致癫痫发作：

针尖杂志

H.洛伦佐

Razzle Dazzle Torino

所有这一切似乎都在努力抛弃一切，从你抵达的那一刻起，厨房就淹没在你身上。

你可以把这称为一种野蛮行为 - 事实上，我发现上述所有的野兽派网站上的网站 - 但我们认为我们都可以期待说，更多的极端主义网站，甚至在你认为残酷的外面。随着我们越来越精通数字，一些网站对游客的期望会越来越高。

来自“现代汉英综合大词典”

回到非视网膜屏幕和糟糕的字体支持的糟糕的旧时代，坚持在您的网页界面无衬线字体很有道理。但是，由于屏幕和字体渲染技术 - 更不用说，自定义字体支持 - 变得更加强大，我们开始看到越来越多精细的字体占据中心舞台。或者至少，更重要的支持角色。

见证Kickstarter最近的重新设计，其特点是创作者用柔和的曲线衬托引语：

或者是改革集体的大胆的头条新闻：

在几乎任何特定的日子里，通过“狼人”滚动，将会看到几个窃听现场的衬线：

作为长期的衬线爱好者，他们能够唤起优雅，细腻和文学的光泽，我热烈欢迎我们的新脚上人。

8.浮动导航菜单

固定导航已成为以转换为中心的站点的主流（因为核心CTA可以在您滚动的时候粘在一起）或者具有庞大的菜单。通过不断地在用户的指尖上保持导航控制，这是一个简化网站体验的好方法。

最近，我们看到设计师通过从其余的网站设计中直观地分离导航，并将其移动到浏览器的Chrome浏览器下方，从而进一步推进了这一想法。这加强了这样的感觉，即导航是一个全球性的对象，不一定是任何一页的一部分，而是通过网站让您放心。  

最直观的方法是在导航栏中添加阴影，并将其移动到网站的最顶端，如Reseau上面的网站所示。但是在平坦的设计中也是可行的，正如你可以在Anchor＆Orbit网站上看到的那样。

与离网设计类似，这允许在设计中自然地（或有目的地）发生有趣的并置，这提供了有趣的创造性挑战。

9. 元素

当你试图以一种可视化的格式传达复杂的信息时，一幅静态的图像往往是不行的。毕竟，随着时间的推移，复杂性往往呈现出来 - 一个用户界面的静态图像只能告诉你它的内容，而不是如何使用它。

输入元素。

这是有力的，原因有几个：

它可以无缝地滑入设计中，而无需嵌入式YouTube或Vimeo视频的侵入式镀铬 它仍然是非常高的质量，即使有很多的颜色，渐变和图像的细节 - GIF的努力没有成倍地膨胀大小 可以循环以确保副本的细节和图像的细节保持同步，并为需要的人重复

所以毫不奇怪的是，我们看到了视频元素在整个网络上涌现，从我们自己的主页到Stripe Sigma等功能页面。

更多身临其境的“多媒体”longform

当我们想要发布longform内容时，只需要在页面上投入一个长文本字段并将其称为一天，特别是当我们的longform内容由CMS支持时，可能会很诱人，内容范围从200字以内到详细的短篇小说教程。

但一些设计师和作家们英勇抵抗的诱惑，回归的概念，特点的故事-与副本精心定制的演示告诉丰富视频，声音，图表和图形，地图的叙述铆，冗长的故事，结合自定义布局，以及更多。

公平地说，这不是一个“新”的趋势 - 事实上，我把它称为围绕网络出版的长期对话的一个基石 - 但现在所有的网络出版工具都出现了，包括我们自己，似乎就像这个方面在2018年变得更加突出的最佳时机一样。

拿CNN讲述全球变暖对格陵兰岛和世界其他地区的影响。

这个故事尽可能地把你带到那里。对于一个仍然看似抽象的问题 - 甚至是不真实的问题，这一点至关重要。它巧妙地将一个复杂的话题变成一系列容易理解的段落。你永远不会感到内容的总量不知所措，因为它不会引起注意。相反，你发现自己阅读每一个字，因为它是如此简单和吸收。

请注意，我不是在这里批评CMS：事实上，通过CMS可以提供这些类型的体验。它只是需要一点聪明才智 - 所有这个故事的视觉效果都可以通过背景图片和视频来传递，并且在编写，设计和开发这些故事的时候，要仔细关注各个故事的一致性。是的 - 与标准的“博客帖子”不同的内容模型。

值得注意的是，这些更为多样化的longform方法可以使用破损的网格或标准列进行播放，如上面的纽约时报片段所示。

11.可变的字体！

今天看网页，很难相信就在几年前，我们不得不依靠一些稀少的字体来提供我们所有的文本内容。

今天，网络充斥着各种各样的华丽字体，从而引起了版式设计，字体设计和字体消耗方面的革命性兴趣。

只有变量字体的发布才会变得更好。科技（和印刷术） - 苹果，谷歌，微软和Adobe - 最大的名字之间的联合项目 - 可变字体项目使得字体设计的全新形式。它是OpenType格式的正式补充，它：

允许类型设计者插入一个字体的整个字形集或单个字形沿着多达64,000个变化轴（重量，宽度等），并在设计空间中定义特定的位置作为命名实例（“粗体”，“浓缩”等）。

如果（像我一样）那个句子让你有点挠头，那就把注意力放在John Hudson的更直接的版本上，他说可变的字体是：

一个字体文件的行为像多个字体。

但是，在讨论字形设计等视觉艺术时，最好还是坚持视觉：

简而言之，这是一个可变的字体：一个单一的字体文件，能够在jiff中从Thin变黑。不要在CSS中调用16种不同的字体。

这将是巨大的。

12.内容中心 - 或webooks？ - 变凉

（要清楚：内容一直很酷。）

作为一名内容极客，我很高兴地看到一些美丽的，以内容为中心的网站在2017年提供了有用的，写得很好的信息的帮助。而且我猜我们将在2018年看到更多，给定所有成功的2017年的批次已经看到。

看到很多知名品牌将熟悉的门控PDF方法用于电子书发行，并充分接受网络发布长版内容的潜力，我喜欢称之为“webooks”，也令人着迷。

我指的是什么？好：

条纹阿特拉斯指南

可空的宇宙。 

13. CSS网格！

来自CSS-Tricks的Robin Rendle的CSS网格演示。

正如Robin Rendle雄辩地把它放在CSS-Tricks上：

那么，CSS Grid是第一个真正的网页布局系统。它被设计用于将内容组织到列和行中，最终使开发人员几乎可以像上帝一样控制我们面前的屏幕。

提示邪恶的笑声。

注：Webflow 将支持CSS网格，但没有官方的日期呢。

14.追求完美的数字设计工具

对于深入讨论设计工具的性质以及它们对我们工作的适应程度而言，2017年是一个伟大的一年。

Spectrum的Bryn Jackson提出了他的理由：

设计和工程工具之间的中间格式，可以为产品团队和设计人员提供更高效，更强大的工具。

在一篇名为“ 界面 ”的文章中，他继续假设：“现在每种流行的设计工具都是为插图而优化的。

（尽管应该指出的是，他将“插图”分类为导致“图像，图标，插图，字体，广告，印刷媒体或其他没有本地交互性的可视通信媒介”的任何设计工作，这是一个有争议的断言。毕竟没有阅读和看到互动的形式？）

除了插图和交互性的定义之外，我们不难看出杰克逊的观点：从根本上说，大多数现代设计工具都注重图像的制作，而不是接口。  

设计师兼工程师Adam Michela在“ 我是Facebook的设计师，这是今天的设计工具中缺少什么 ”中出现了许多相同的注释。在那里，他认为大多数设计师花费绝大多数时间来创建很少的工件没有任何实际价值，因为它们只是代表最终产品 - 与上述表述快速分离的数字界面。

他以一个充满希望的笔记结尾，说“有机会创造融合（而不是桥接）设计和实施的工具。”

这正是我们正在Webflow中构建的。像MICHELA，我们设想一个设计交付不是一个网站的示意图，但是是网站本身。不是接口的文档，而是接口本身。不断发展与网站完美同步，但不断产生的版本的时间表，可以检查，甚至点击一个按钮恢复。

我们现在还不是那么完美，但是在你的帮助下，我们正在朝这个方向前进。

15.多样性和包容性作为设计挑战

Webflow是平等的雇主。我们致力于建立一个团队，在这个团队中，思想和身份的多样性不仅受到欢迎，而且受到鼓励。

- 我们的工作列表

在Webflow所在的美国，日益激烈的政治气候正在推动对多样性和包容性在设计中的作用的强烈关注。

我们承认，设计选择，因为看似很小的决定性别的下拉列表中包含哪些选项-甚至包括性别的下拉列表中的话-不管深深地我们的许多同胞的。我们再一次看到 - 错误消息的措辞和数据验证的机制在人机交互的动态中有多强大。我们意识到，让种族成为广告工具的过滤器，可能会产生彻头彻尾的种族主义效果，从而维护我们中许多人希望看到颠倒的现有权力关系。

而且我们意识到，如果我们的团队没有多元化和包容性，我们的设计解决方案也不可能。

无论如何，我们中的一些人。

另一方面，我们也看到性别偏见在矛盾和边缘化的方式背后丑陋的头 - 把我们通常认为主要是良性的对话，如提供反馈，成为双重标准的明显例子。   

最终，作为用户体验（UX）专业人员，我们的工作是为每个人提供一个可用且理想愉快的体验，而不管他们的具体情况如何。

换句话说，我们的工作就是包容。让我们把2018年作为我们所有人关注最充分的工作的一年。

16.“转到视频”播放

尽管我们几乎没有人要求视频成为网络出版媒体，但出版商仍然对交换机持乐观态度。

你无处不在：从那些实际上坚持你观看视频的新闻网站，而不是读到由第一个Snapchat，然后是Instagram，最后是Facebook推送的短消息“故事”。Excel很快就会跳上这个潮流！

但是像科技领域的大多数事情一样，这不是一个中立的发展。成千上万的新闻工作者在文本和动态图像之间失去了工作。

对于交换机的网站来说，前景可能不是那么好。根据哥伦比亚新闻评论：

视频转播的出版商在仅仅用了一年的时间就把大部分来之不易的本土受众放弃了。

独立新闻正在遭受痛苦 - 特朗普 - 感谢，但转向视频并没有完全帮助。

值得一提的是：Digiday认为，“视频每千次展示费用远高于展示每千次展示费用”（每千次展示费用为“每次展示费用”）。在一个理想的世界里，这意味着报纸可以摆脱在他们的故事中包含更少的广告。

但当然，这不会发生。

面对这一切，值得记住文本作为创造性和信息媒介的优势：

生产速度相对较快 这很便宜 它仍然是网络上大多数通信的主要格式

最后一点可能会让你挠头。但是，我鼓励你跳到任何主要的社交网络，并滚动。除非你点击Instagram，Pinterest或Snapchat，否则你可能会看到大量的文字。即使在这些视觉上的第一个平台上，文本仍然起着关键的支持作用。

因为虽然一张图片在拍摄一个场景时可能“值得千言万语”，但是他们很少能够捕捉到背景 - 那些使图像有意义的人物，时间，地点，原因和方式。

这导致我们自然而然地对我们的下一个点：

17. UX用户的兴起还在继续

任何影响设计的人都是设计师。这包括开发人员，首席财务官，甚至是法人。所有的设计师。

- 假腿

我在去年的设计趋势篇中谈到了这一点，但今天我想更多地关注“UX写作”这个门徒的兴起。

简而言之，UX作家专注于用户界面中的内容，主要面向更大的数字产品和Web应用程序。现在，当我解释说我为Webflow这样的公司编写产品内容时，以及在过去的LinkedIn中，人们都有一个非常明显的倾向，就是说什么？

但是请放心：用户界面充斥着书面内容。这些内容往往在你的理解中扮演着重要的角色：

你可以在UI中做什么 如何做这些事情 你可能遇到什么限制和复杂性

但用户体验写作可以做的比这更多。界面中的词语也可以成为塑造我们最喜爱的用户界面背后品牌认知的有力工具。试想一下，在网络应用程序中，您看到的所有微博突出显示了一个令人喜欢的复制行，或者所有404页的陈述都带有机智的消息传递，旨在在不太理想的时刻推动行动。

这在被称为chatbot的UI格式中变得最明显。一般来说，这些UI只包含单词。单词成为用户界面。chatbot的个性或品牌只能通过语言表达。也许有一些精心挑选的表情符号被扔进香料。

作为一名经验丰富的用户体验作家，我很高兴看到这个关键角色得到了更多的应有的认可。

我们也是设计师 我们只是在音节和字母表中工作。我们等不及要和你一起工作。

18.设计。系统化。

现在，设计已经赢得了“地位”，谈话已经从价值主张转向更成熟的分析，即如何使设计的成功在品牌的许多产出和环境中更具系统性，可扩展性和凝聚力。

设计系统专注于将品牌美学和功能方法转化为模块化组件，这些模块化组件可以混合搭配以满足（理想情况下）任何UI的独特需求。当一个设计语言被系统化时，它简化了决策，缩短了开发时间，并且使设计人员能够在尚未建立设计模式的高端项目上工作。

品牌是平常的趋势之一。UXPin推出了系统，一个创建和维护设计系统的工具。Shopify推出Polaris以其独特的内容，设计和开发指导方针（我感到非常热情）的高度赞誉。UX Power Tools推出了一个试图使Sketch成为可行的设计系统工具的库（我们将会看到！）。

期待看到很多更多的这个在2018年。

19.原则 - 首先设计

设计界一直痴迷于鸡与蛋的辩论之一：内容优先还是设计优先。

我一直在争论的内容第一方面。而不仅仅是因为我是一个“内容人”。对我来说，在决定如何打包之前，确定这个信息似乎是纯粹的逻辑。

但最近，由于我已经从设计特定交付品的内容策略转移到更多系统导向的工作（品牌级内容策略），我正在想到我们的工作不应该从设计或内容开始。

它应该从原则开始。

其他一切 - 看起来如何，它是如何工作的，听起来如何 - 都应该从一系列明确定义明确的原则出发，并依赖于这些原则。

或者像Shopify高级用户体验主管Amy Thibodeau在她的美丽文章“定位北极星”中所说：

如果系统是为了实现真正的工作而创建的，它应该反映一个组织如何做事，以及它的价值。例如，一个不包含任何原理或内容方法的设计系统，在实际的日常工作中可能不会优先考虑这些事情。

原则为所有其他决策提供了一个框架，从主角的副本应该多长时间到内容的背景是什么形象。毕竟，品牌是建立在原则上：一个使命，一个愿景和一个承诺。这些事情中的每一个都需要潜在的信仰来激发他们，使他们与他人相关。

换句话说：原则提供了原因。

例如：在Webflow，我们的使命是授权设计师，企业家和创意专业人士将他们的想法带到网络上。这个使命注入了我们所做的一切，从Ryan为我们创造的审美方式，到我设计的语音和音调标准。

正是这些标准指导了我们的初稿，相互通报了我们的反馈意见，并希望每篇博客文章，电子邮件，营销页面等内容都充满。到目前为止，这是一个很好的起点。

你认为2018年的数字设计将如何？

每当我把这些名单中的一个放在一起，我就不知道我能说多少 - 还有我的年度+1的限制迫使我优先考虑。

这就是为什么我放弃了一些显而易见的力量，比如我们去年提到的 AR和VR，迄今为止对网络的影响有限。考虑到这一点，你会添加到这个列表中？ 

（请注意，如果您在评论中包含链接，则会将其标记为可能的垃圾邮件，因此请放弃链接 - 给我们足够的Google通讯录，我们应该顺利通过。）

嘿，谢谢你的阅读。