不能错过！回顾2019年的那些重大设计球王会

　　球王会2019年是个好时机，现在是时候回顾一下今年的所有趋势和亮点了。了解设计趋势是很重要的事，这样你就可以始终以最新，最现代的外观进行设计。我们将从今年的重大设计新闻入手，这些新闻涉及了今年的标志重新设计，产品和UI改造，然后我们将着眼于视觉趋势。

　　图源：Under ConsiderationSlack在今年的重新设计中获得了最多的关注，紧随其后的是Staples。在他们的简报中，Slack提出了一个很好的观点，即倾斜的标签是可以识别的，但它过时且难以使用，因为不透明颜色的覆盖意味着标志具有11种颜色。多色的过度使用意味着它只能在白色背景下看起来很好，而且在使用上没有伸缩性。Slack由Pentagram重新设计，保留了标签的符号，同时添加了暗示聊天泡沫的元素。重新设计后不久，该公司也上市了。设计受到了批评，人们说它看起来像鸭子，像风车……从设计的角度来看，我必须同意这个观点， “从技术上，实用上，甚至从概念上讲，这都是一种更可靠的解释。”但我喜欢这个由Matteo Modica设计的风扇概念球王会，它保留了同样的本质，但又不太过分。

　　图源: Under ConsiderationStaples展示了一个疯狂的顶部标志，这个标志本身是……可能有点过于文字化，并且不太受欢迎。批评人士说，标志看起来像球门柱。我个人并不认为，这个新的标志提升了他们的品牌，我觉得旧的回形针，虽然有些过时了，但的确是一个更容易辨认的标志。

　　图源: Under Consideration我非常喜欢Twitch的标志更新。这次重新设计并没有引起太多人的关注，因为它只是一次更新，而且还因为他们的受众主要是游戏玩家。原来的标志已经很好了，他们通过简化商标的比例和阴影来提升游戏效果。我唯一的想法是，字母t在这里有点丢失，但总体来说这次的标志大胆而坚固。随着标志的更新，还进行了完整的UI / UX重新设计。黑暗的主题似乎真的引起了游戏玩家的共鸣，新的用户界面是一种现代的，Youtube风格的全白色主题。

　　这不算是重新设计，更多的是添加。有我们都知道并使用的Facebook应用，也有拥有Facebook(应用)、Instagram、WhatsApp等的母公司Facebook。这个logo是母公司的，它之前是没有logo的。渐变动画试图弥补平淡无奇的感觉，但总的来说，我还是会说它仍然很标准，很漂亮。产品和UI1.Facebook Dating

　　图源: Engadget相当低调的，Facebook发布了一款新的约会应用，可以帮你和朋友的朋友配对。这款应用程序似乎只能通过Facebook应用程序在移动设备上使用，用户可以在最上面的一个标签页问它。用户界面类似于Tinder的用户界面，并混合了聊天点，但显然两者有所不同：Tinder拥有“向右滑动”的交互功能，还可以点击放置，因此Facebook必须做一些不同于这两种功能的事情。作为对专利，Facebook很好地说明了你可以做的其他事情，并且仍然是一个成功的设计。他们在屏幕的右侧放置了“喜欢”和“不喜欢”按钮，尽管他们仍然使用“X”和“♥”，但他们让图标看起来完全不同。当前的用户界面与图片有所不同，并且它们不允许截图，因此除了在手机上打开外，无法显示当前的用户界面。我觉得对于设计师来说，这是一个非常有趣的案例研究，可以从已经具有完善模式的行业中查看其他示例。

　　Twitter old design (左) vs new design (右)2.Twitter UI重新设计新设计的特色是左边的导航，更多的空白，以及字体大小的增加。一开始，重新设计的感觉相当生硬，但你可以看到，它绝对更现代，更大的字体大小有助于可读性。专注于导航是一个不错的举动球王会，但导航部分中用于文本的较大字体有点过大，这可能使用户的注意力从页面的主要内容中分散出来。3.YouTube重新设计我注意到YouTube一整年都在不断涌现新的设计，因此它可能也不像是一个巨大的重新设计。但当你与一年前的网站相比，它的变化是相当可观的。

　　Youtube’s old home page from 2018 (左) vs design in 2019 (右)你明显会发现他们把灰色背景改成了超浅灰色。实际上，我一直以为这是白色的，直到我仔细观察它，所以现在我对这个改变的原因很感兴趣。缩略图更大，并且摆脱了蓝色文本链接标题。这一点很重要，因为它意味着在给定正确的上下文的情况下，用户可以理解这个没有着色文本链接是可以点击的。在2018年的设计中，首屈一指的内容更多，从业务角度来看，他们能够证明较大的卡片是合理的。这意味着人们在滚动浏览，而首页内容较少却没有损害转化率，这是很值得考虑的设计。

　　Youtube’s video content page from 2018 (左) vs design in 2019 (右)从2018年到2019年，他们减少了视频之间的填充，以允许更大的缩略图。巨大的浅灰色背景持续在这个页面上(你可以从标题下面看出来)，让它看起来感觉更干净。整体上很棒的重新设计。它是如此自然地发生，以至于人们甚至可能都没有注意到。趋势以下是一些脱颖而出的酷趋势。（我忽略了一些明显的模式，例如使用渐变，插图，大彩色图像等。）1.逐渐变圆近年来，圆角的吸引力越来越大，但今年可能有点太多了?圆角开始在图像和UI元素中将UI组件定义为友好且可用。相反，尖锐的硬拐角现在被认为是旧的，或者如果正确处理球王会，则被认为是前卫，严肃和复杂的。Samsung’s One UI

　　Twitter的重新设计为媒体内容提供了更多便利像三星、谷歌和Twitter这样的大品牌今年都有上榜。现如今，圆角现在在互联网上无处不在。下面是一些圆形ui的示例。

　　Google’s Product Sans font为了真正提高品牌知名度，公司已经开始制作自己的字体。它不仅为公司节省了数十万甚至数百万美元的许可和使用成本，而且是一种让用户难忘体验的好方法。现在有一些设计良好、令人难忘的字体，甚至有一些是开源的，但是如果这个品牌使用这个字体，并且只有这个品牌使用这个字体，那么你肯定会把它和这个品牌联系起来。谷歌的产品Sans诞生于2015年，但出于某种原因，在他们使用开源字体Roboto之前，它只出现在Gmail、Keep和他们的Pixel手机等应用程序中。其他一些值得注意的自定义字体:- Netflix在2018年创建了Netflix Sans- Airbnb在2018年创建了谷物- IBM在2017年创建了IBM Plex- YouTube于2017年创建了YouTube Sans- Dropbox在2017年创造了Sharp Sharps- 苹果于2015年创建的San Francisco3黑暗模式

　　我们谈论黑暗模式已经有些年头了，但它仍然在流行，尤其是今年。这一趋势来自于能够显著节省电池的吸引力，同时也能减轻用户的眼睛疲劳。随着MacOS Mojave的发布，这一趋势加快了步伐，该版本支持深色主题（包括应用程序）的系统级选项。人们很快了解到，你不能简单地把周围的颜色颠倒过来球王会，然后就算完成了，实际上需要设计暗模式。这迫使几家公司推出了暗模式更新，以使它看起来还不错。今年Twitter也推出了第二款黑暗模式。很明显，从2016年开始他们就一直使用“暗”模式，但今年他们推出了“熄灯”模式，这是一种更暗、更强烈的暗模式。4.分层导航/背景我不确定是否有一个更合适的名称来描述这种UI趋势，但是我看到越来越多的地方在做分层——屏幕以抽屉式的方式叠在一起。这些图案大多出现在移动设备上，这是一种节省空间和显示更多内容的聪明方法。我对这个概念很感兴趣，但它存在可伸缩性问题。当你打开每一层的时候，你明显的降低了观看的高度，这意味着你可以拥有的层的数量是有限制的。我很有兴趣看到这些概念的更丰富的版本，因为它肯定是有趣的和新的思维方式。我认为，到目前为止，这只适用于本地应用程序，还不适用于移动web，因为它的抽屉比较复杂。

　　From Anastasia on Dribbble桌面版本有更多的空间来显示导航，所以分层导航在这里并不常见。我倾向于看到分层的主题更多地用作品牌和创建桌面设计的视觉兴趣。

　　图源: Backdrop from Material UI Guidelines材料用户界面有一个模式叫做背景，信息从后面来。使用指南指出，“背景出现在应用程序中所有其他表面的后面，显示上下文相关的和可操作的内容。”当隐藏时，后一层是一个总结的浓缩版本。它可以用作前端层的过滤器，或者作为导航元素。它始终是持久性的，这减少了顶层的垂直空间。随着移动设备越来越大和越来越高，我们可能会更频繁地看到这种模式。5.衬线正在回归

　　2010年代是无衬线的十年球王会，我预测下一个十年我们将有更多衬线。尽管sans-serif与圆角和友好的感觉非常匹配，但人们很快意识到它看起来很通用，因为没有太多的区别空间。衬线更具可读性，因此更易于访问，可以使用较小的字体很好地工作，并且有更多的区别机会。通过增加字母形状的圆度，这种新趋势可以创造出优质但平易近人的感觉。以下是今年的一些徽标重新设计。

　　图源: Under Consideration6.“斯堪的纳维亚”色彩今年我看到了更多的“斯堪的纳维亚”色彩，它们是浅色，泥土色，米色。颜色非常中性，有各种各样的调色板，你可以选择。我喜欢它与标准的浅灰色/白色有足够的不同，但又不会太过火。下面是一长串使用这种调色板的网站的灵感清单。我真的很喜欢这种趋势，因为很快，拥有白色背景的体验就会开始看起来很普通，并融入各种风格。

　　By Levon Saribekyan on Dribbble7.定制的微交互这是一个逐年增长的趋势，每年我们都在提高微交互的标准。良好的UI和可访问性现在期望所有交互元素(包括按钮)都处于悬停状态。至少要在鼠标悬停时填充一个图标或覆盖一个深色圆圈，以表明该图标是交互式的。将功能值赋予悬停状态，例如随着用户表现出兴趣显示更多内容，将使定制的微交互更进一步。更进一步的是使动画更加复杂。这些变得非常重要，因为它通过提醒我们一个网站不仅仅是一个静态PDF并能够提供很多价值和含义来帮助提升体验。

　　By Aaron Iker on Dribbble8.拟态…或同态这种外观是一种典型的拟态化方法的未来主义现代方法，该方法正在设计类似于现实世界中的元素的元素。该效果是通过多层内部阴影，阴影和渐变来实现的。根据希望光通过的方向，阴影的一个方向会更亮，以使其具有三维外观。通过这种样式，你可以利用使某些东西看起来“受压”来区分动态状态。拟态化在今年晚些时候开始成为一种趋势，我认为到2020年它会真正受到关注。这是一种将生活带入普通的日常UI的巧妙方法。

　　By Jatin Lathiya on Dribbble2020年，我们来了我很高兴看到哪些趋势会持续到新的一年，哪些会过时。我认为，如果有什么不同的话，那就是人们对更多功能、模块化设计的期望将是关键。2019年做得很好，这又是阳光灿烂的一年。