一、尽量减少用户等待的情况，尽可能缩短等待的时间

如当用户浏览网页的时候，若在用户浏览到已加载内容的倒数第5条再预加载10条内容，可缩短用户浏览接下来内容时的加载等待时间。再如生活中医院的预约挂号系统，用户可以提前一两天挂号，当预约时间到了直接到指定科室看病，避免了长时间的排队挂号。

二、如果是不可避免的等待，该用什么办法去优化等待体验呢？

总的原则是：在用户等待时给予用户反馈，告知状态，且尽量让用户在感知上缩短等待的时间。反馈可根据等待的预估时间不同、场景不同，选取不同形式。

• 一般情况下理想的响应时间应该控制在 100 毫秒内，一些响应的时长可允许达到1秒，绝不可超过2秒无反馈。

• 若是等待响应时长为2-9秒时，可设计循环的加载动效（loading），告知用户正在加载中。

• 若是等待响应时长超过10秒时，可设计带有进度指示的加载动效。此时除了告知用户正在加载中（即告知等待原因和当前状态），还要告知用户预期响应的时间。

可采取分步响应用户的方式，多次反馈，可让用户在感知上缩短等待的时间。

如一些页面内容较多，加载时能分步显示，可按照框架、文本、占位图、图片的顺序加载显示，会在感知上缩短加载时间。又如加载一个新视频，视频前几帧优先显示最小体积的视频资源，等较高清视频内容加载出来时再切换为高清视频资源，可缩短用户等待视频开始播放的时间。

唐纳德诺曼提出过排队等待的6个设计原则，可以很好地帮助我们设计等待体验，6个原则分别是：

（1）提供一个概念模型。

（2）使等待看起来合理。

（3）满足或超越期待。

（4）使人们保持忙碌。

（5）公平。

（6）积极的开始，积极的结尾。

下面我们就说说这6个原则在优化等待体验上的运用：

1. 提供一个概念模型

概念模型是帮助人们把复杂自然现象转变成可用的，可理解的心理模型。概念模型可以帮助用户理解事物，了解事物如何运作以及当前处在哪个阶段、理解当前为什么处在等待状态，以及产生对未来即将发生事情的预估和期待。

如用户通过饿了么下单后，app上会用插画显示商家备货、骑士送货的过程。让用户了解外卖送到手中的整个流程，以及当前处在流程的哪一阶段，距下一阶段预估还有多久。如果是雷雨天，订单页面的插画还会模拟实时天气情况，用户看到插画想到骑士正在雷雨环境下送货取货，也会理解骑士配送辛苦、理解当前配送缓慢，缓解等待时的负面情绪。

2. 使等待看起来合理

使等待看起来合理，即通过概念模型使用户理解为什么要等待，明白等待是有缘由的。

如用滴滴打车时，当我们按下呼叫快车按钮，页面会显示动效光波信号向外扩散，同时会显示当前排队人数。设计师通过设计建立一个简易的概念模型，让用户理解当前的等待的原因，并认为等待是合理的。实际上滴滴派单的算法流程可能与页面显示的流程不同。但用户等待时会理解此时手机正在发出信号请求驾车信息、或此时正有多人在排队、或此时正在等待司机接单。

3. 满足或超越期待

满足或超越期待指用户给等待时间估算时长时，如果用户实际的等待时间比心理预期的等待时间要短，用户会有相对比较好的心理体验。

心理学专家曾做过一个实验，同等时间下，同样长度的进度加载条有三种进度显示方式：进度条速度匀速、速度先快后慢、速度先慢后快。三种相比较发现，当进度条增加速度先慢后快，用户的体验最好。而用户体验最差的是加载速度先快后慢，因为如果开始的时候加载速度比较快，用户一开始就有了较高的心理预期，当速度变慢时便低于用户的心理预期，感知体验就会变差。

4. 使人们保持忙碌

使人们保持忙碌即让用户在等待的时候有事可做。因为当人们非空闲时，对时间的心理感知会比空闲时对时间的心理感知要短。

利用这个原则的设计如：CorelDRAW软件下载安装时，软件安装等待页面除了显示进度条还放映国际优秀设计图片，CorelDRAW用户一般都是设计爱好者或设计从业者，通过让他们浏览优秀设计图片来度过软件安装时间，避免用户纯空闲等待。

5. 公平

当用户正在等待时，如果等待看起来是合理且公平时，不易引起用户的负面情绪。如果等待看起来是不公平的时候，更容易引起用户的负面情绪。如：当你正在排队买票时，同等条件下，你看到后来半小时的人比自己先买到了票。你可能会抱怨，“为什么比我晚来半小时的人都排到了我却还在等”。

针对公平方面的设计如银行的叫号办理业务系统。用户统一到取号机前取号，每当一个窗口的空出来，叫号系统便叫一个最早的号去该窗口办理业务。这比人们直接分散在多个窗口排队会更公平，不会出现早来却因为这个窗口排队慢而导致等待时长比晚来的用户更长的情况。同时把多个小队伍变成一个大队伍，用户感知上也会觉得队伍移动的更快，也有助于降低等待的负面情绪。

6. 积极的开始，积极的结尾

德国心理学家艾宾浩斯曾提出系列位置效应，指记忆材料在系列位置中所处的位置对记忆效果发生的影响，包括首因效应和近因效应。（来源：百度百科）即人们回忆体验时，在最开始和最后的体验比中间的体验更能让人印象深刻。所以当我们在设计等待流程时，要保证等待开始和等待结束时有较好的体验。

如当我们在餐馆排队结账时，一些餐馆结账台旁边会放着一盘薄荷糖，收银员帮用户办理结账时会对用户说可以拿几颗薄荷糖。这个小奖励会让用户走出餐馆后对刚刚结账时排队等待的不好体验的记忆变弱，而对最后的薄荷糖有更深的印象，从而对餐馆也留一个相对好的印象。

关于等待体验的优化设计案例还有好多，但基本的设计原则是相通的。

我们在实际设计时可先整理用户整个体验流程中可能等待的点，看看哪些是可以通过设计或技术缩短实际等待时间的。针对不能缩短实际等待时间的点，我们先预估每个等待的时长，并设计概念模型让用户理解等待的缘由且能预估等待的时间，且采取合适的方式让用户在感知上尽量缩短等待时间。

蓝蓝设计建立了UI设计分享群，每天会分享国内外的一些优秀设计，如果有兴趣的话，可以进入一起成长学习，请扫码蓝小助，报下信息，蓝小助会请您入群。欢迎您加入噢~~希望得到建议咨询、商务合作，也请与我们联系。

蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务

导读

你的设计是否能被理解？为什么设计的价值总是不被人认可？

设计不仅仅只是带来美感，好的设计能够为产品、公司甚至整个社会创造巨大的价值。而在创造好的设计这个过程中，最重要、也是最容易被人忽视的，便是设计思维。

何为全局性设计思维？它能够为设计师带来哪些价值？本文将从设计的本质出发，结合设计的发展趋势，带你了解全局性设计思维的真正力量。

目录

写在前面

一个习惯性的序

一、我们为什么需要设计思维？

二、下一个时代在哪里？

三、互联网“下半场”，从大势中看变化

四、设计思维的转变，差异与融合

五、探寻全新的思维方式

六、全局性设计思维概述

七、如何运用全局性设计思维？

八、以全局性设计思维，构建设计体系

九、文章预告

末

-

写在前面

这篇文章的主要内容，来自我在19年底的一个沙龙分享。整个分享以设计思维的角度入手，讲述了全局性设计思维的来源和重要性，以及我是如何在不同产品线上去运用这种设计思维的。

何为全局性设计思维？为什么要讲这种思维方式？

这是我一直在探索并实践的一种设计思维。从最开始的理论雏形，到各种项目的实践，不断进行修正和完善，最终形成了一套卓有成效的思维方式。通过这种思维方式，我逐步帮助产品解决了许多长期性的问题，并最终构建了各种不同类型的设计体系。最终，随着品牌矩阵与产品体系的落地，形成了一个完整的网易智慧企业设计体系。

网易智慧企业设计体系

因为篇幅原因，本篇文章将重点从理论层面阐释全局性设计思维的导论、价值及使用方式。而具体的实战案例，我之后将会以另外几篇单独文章的形式进行展现，并详细讲解在设计过程中的一些细节与过程。希望能够帮助大家更深入地去理解如何根据不同的场景正确地去使用这种思维方式。

未来可能会包含以下几篇文章：

全局性设计思维 | 如何打造强大的品牌体系

FishDesign组件库 | 从零到一构建企业级UI组件库

全局性设计思维 | 如何构建事业部级大型设计体系

当然，目前的设计体系仅仅只是一个开始，未来还有很长的路要走。

希望本文能够给为你带来小小的启发，让设计思维帮助你更好地发挥设计的价值。如果你对某一方面特别感兴趣，可以直接跳到这一章进行阅读，无需浪费过多时间。如果你有任何疑问，也欢迎随时与我交流。

✨

一个习惯性的序

-

“喵呜～”   我又出现了，那个爱写序的装逼作者。

这次把序放在了第二段，这样子看上去就不那么不务正业了哈哈。当然，写序更多的是为了记录生活，希望每一篇文章不仅仅只是传递知识，更是一篇有温度的文章。

经历了风风雨雨的2019，又度过了魔幻版的春节，我终于又开始正式地写文章了。但这次不同，我拥有了两只可爱的小伙伴——汽水和芬达。汽水8月18出生，芬达8月20出生，现在都已经是肥肥壮壮的两大只了。。

汽水总是在我码字的时候，睡在我的键盘上，或者以各种姿势吸引我的注意力。。  为啥拖了这么久才写写完文章，除了懒以外，汽水大概也要背点锅，哈哈。

整个2019年中，经历了很多事情，人生观也随之发生了些许变化。

从并肩作战的同事的不断离去，到逐渐需要考虑团队的发展。从单打独斗闯天下，到思考如何让整个团队更加优秀、如何建立完善的设计体系等等。

角色、心态、责任，以及如何坦然地面对自己。

活在当下，用心生活。这是我一直当作座右铭的语录，也是我希望给自己的承诺。总是试图去尝试这种状态，但却异常艰难。像我这样的人，看上去总是“积极向上”，总是“规划未来”，总是希望事事完美，强迫着每个细节的完善。但不知不觉中，人生好像开始进入了“自动驾驶”的模式，活在了过去的思索中，活在了未来的规划中，唯独对于当下异常麻木。

这并不是我想要的生活，我开始尝试做出改变。

偶然间，通过一些书籍，我开始尝试正念禅修。感受每个呼吸中空气的流动、感受身体的每个部分、感受当下空间发生的每一件事情。虽然只是很浅显的境界，但正念依然对我产生了巨大的影响。我开始重新地审视自己的人生，审视自己的生活状态。

网易蜗牛图书馆：与快乐的小伙伴们

这种感觉，就像再次地呼吸了新鲜空气一样。

我们其实只存在于当下的时空中，过去和未来，并非真实存在的事物。回想一下，我们有多久没有像小时候一样，完完全全、毫无杂念地享受在当下的时光中了？

用心活在当下，平静地接纳一切发生的事物，这种感觉真是太美好了～

✨

一、我们为什么需要设计思维？

-

对于设计师来说，什么能力更为重要？是设计这门“技术”本身，还是思考如何去设计的“思维”能力？

对于不同的设计师来说，一定会有不同的答案。

这两种能力本身并不矛盾，他们相互影响，互相促进——就像“术”与“道”之间的关系。设计能力决定了设计作品的输出质量，而设计思维则决定了你思考问题、解决问题的能力。

然而，在现实的大环境下，“术”的重视程度远高于“道”，造成了很多设计师与日常业务的“分离感”。以至于，多数的设计师，无法将自己的设计能力有效地用于日常业务中；抱怨他人不理解设计，也因此错失了许多机会。

重视设计美感，其实并没有问题。视觉是最直接的表现方式，我们从最初开始喜欢这个行业，并最终成为设计师，大概都是因为如此。包括我个人，也是美感的极致追求者，常常为了几像素的细节，调整无数稿。也常常沉浸于自己的作品无法自拔emmm…

但是，美感之后，设计还需要什么？

路易斯·沙利文曾讲过：“形式追随功能”。而功能存在的意义，则在于解决问题。视觉的形式、美感，很多时候只是包裹在外侧的表层，而解决问题才是设计真正的核心。视觉的表现，一定要遵循解决问题的方式，向用户传递恰当的信息，最终引导用户以此来解决问题。

因此，我更希望更多的设计师，在追求美感的同时，能够重拾设计思维本身，寻找设计最根本的价值。

我们其实可以站得更远一些。学会去理解事物，学会用设计去解决问题。再以此为基础，通过你的设计能力去塑造它、点亮它，让它成为一个真正美好而又有价值的设计。

而设计的价值，将会成为你的价值。

✨

二、下一个时代在哪里？

-

互联网时代中的数字产品设计，需要什么样的设计思维？或者说，当下我们需要什么样的设计思维？

这个问题的答案，好像一直在变。

互联网本身便是一个新的形态，1989年“万维网”发明，1996年中国引入互联网，到今年已经有大约24个年头。我们经历了不同的互联网时期，而“设计”的概念也一直在变化中。

Internet 1.0 PC互联网时代。在这个时代，我们将大量的信息虚拟化，并通过网络进行信息传递。而我们的“设计师”们大多被称为“美工”，我们的“设计思维”，便是将信息变得更好看。

Internet 2.0 移动互联网时代，或者称为消费互联网时代。自从2007年乔布斯发布第一代iPhone之后，叠加4G、wifi等技术，手机成为日益重要的终端，世界逐渐进入了移动互联网时代。伴随着iPhone与其应用的出现，乔布斯让所有人理解了“用户体验”的重要性。我们不再是“美工”，我们变成了“UI设计师”、“交互设计师”。而这个时代，我们的设计思维变成了“用户体验思维”。

那么，下一个时代在哪里？我们的设计思维又将如何转变，才能适应下一个时代？

✨

三、互联网下半场，从大势中看变化

-

1.红利消失、增长触顶，互联网下半场到来

最近几年，我们已经能够明显地感知到——互联网的“寒冬”真的来了。随之而来的，便是互联网的发展方向似乎也正在发生变化。于是大约从2017年开始，互联网圈内逐渐出现一个新的名词——互联网“下半场”。人们普遍认为，中国的互联网将会由消费互联网时代进入下一个时代，即互联网下半场。

我并不完全认同互联网”下半场“的称呼。互联网本身是一个年轻的行业，中国互联网“下半场”，其实更像是互联网发展方向转变的标志。

因此，我们认为的下一个时代的方向，也许将会是Internet 3.0——即产业互联网时代。

互联网会什么必须要进入下一个时代？

对于互联网企业来说，一方面在成本端，随着人口红利消褪，劳动力价格上升，企业的成本将逐渐升高，倒逼管理者使用系统和工具来提高效率；另一方面，在收入端，野蛮增长的时代结束，增量经济转向存量经济，红利经济转向效率经济。

在“成本”与“效率”的双重压力下，再加上整个市场经济的下行周期，整体经济出现下滑，而一些依靠融资的互联网公司将难以为继。因此企业不得不寻找方式来提升效率，降低成本——而这正是企业级软件（ToB产品）最擅长的地方。

因此，在互联网寒冬之下，ToB市场便理所应当地开始被重视。

让我们纵观整个中国市场的发展，互联网的兴趣虽然促进了消费领域的蓬勃发展，但产业领域的发展则因此受到了巨大制约。中国率先从消费端、从第三产业开始数字化，然而在第一、二产业的数字化进程似乎并不是很快。一个重要的原因是，人口红利促使了消费互联网的快速发展，而这种红利让人们忽视了产业互联网的重要性。

在寒冬之下，我们终于发现，消费互联网蓬勃的基石，正是底层坚实的产业互联网。产业互联网如果不能得到有效的发展，则整个市场经济将无法更进一步的发展。

因此，产业互联网时代的到来，是中国互联网发展的需要，也将是大势所趋。

2.ToB市场将迎来机遇

产业互联网的发展，需要依托B端领域的发展，并逐步融入并带动整个产业进入互联网时代。那么，B端产品在中国目前处于一个什么阶段呢？

对于整个中国的ToB行业发展现状，大多数的人并没有一个清晰的概念。盘点中美上市的科技公司会发现，美国toC领域与toB领域市值之比是6:4，但在中国这个数字是20:1。

虽然互联网的整体环境不同，但中国ToB行业的发展，显然是落后太多了。于是乎，2018年开始，BAT大举布局，PE、VC加速进场——中国B端产品已经逐渐进入必须发展的时候了。

中国市场已经坐拥全球最发达的发达的消费互联网体系，而产业互联网的发展则却严重滞后。

同时，对比B端中云计算领域的IaaS、PaaS、SaaS三层架构，全球市场中SaaS占据了52.5%的份额，在中国却是IaaS分走了最大的蛋糕，占比达61.2%。中国市场VC的投资总额已经与美国相当，在SaaS领域美国企业获得了全球70.1%的融资，而中国只有11.7%。

因此，在互联网下半场，相对于ToC行业的触顶，ToB行业将会迎来历史级的发展机遇，随之而来的将会是产业互联网时代的逐渐到来。而在整个B端产品的类目中，SaaS产品作为企业级软件中最集成的产品，也将随着这股浪潮迎来爆发式的增长。

什么是SaaS产品？很多同学并没有接触过B端行业，平时用到的也都是C端产品，所以对B端产品的了解比较少。在B端行业最热门的云计算领域中，目前普遍会分为三层架构。SaaS（Software as a Service–软件即服务）；PaaS（Platform as a Service–平台即服务） ；IaaS（Infrastructure as a Service–基础架构即服务）。

附：云计算领域，三种不同的架构与对应的服务。

PaaS基于IaaS实现，SaaS的服务层次又在PaaS之上，三者分别面对不同的需求。越往上层，产品的集成度越高，提供的服务也就越丰富，而用户所需要的自行解决的东西就越少。而最顶层的SaaS产品，便是用户可以直接购买并使用的云端产品。

我们为什么要了解这些趋势？

因为一个新的时代，对应一场变革，也将成为一次新的机会。不管是SaaS产品还是其他B端产品，都将在新的时代中逐渐得到重视。而C端产品的发展策略，也将迎来新的变化。对于许多设计师来说，这将会是一个新的机遇。

顺势而为，方能乘势而上。

✨

四、设计思维的转变，差异与融合

-

那么，在逐渐到来的产业互联网时代，设计师需要注意哪些东西？设计思维又将进行如何转变？

产业互联网时代，意味着B端产品将得到重视，并与C端产品逐渐趋于平衡。因此，了解设计思维的变化，我们首先要从B端与C端产品之间，在产品设计与产品策略之间的差异性说起。

1.服务对象的差异性

从服务对象来看，C端产品的服务对象是人，产品的目标是针对人们生活方式进行的变革、升级。而B端产品的服务对象则大多是企业，目标是帮助企业进行商业效率的提升，从而产生价值。

服务对象的差异性，决定了产品在发展策略也将存在着较大的差异性。

2.产品“打法”上的差异性

从宏观的打法上看，消费互联网时代会更求“快”，而产品互联网时代则会更偏“稳”。

C端产品的服务对象是人，而人的需求在个体差异性上相对变化较小，这就决定了C端产品通常都拥有广阔的用户市场。

因此，消费互联网时代就像是资本在辽阔平原的角逐，长驱直入。讲究快速占领市场，不断地试错、不断地调整。从团购到直播，从打车到短视频领域的兴起，再到最后的单车大战落幕。消费互联网时代的每一次风口，都伴随着各种“游击战”式的竞争。入场速度、快速调整能力、资本深度，都直接影响了最后的结果，而最终的结果也往往是胜者为王，败者将快速地被市场淘汰。

B端产品的服务对象是企业，而企业间的需求差异性则非常巨大，这就决定了B端产品通常需要较强的纵深能力。相对应的，其用户群里在总量上就比较小、但也相对稳固。

因此，产业互联网就像在崎岖丛林的蹒跚前行，渐次演进，如同一场旷日持久的拉锯战。一方面，产业互联网的链条非常长，需要长期的深耕、积累才能逐渐站稳脚跟。而这也导致了产品的壁垒足够深厚，同类产品在短期内无法快速跟进。另一方面，企业间的差距需求的差异性非常大，因此产业互联网存在非常多的细分市场，不同的产品各自在不同的赛道中深耕。而其最终的结果往往是百花齐放，各自盛开。

3.整体行业的协同发展

虽然整个市场都不断地强调——ToC增长触顶，ToB是一篇蓝海。但这并非是“取而代之”，而是逐渐走向整体的“协调发展”。中国ToB的发展的一个重要根基，其实是“中国拥有世界上最成熟的消费互联网体系”这一巨大的优势。

因此，ToC在很长的时间内，仍然会是互联网的主力，而ToC市场的转型，也将有赖于ToB产品所提供的服务。

而随着中国将“互联网+”政策上升为国家战略，更是明确了以互联网带动传统产业的发展方向。因此，互联网的下半场，即产业互联网时代的最终形态，将是互联网与传统行业的“融合式发展“。

ToB产品将会成为带动互联网下一轮发展的核心驱动力。一方面帮助ToC领域完成转型，进入更健康、更稳健的发展阶段；另一方向，ToB领域赋能传统产业与互联网相融合，并最终完成产业升级。

4.产品形态的融合与趋同

整体产业的融合趋同，意味产品的特性也将互相融合。一个很重要的现象是：C端产品逐渐变得不那么C端了，而B端产品也越来越变得得不像B端了。

比如C端产品的主流赛道中，随着头部产品的赛道日渐趋于稳定，其产品体量也因为业务扩展而不断增加。同时，因为产品体系的逐渐形成，为了服务更多的C端用户，会有越来越多的B类用户进入平台，而为了满足B类商家的需要，产品的B端属性变得越来越强了。

而随着B端产品的不断受到重视，原先不被重视的产品UI、用户体验也逐渐在B端产品中得到加强。B端用户虽然服务于B端，但使用者终究是人。而随着竞争的不断加剧，原来的“重功能、轻体验”思路逐渐式微。我们逐渐发现，许多B端产品长的越来越像C端产品了，甚至在UI和体验层面做的与C端产品不相上下。

因此，随着产品属性的融合趋同，意味设计思维势必会与消费者互联网时代存在差异。而我们的设计思维将不仅仅局限在诞生于消费互联网时代的“用户体验思维”。我们需要更新的、更广阔的设计思维，以满足下一个时代的产品发展需要。

那么，新的思维是什么？它将从何而来？

✨

五、探寻全新的思维方式

-

从整个市场的协同发展，到产品形态的融合趋同。那么，我们的设计思维需要如何进行相应的变化？是同样进行“融合趋同”，还是另辟蹊径，寻求新的视角？

1.关键词提取

首先，不管设计思维如何变化，它一定需要同时满足两种产品设计思维的特性。通过前文的分析，我们可以在产品设计特性的维度，提取各自的关键词进行分析：

产品体验：诞生于消费互联网时代的用户体验思维，在产业互联网时代依然是产品设计中最重要的部分。无论是C端还是B端产品，用户体验必然是产品的核心竞争力，只有足够好用、好看，产品才能获得更多用户，最终获得商业上的成功。

灵活性：在消费互联网时代，在激烈的竞争中，C端产品的灵活性的打法对于产品的突围至关重要。而未来的B端产品竞争将会加剧，这就需要B端产品也逐渐需要较强的灵活性。

成长性：产品的发展必将伴随着不断的变化，特别是具有一定体量之后，产品设计的成长性将至关重要。因此，产品的设计是否能够预见未来发展，满足不断变化的产品形态，伴随着产品不断地成长，也将成为产品是否能够持续获得成功的关键因素。

产品效率：因为产品服务对象的关系，B端产品一直是产品效率的代名词。而在人口红利消失与经济下行的压力下，产品效率将成为所有企业关注的重要因素之一。产品的效率不仅影响着企业的成本，也是产品竞争力的重要体现。

这四个关键词，将会是我们在未来所需要关注的四个重点关键词。越是往左，则“C”属性越强，因为它更多地从用户的角度出发，更关注用户体验。而越是往右，则“B”属性越强，因为它更多地从企业的角度出发，更关注企业的长期发展。

2.跳出单一层面，寻求新视角

在四个关键词中，我们会发现，特性越是靠右，其所需要的整体性就越强。要满足灵活性，就需要用户体验与产品策略相关联。要满足成长性，则要进一步结合底层的开发能力。而产品效率的提升，则需要产品的设计与不同层面都有着紧密的耦合。

在互联网设计发展的过程中，我们从单点只关注视觉表层的“美工时代”，逐渐发展为关注线性的“用户体验思维”。在对于产品用户体验层面，确实有着长足的发展。

但是，单一层面的用户体验思维，在逐渐成熟的互联网时代中，逐渐显示出了一定的局限性。我们的价值局限于单一的体验层面，我们似乎无法对产品形成更大的影响力，也难以为产品带来体验之外的更多价值。

因此，设计思维想要满足新时代的需求，就需要同时满足前文提到的四个关键词。这就要求我们需要跳出单一层面，以全局的维度去思考产品的设计。

因此，全局性将成为未来的关键，我暂且将这种思维方式称为——全局性设计思维。

✨

六、全局性设计思维概述

-

全局性设计思维，即在设计过程中，始终能以更高的维度去审视全局，思考当下的设计。

何以全局，如何跳出单一层面？这种思维方式的前提，是你要首先了解整个产品（亦或是物体、组织等）的运行方式，清楚的知道整个产品需要达到的目标，从而准确、合理地对针对目前的局部做出设计，并最终构成整个完整的形态。

而“全局”的前提，是你拥有更高的眼界。你的眼界越高，你对产品、市场、甚至整个社会的洞察就越全面，你就能够解决越大的问题，你能够实现的价值就越高。眼界是基础，解决更大的问题是目标，而全局性设计思维则是实现这个目标的方式与过程。

全局性设计思维，可以帮助我们跳出产品的单一层面，去思考从产品层、到体验层、再到开发层这一完成的整体。让设计满足体验层的同时，满足产品层面的目标，同时让产品的设计与开发高度耦合，将整个产品串联成一个完成的整体。

好了，讲了这么多，我们具体应该如何去运用全局性设计思维呢？

✨

七、全局性设计思维的运用方式

-

全局性设计思维，的应用方式非常广泛。它并不是一个固定的方程式，而是一个更高层面的指导性设计思维，能够通过不同的形式，来帮助你解决问题。

1.全局观——在生活思考更多可能

在尝试这种思维之初，我们可以通过一些小的实践，去锻炼这种思维能力。

在日常的生活、工作中，其实我们有大量的事物可以练习和运用这种思维方式。比如你在装修一个大房子，需要去选择房子里的家具。当你在购买家具时，常规的思维方式是：这个家具在某个房间时应该是怎样搭配的，所以我要购买什么样形状、颜色的家具，来满足这个房间的需要。

但是，用这么思维方式来购买家具，将为对家具的灵活性与长期价值造成一定影响。从居住环境的长远来看，也许这个家具有可能会因为某些原因，需要放到另一个房间，而它的形状、尺寸、配色却无法满足其他房间的需要。最终，我们只能重新购买，或者接受一个风格、尺寸上并不搭调的房间出现。

因此，当我们在购买家具时，我们是否可以利用全局性设计思维，从整体空间的角度出发（而非单个房间），去思考如何让家具满足更多空间需求。长此以往，我们不仅可以打造一个风格统一的大空间，同时也能增加每个家具的利用率，在无形中也增加了这个家具本身的价值。

之所以举家具这个例子，是因为这个原理与产品设计的原理非常类似。你可以将这个房子看成是整个产品，而家具则是不同的组件。通过不同的家具（组件），构成了我们的不同功能模块（房间/功能区），而所有的功能模块则构成了整个产品（房子）。

房子（产品体量）越大，房间/功能区（功能模块）就越多，家具（组件）的多样性、复杂性就越高，我们就越是需要从全局的角度去思考装修的统一性（风格体系化）和家具的通用性（样式组件化）。只有这样，我们才能更好地去打造一个风格统一、体验一致，同时又具备足够自由调整空间的“大房子”。

2.全链路——从全流程中重新思考设计

当你仔细地去理解许多非常著名的设计作品时。你会发现，几乎所有优秀的、巧妙的设计，往往在设计中都体现了全局性的设计思维。它不仅仅解决着当前的问题，同时也能够解决更大的问题，发挥巨大的价值。

比如著名的坂茂卫生纸的设计，看似普通，只是将卫生纸的轴心从圆形改成了方形，但它却成为了举世闻名的、公认的好的设计。为什么呢？

我们先了解一下这个设计为什么好。

首先，传统的圆形纸卷拉出来的纸会比你实际需要的更多。而方形纸卷则由于阻力的作用，让你用得更少，从而起到了解决资源的作用。其次，在运输过程中，圆形的纸卷之间会产生很大的空隙，而方形纸卷则能够紧紧靠在一起，提升空间利用率，从而起到降低运输成本的作用。

这简单的设计，居然发挥了如此大的作用。

那么，为什么我们在设计时就没有考虑到这些问题呢？因为我们从最开始，就没有从“纸”的整个全流程来去思考问题。

让我们“站的更远一些”，纸这个商品，并非只是我们见到的在商店售卖的那一刻。它从工厂中制造完成，通过运输送到每个超市中，当我们购买以后，它又会在很长一段时间内，出现在卫生间，陪伴你使用的每一刻。我们可以将整个流程分为3个场景，而每个不同的场景，又将会对纸本身有着不同的影响。

• 运输场景——卫生纸的运输成本——卫生纸的价格

• 售卖场景——卫生纸的造型、包装——影响用户购买

• 使用场景——卫生纸的使用过程——影响用户的使用体验

当我们能够考虑到卫生纸的运输过程时，我们就可以通过设计去降低运输成本；而当我们可以考虑到用户的使用场景时，我们就可以通过设计，去提升阻力，降低使用量，间接地去提升用户的使用体验。而当我们通过全局性设计思维，可以同时解决这三个问题时，我们的设计就是好的设计，就拥有了更高的价值。

发现了吗，为什么你没有想到相同的设计方案？设计能力并不是关键，设计思维才是指引你做出好的设计的前提。当你能按上述的方式，去思考整个流程、不同的场景，我相信大多数的人都能够设计出坂茂的设计方案，甚至比这个方案更好的解决方式。

✨

八、以全局性设计思维，构建设计体系

-

通过前面的两个案例，相信大家已经了解了全局观、全链路两种应用方式。

那么，我们最最最关心的问题——如何在业务中去使用这种思维呢？

在产品设计中，全局性设计思维也有着非常多样化的使用方式和场景，在之后的文章中我也会讲到很多应用方式。但是，在所有的方式中，我认为最为有效的，便是以全局性设计思维，帮助产品去构建一个完整的设计体系。

1.设计体系概述

什么是设计体系？谈及设计体系，大多数设计师会认为，设计体系就是设计规范。“不就是找个名次包装一下规范嘛？”

我们为什么需要设计体系？它与设计规范有何不同呢？

设计规范是设计师最为熟悉的一种规范文档。在产品设计时，优秀的设计师通常都会建立设计规范。然而在实际的项目中，设计规范往往无法难以有效实施。比如在开发眼中，规范并不符合开发规则，过于碎片化。而产品经理通常又不会去了解设计规范，因此在构建产品框架时也常常随意发挥。

很多项目做到最后，设计规范仅存在于纸面的意义，并随着项目的发展逐渐混乱。为什么会这样？ 

因为不同职能间的思考方式存在差别，设计规范对于其他职能来说经常难以理解与运用，无法与其他职能形成有效联动。

设计规范仅仅是基于视觉层面的规范，它是一个“平面”。而设计体系则是贯穿于产品的每个层面的、与产品深度结合的完整体系，它是“立体”的“有机生命体”。

设计体系的核心在于“体”，它是贯穿于整个产品的完整体系。设计体系由设计师创造，并深度融合于产品每个部分。它能够让产品更紧密、更统一、更有序，伴随着产品的生长，与产品共同进化，并最终推动产品的发展。

创造并推动这一体系，则要求设计师需要更全面的能力。只有充分地去理解并参与产品的每个部分的设计，才能让设计真正延伸至产品的每个部分。

而创造这一切的前提，便是全局性设计思维。

2.设计体系的构建法则

罗马不是一天建成的，设计体系也是如此。设计体系的建立是一个漫长的过程（与产品体量相关），需要在前期投入更多的精力。但若是你的方法得当，就会在项目中越来越轻松，并以此形成良性循环，而你也会越来越有成就感。

如何正确地去构建设计体系呢？我在这里总结了几个要点：

1）树立观念

首先，树立长期的体系化意识是必要前提。在任何项目中都要时刻保持体系化思维，着眼于整个项目，去寻找体系化的推动时机。当你在潜意识中拥有这种思维之后，你会自然而然的将其植入到设计中。

2）以解决问题为导向

体系化并非凭空建立，而是建立在解决问题的基础之上。设计体系的本质，就是由无数个标准化的解决方案，最终构成的一个完整的体系。因此，我们要以解决问题为导向，以全局性思维去思考问题的本质，最终建立适用于全局设计体系。

3）以小为始，重视质量

脚踏实地，从小处入手，去发现产品中最基础的一些问题。表面上看这些问题，对项目影响不大，但他们数量庞大，加在一起便会严重影响整个产品的效率。因此，我们要首先建立高品质的基础体系，再以此为基础构建更大的体系。

不要一开始就设法建立一个巨大的体系，那样只会是一盘散沙，因为它的结构是无序、混乱、不健康的。而这也是大多设计规范缺乏有效性和可实施性的根源。

梅拉妮·米歇尔的《复杂》一书中讲到，任何复杂系统，都是由无数个体通过简单的算法所构成的。在算法领域也是同样的原理，一个优秀而强大的代码，必然是由无数个小型模块，通过简单的算法耦合形成巨大的代码矩阵。基础算法越强大、代码结构越“健康”，可扩展性和灵活性就越强，其能力就越强大。

4）从规范入手，由面到体

从本质上来说，设计体系是由“多个个层面的规范”组合而成的。因此，由设计师推动的体系化建设，往往最初都是从设计规范这一“单层规范”开始。但是，设计体系的建设需要将单层的规范，通过不同的方式，转化为不同层面的规范，最终由面到体，形成体系化。

5）换位思考，寻求跨职能合作

设计体系的建立与维护，通常需要多职能的通力协作。因此，我们需要经常换位思考，在完成设计的工作，帮助其他职能完成目标。只有这样，才能得到更多的信任，并以此为基础推动更多体系化的建设。

比如我在设计一个功能模块的页面时，首先会与不同模块产品经理进行交流，了解不同的业务需求，并从产品层面就开始寻求统一性与通用性。这样的话，当其他模块需要同一个功能时，前端便可以直接复用，同时后端的数据也可以进行互通。而在开发端，我也会详细了解不同端的开发实现原理，务求设计规范与开发规则在理解上的一致性。这一既方便了开发理解规范，同时也从根本上提升了开还原的准确性。

长此以往，整个团队就能够建立良好的沟通和互信关系。有了这种默契，设计体系的推动就容易多了。

6）保持优化，不断成长

设计体系的另一个重要价值在于，它是可以伴随产品不断成长的。所有产品都是在发展中不断变化的，过分僵硬的规则，将会对产品发展起到反作用。

在业务发展中，产品一定会不断地加入新的功能模块，并对原有页面作出相应的调整。因此，设计体系需要时刻与产品策略保持一致，及时与上下游职能沟通，不断地针对产品发展进行优化，以保证设计体系能够符合产品的发展需要。

7）使用正确的推动方式

体系化最终能否成功实施，推动的方式至关重要。

在日常的项目中，大多数的业务方对设计体系了解甚少，也难以体会其中的价值。因此，他们通常会认为这些东西毫无必要，多数情况也不太愿意配合体系的推进。如果强行推进，反而会引起不必要的阻力，招致反感。那么，我们应该如何正确的去推进设计体系建设呢？

1.为他人带来价值：首先，寻找双方共同的利益点是首要任务。也许是可以让其他职能的工作更高效，也许能够促使其达成KPI，再不直接，那也一定能够为整个产品带来价值（不然你也没必要推了。。）。总之，设计体系一定要能够为他人带来价值，这样才能顺利推进。否则人家凭什么要协助你推进，因为你美丽可爱吗？你也可能比较可爱，但总归是不能一直这么来吧。。。

2.在解决问题后提出方案：不要一开始就啪一下抛出一个“宏大的理想”，大部分人会觉得你不切实际。你只需要通过这个体系，帮助业务方先解决一个问题，然后再提出你解决方式的来源——一个严谨的、可验证的、长远价值的体系化解决方案。

3.寻找合适的推动时间：最后，对于设计体系来说，寻找到正确、恰当的推进时机至关重要。比如当你在平时突然想要提出，对现有品牌进行升级时，大多数业务方都会认为你是没事找事。而如果情况是在新的一年中，产品进行了概念的升级，这时候你将概念以及未来的品牌规划融入在你的方案中，再去推进品牌升级，就会容易很多了。

✨

九、文章预告

-

本文旨在引导大家更好地理解和学习这种思维方式，想要用好全局性设计思维，光靠讲是远远不够的。最重要的是能将这种思维带入到产品中，为业务带来更大的价值。

因此，在后续的几篇文章中，我将通过不同类型案例，为大家深入讲解全局性的具体实践案例。

全局性设计思维 | 如何打造强大的品牌体系

为什么要建立品牌体系？品牌体系有哪些价值？设计师应该如何推动品牌体系的建立？

本文将带你了解网易智慧企业品牌体系的建设与推动全过程，聊一聊品牌体系建设的那些事儿～

FishDesign组件库 | 从零到一构建企业级UI组件库

我们为什么要建立组件库？在产品的什么阶段需要组件库？如何抽象业务组件？组件库设计过程中有哪些重要的细节需要注意？

本文带你深入了解，网易Web端组件库——FishDesign组件库从零到一的完整全过程。

全局性设计思维 | 如何构建事业部级大型设计体系

设计体系有什么价值？如何基于不同的业务建立设计体系？设计师如何推动体系化建设？在体系化过程中有哪些需要注意的地方？

我将会在这篇文章中，为大家介绍网易智慧企业设计体系构建全过程

1. 样式组件化+规范体系化，形成产品设计体系，整体重构产品线。

2. 结合品牌体系，推动事业部更多产品加入体系，形成智慧企业Web端产品设计体系

3. 推动更多产品/业务融入体系中，让智慧企业设计体系不断成长，赋能业务发展

✨

写在最后

-

好吧，似乎文章又写得偏长了一些。只能说，想要认真地讲清楚一个道理，确实不是一件容易的事情。

设计思维本身并不复杂，但想要讲清楚它的背景、原理及价值，就需要把它整个掰开来讲。而为了确保设计思维的可实施性，又需要经过大量的实践研究，自己能够走通以后，才能与大家分享。

坦白讲，似乎整个社会都在追求快节奏、碎片化阅读。但若是因此而丧失了自己学习的节奏，那么等于是没有节奏的，你的知识体系也将是东拼西凑，无法形成一套完整的体系。这也是我更新比较慢的原因之一，希望大家读完文章，能够切实地得到一些东西，这就很有意义。

不过更新这么慢，汽水和芬达都有责任。天天在面前卖萌啊吸引你注意力，那你就得陪他们玩吧？玩完以后鸡胸肉你要煮一个吧？吃饭打架了你得调解吧。。你们真的不能怪我。

蓝蓝设计建立了UI设计分享群，每天会分享国内外的一些优秀设计，如果有兴趣的话，可以进入一起成长学习，请扫码蓝小助，报下信息，蓝小助会请您入群。欢迎您加入噢~~希望得到建议咨询、商务合作，也请与我们联系。

蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务

随着大数据的兴起，数据价值的不断挖掘，图表作为数据呈现与分析的有效手段，正扮演着越来越重要的角色。我们在进行 B 端平台设计时也在思考：如何让图表清晰的传达信息，同时带来美观的视觉感受。

为了达到清晰传达和视觉美观的目标，我们结合实际项目，进行大量探索及思考，梳理总结了一套适用于 B 端后台类产品的图表设计思路及方法，涵盖了曲线图、柱状图、饼图、雷达图、漏斗图等各类常用图表类型。

图表视觉层级

图表能够承载大量数据信息，同时视觉元素较多，如果只是凭借设计师的审美喜好进行视觉设计，没有整体信息读取考量，可能会导致重要信息未能凸显，降低用户读取效率。

为清晰传达信息，进一步提升读取效率，我们采用元素重要程度与视觉强度相绑定的方法。依据元素重要程度，将图表元素分为三类，分别为“底层元素”、“中层元素”和“顶层元素”，并依据不同视觉强度分别设计三类元素。底层元素最弱，顶层元素最强。通过这种方法，梳理图表元素的前后关系，能够清晰把握元素视觉层次，保证信息传递效率。

1. 底层元素设计

在各类图表中，我们把辅助说明数据的轴线、刻度等定义为底层元素。为了减少视觉干扰，最大程度突出主图形，底层元素全部使用浅灰色进行设计。我们发现，当元素与背景颜色的明度对比在 1.2:1 时，人眼较难看到元素；当对比度在 2.0:1 时，视觉强度过强，易吸引用户注意力。通过元素视觉强度的调研及视觉尝试，最终确定元素与背景对比度在 1.6:1 左右，视觉强度偏弱但人眼能够看清的程度。以保证元素视觉不突兀，只在需要查看时可以被发现。

2. 中层元素设计

中层元素的内容包括数据图形、数据线段等承载主要数据信息的元素，是图表中表达数据的关键元素。与底层元素相比，中层元素采用更低明度与更高饱和度的数据色来表现，使元素从页面中凸显出来，保证可读性。同时在样式上适当加入渐变、描边等样式，丰富视觉层次，带来美观的视觉感受。

3. 顶层元素设计

我们把顶层元素定义为图表高亮信息，内容包括悬停样式、悬停后的详细数据说明等。在设计上为保证视觉样式突出，使用深灰色、强调色等强对比度样式，并辅以动画、投影等手法保证明显的视觉强调效果，保证顶层信息最有效的传达给用户。

4. 最终效果

通过层级梳理，并绑定元素重要程度和视觉强度的方法，设计后图表主次信息均按重要程度进行对应视觉强度的展示，让用户能够在第一时间接收到最重要的信息，提升信息读取效率。

图表排版设计

图表排版是指各元素在图表中的尺寸及布局等，对于 B 端后台类产品来说，不同排版对用户使用体验造成较大影响。如何建立一套合理的规范保证用户的使用体验？我们经过大量讨论推敲，梳理出一套针对 B 端后台类产品的排版规则，力求保证用户图表的使用体验。

1. 图表尺寸

图表尺寸指图表整体长宽高。在项目中我们发现不同尺寸的图表对数据展现效果影响巨大，例如巨量数据的图表挤在名片大小的区域例显示，这使得信息读取的效率大打折扣。为此我们收集并提取出“全貌概览”、“多角度环视”、“详情分析”三类典型场景，并制定了“迷你图”、“中号图表”、“大号图表”三类尺寸，针对不同尺寸优化图表的信息展示密度，以达到高效读取信息的目的。

“迷你图”尺寸最小，舍弃了 Y 轴等不必要信息，利用小面积展示最关键的图表信息，并控制数据密度，保证信息高效读取。

“中号图表”尺寸受限，限制坐标轴刻度数量和数据的密度，例如曲线图数据点不高于每 4 像素 1 个数据点，Y 轴坐标刻度不超过 5 个，以确保信息密度不过载，这类图表尺寸通常用在针对某大类内容进行多方面检视时。

“大号图表”尺寸最大，不限制数据信息密度，给予最全最详细的展示，这类尺寸通常用在数据详情页等详细分析场景中。

最后考虑到多图表混合排列时，饼图、地图等大面积填色图表，相较折线图等描边型图表，视觉感受更加膨胀。我们缩小了填色类图表的实际高度，保证多种图表混合排列时，视觉感受的均衡。

2. 坐标轴

坐标轴在图表中出现的频率较高，那么坐标轴常见的设计问题有哪些呢？

第一是横纵坐标轴的刻度出现过密情况。

如果坐标轴所承载的是连续数据（连续数据指可量化的，连续不断的，在区间内可任意取值的数据，如时间、金额、人数等），设计师可自行增减刻度数量以保证视觉舒适度。如果承载是离散数据（离散数据指不可量化的，无关联的，不可在区间内任意取值的数据，如分类、软件版本、省份等），可采取增加坐标轴缩放功能解决。

第二个常见问题是刻度的说明文字过长。

如果是 X 轴（横轴）文字过长，除了在可控范围内减少刻度，还可采取文字倾斜 45°~90°的办法(如文字全部为中文，可用竖排代替倾斜 90°)，缓解信息过密看不清的情况。

如果是 Y 轴（纵轴）文字过长，需联合研发一起调整数据的单位，比如把“元”调整为“百万元”。

如果不能调整，那就要根据所使用的图表库有针对性调整。例如常用的 Echarts 图表、D3 图表等开源图表库，需要提前预估刻度文字长度并预留出来，否则刻度文字可能会被页面裁掉而不能完全显示。如你是用的是 AntV 等可自适应的图表库，则不必提前处理，图表库会自动按刻度长度进行整体调整。

3. 图例

图例作为图表中不可或缺的部分，在各类图表库中位置不尽相同，由于不同图表样式差异很大，图例的位置需整体考虑并适当布局摆放，但在同一产品或页面内，过于随意的摆放图例，会导致页面统一性较差，同时增加用户的浏览成本。我们团队所负责的 B 端商业产品矩阵，作为面向用户的产品集合，产品间联系非常紧密。过于灵活随意的图例摆放不利于用户对于图表的浏览。为解决此问题，我们基于业务特点，针对 B 端商业产品矩阵制定了图例布局指导原则。

我们以提升屏幕信息密度为目标，分析不同场景的页面排布，制定了顶部和右侧两种较为宽松的指导原则，供设计师在没有明确的更优方案时选用。

当图表是左右两端对齐的类型，例如折线图、柱状图时，建议将图例放置在图表顶部。这样能结合标题等其他元素进行统一排布，减少占用空间。当图表本身左右都有空余空间时，例如饼图，建议将图例放置于图表的右侧。也能够节省页面的空间。

数据色板设计

色板作为常见的数据表达手段，能够利用不同颜色明确体现分类信息、数值高度、状态信息等。但目前市面上鲜有专业用途图表的配色工具。我们经过大量探索尝试，梳理总结出图表色彩的两个关键维度：辨识度与统一性。既需要颜色间突出强烈可清晰辨别，又需要颜色整体能形成统一风格，以达到清晰传递和美观的目标。如何平衡辨识度与统一性，是我们遇到的难题。

1. 辨识度

辨识度在图表中有两方面：颜色与页面底色的辨识度，各颜色之间的辨识度。对于第一种，我们采用控制颜色的明亮程度来确保色彩辨识度，尤其对于黄色、青色等本身较亮的颜色，降低颜色的明度，确保在浅色背景下颜色可辨识。

对于第二种也就是各颜色之间的辨识度，通过实验发现单纯的颜色色相变化，例如红色与橙色的区分，人眼不容易分辨。所以采用了色相变化+明度变化的方法，即深红色与亮橙色，深蓝色与亮紫色等，这样用户能在第一眼就明确分辨，保证颜色间的辨识度。最终把颜色映射到色彩空间的三维坐标中，运用欧几里得距离公式测算颜色间的距离长短，来衡量各颜色间色差数值。颜色间距离越远代表色差越大，利用数据辅助衡量辨识效果。

2. 统一性

色彩统一性的作用在于确保图表整体风格一致，色彩搭配舒适，从而带来美观、统一的视觉感受。为达目的，我们首先提炼商业产品设计风格为明亮、强对比，其次把设计风格转化为色彩数值。经过实验，把颜色明度限制在 50%-70%，把饱和度限制在 75%-85%，并在区间内不断波动。这样既保证了色彩视觉感受的统一，各颜色间又能够有清晰的辨识度。

3. 颜色量化与工具

量化颜色，将色彩转化为数值，利用数值来验证设计师的「感觉」，能够保证方案合理性，保证设计质量。但通过尝试，我们常用的色彩模式均不能科学合理的量化颜色。通过查阅大量资料，我们最终决定以小众的 HCL 色彩模式来衡量色彩。其中 H 表示色相、C 表示饱和度、L 表示明度。HCL 区别于传统的 RGB 或 HSB 模式，它能够将人眼对颜色的感知精确的量化为数值，例如黄色相比蓝色明度更高，都能如实的反馈到数值上。也由于此特性，HCL 模式在诞生距今不到 20 年间，已被一些先锋设计师用于数据可视化的呈现中。

但是 HCL 作为小众色彩模式，目前设计软件鲜有支持，造成了 HCL 色彩不直观、不方便调色等的问题。为解决此问题，我们已初步完成智能配色程序，只需输入品牌色，就能自动生成图表色版，并在风格上与品牌色匹配，达到整体色彩的统一。我们也将一套调配好的色板及 HCL 实用小工具附在文末，帮助大家直观的查看和使用 HCL 模式颜色。

结语

数据价值就像不为人知的宝藏，隐藏在一条条枯燥晦涩的数据背后。而图表则是开启宝藏的钥匙，是发掘数据价值的强有力武器。通过对图表的不断探索优化，我们希望能够最大化数据的价值。通过图表，让数据最直观的展现；通过图表，让其背后的规律浮出水面被人探知；通过图表，让 B 端不再有难懂的数据。

附：色板及 HCL 工具

• HCL 调色 Sketch 插件：https://github.com/petterheterjag/chromatic-sketch
• HCL 颜色生成器：http://medialab.github.io/iwanthue/
• 色彩可用性检查工具：https://color.review/

文章来源：优设网    作者：百度MEUX

蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务

在过去的2020年疫情中，很多设计师都降薪甚至失业，让本不富裕的生活雪上加霜。但与此同时，也有很多设计师反而在逆境中开了窍，接到了更多的单子，做出了更好的案子。

那么怎么才能过上钱多事少在家办公的独立设计师生活呢？我们邀请了八位出色的接单高手来一起探讨。他们中间有正在大厂上班偶尔接单的全职设计师，也有工作多年后毅然创业的创意老炮，有从未上班打卡的独立设计师，还有拥有着整个设计团队的公司老板。

他们是：

赵威：市场只要存在竞争就会要求我们去做一些革新和改变，这适用于所有行业。

全职设计师 / 5年经验 / 多服务于互联网及新型行业：媒体，社交，海外市场等。/ 年接单金额：数十万级 

迦木木：与其多独自做设计，不如多和顾客沟通，从而发现他们的真实需求。

独立珠宝设计师 / 12年经验 / 直接服务于消费者，女性为主。/ 年接单金额：数百万级

是北瓜呀：设计是一门手工活，活要出色是第一位的。

全职设计师 /  2年半工作经验 / 无固定服务行业。/ 年接单金额：数十万级

力虎广告：当你在某个领域足够优秀的时候，机会就会自己走到你的面前。

自营设计机构 / 公司成立5年 / 聚焦电商品牌视觉设计全案的广告公司，客户较多来自家居、母婴和美妆类目。/ 年接单金额：千万级

NiceLabStudio：活儿不分大小，用心去做每一件事，剩下的交给时间。

自营设计工作室 / 从业10年，工作室成立一年 / 多服务于“客户是年轻人”的行业，例如玩具，食品，潮流服饰等。/ 年接单金额：数百万级

你好大海品牌设计：设计师应该持有一定的态度、价值，用专业的设计能力和客户平等地对话。

自营设计机构 / 公司成立9年 / 多服务于快消、美妆、生活美学领域，及一些原创设计品牌的合作。/ 年接单金额：数千万级

石昌鸿（上行设计）：把自己的专业做到极致，无人取代便是你的核心能力。

自营设计机构 / 公司成立8年 / 多服务于餐饮，白酒，茶类客户。/ 年接单金额：数千万级

杨晟Sheen（五感觉醒设计5SD ）：认真对待每一次合作，从前的合作伙伴自然感受到你的用心和尽责。

自营设计机构 / 公司成立9年 / 多服务于互联网行业。

下面我们就进入主题：

WHY？WHAT？

客户为什么找到你？

设计师的核心能力是？

客户的情怀不多

客户都是实在生意人。设计师在苦恼缺少优质客户的同时，客户更烦恼怎么找到优质靠谱的设计师。客户只能从你的过往表现中为你已经证实的能力买单，而很少愿意去赌你未来可以突然爆发。

 从大家的回答和对设计项目的观察中，可以归纳出以下四个客户看重的设计师特征：

1、与客户需求同类型的过往作品

如果你参与甚至主导过和潜在客户需求基本一致的案例，那么，这将会是最能打动客户的表现。例如你发布的作品中很多官网类的案例，那么想要做官网的客户就会循着这些案例找到你。

2、客户同行业的头部客户案例

一定要尽量服务各个商业领域里最头部的那些客户。因为他们的跟风者和崇拜者会愿意以更多的预算和尊重找到你。尽管他们也知道找到大佬的供应商并不能成为大佬，但是人们总是会迷信“明星同款”的威力。

3、独特的设计风格

客户们在争夺他们用户的注意力，在满足他们用户的审美需求。这个时候，一个区别于竞争对手的独特设计风格，会是他们重要的武器。做为设计师，千万不要去完全模仿另一个设计师。有实力的金主，永远只为第一人买单。让自己成为第一人，不要成为谁谁谁第二第三。

4、良好的设计师品牌

几乎所有的被访设计师都把这条作为最主要的原因。良好的设计师品牌意味着更大的知名度和更好的信用度。本文后面我们会围绕这个话题有更深入的探讨。

设计师的专业精神不少

成功带来更大的成功，十位设计师都不约而同地把专业精神视为设计师的价值核心，并且都在继续加强自己的设计方法体系，把每一个单都做为招徕下一个更好客单的引子，也作为验证自己设计观点的现实案例。

大多数设计师都已经选定了自己主要服务钻研的商业领域，用深度来交广度。设计师通过长期的服务和洞察才可以和客户对行业的机会问题等进行深入的交流，而非流于视觉效果表面。

持续的多维度的能力培养也是大家共同提到的关键，大家一致认为良好的学识和思考能力是设计师需要具备的素质。

不可替代的设计能力和良好的服务意识，就是设计师的专业精神。

叁山-浓缩茶 包装设计 THREE MOUNTAIN TEA  by NiceLabStudio

HOW？WHERE？

如何获得客户？

在哪里可以找到客户？

设计平台仍然不可替代

站酷是大家提到最多的关键词，抛开商业互吹，这依然显示出类似站酷，dribbble，behance这样的设计类公共平台在当今接单渠道中仍然保持着不可替代性。

在此之外，八位高手们几乎实践了常见的所有渠道：线下开店，朋友介绍，老客户推荐，中介服务等等，但是都只能带来零星的机会，不足以成为稳定的主要客单来源。

自建流量池的可行性不高

有两人提到了自建流量池。随着这些年短视频平台迅速崛起，确实让自建流量池的可能性大大增加。但是由于大众平台话题相对宽泛，并且读者兴趣点也相对分散，目前并没有很多设计师通过运营自媒体实现订单转化的成功案例。确实有一些设计话题下的大号和网红，但是他们的内容目标更多是依靠广告带货等手段直接变现，而非提升设计师品牌。我们会持续关注新媒体平台对外包业务的影响。另外，建立流量池的时间成本和操作难度也完全不同于设计师习惯的创作式工作模式。这次访问的八位设计师中，仅有一位拥有千万粉丝级微博大号。

不管在哪里，用作品说话

大家很有默契地提到了创建高质量作品集对吸引客户的决定性作用。渠道不是秘密，作品才是第一要素，好作品+好平台，才会带来好客户，这也是八位高手的共识。作品发布时，不仅要关注视觉上好看，也要注意写清楚必要的项目背景，行业信息等客户关心的内容。在平台与他人的互动中，也尽量保持有礼有理有节的交流，不要给潜在客户留下此人不好沟通的印象。

主动上门的客户，比较优质

如果你发布的作品已经获得了客户的欣赏，那么接下来的合作将会比较顺畅。这也是此次采访中大家的同感。这也是设计师品牌话题中的一环，稍后在设计师品牌中我们详细展开。

沟通能力+数据能力，设计师的技能点加法

三位设计师提到了沟通表达能力以及对数据的理解使用能力。

其中沟通能力是个传统技能，设计圈一直有三分做七分说的调侃，虽然有些偏颇，但是反映出沟通表达能力的重要性。因为设计师和客户的认知方式，知识结构等都存在着巨大的差异。很多同行间不言而明的常识，在客户那里可能是完全陌生的盲区。好的设计师需要知道怎么建立和客户的同理心，站在他们的角度，用他们习惯的方式去思考问题。

数据能力是时代的召唤。我们现在就生活在一个数据的时代，信息和商品的流动方式，内容和服务的交付方式，甚至消费者的决策方式都基于数据而定。在这个环境下，设计师需要建立对数据的基本认知，美学说服不了的客户，往往可以被数据说服。在之后的系列文章中，我们会在这个话题展开说明。

Mercedes me-梅赛德斯奔驰移动程序  by 赵威G

腾讯游戏创意大赛视觉设计GWB Game Awards 2020  by 五感觉醒设计5SD

designer personal brand 

你对设计师的个人品牌怎么看？

设计师应该持续打造自己的品牌

设计一直是个设计师品牌驱动的职业，设计师品牌是客户找到你的原因，它也时常可以形成很高的“品牌溢价”。可以说设计生涯就是个创造和运营设计师品牌的过程。以下我们梳理了设计师们对此的思考。

建立：风格，特色，定位

设计师本身往往就是品牌专家，甚至很多就是品牌设计师。但是当局者迷，为客户做品牌设计时思路清晰，节奏明快，到了为自己建立品牌时，很多老江湖也会犯迷糊。大概是因为人最难认清的就是自己。

但是从大家的交谈中，梳理出风格，特色，定位三个线索：

风格 是你最顺手舒适的设计方式，只有你本身就喜欢的方式才可以长期坚持。

特色 是你区别于别人的特征，用来回答为什么找你而不是别人这个灵魂拷问。

定位 是对于市场机会的理性分析，误入夕阳行业的边缘地带会带来事倍功半的后果。

输出：品质，一致，体系

规划好了建立一个风格鲜明，特色明确，定位精准的设计师品牌，怎么输出你的品牌印象给到行业和客户呢？大家共同谈到了这三点：

品质：把有品质感的内容展现给外界，这是设计师品牌印象树立的第一要务。品质感包括但不限于完整清晰的案例描述，画质清晰的图片展示。还要有发布平台选择，内容深度选择等一系列的思考。如上文提到的，能给读者留下靠谱专业的“信用感”为佳。

一致：人们不相信万能的神仙，留给每个品牌的记忆空间是很狭窄的。设计师品牌要避免试图营造“啥都擅长”的印象。始终用一致的风格强化设计师品牌的特色印象，保持不变的定位，才可以占领大家的心智。什么都是的品牌，什么都不是。

体系：市场的机会有限，但设计师们时常看起来十分相似，傻傻分不清楚，怎么办？这时候就看同一赛道上，谁有更深入的理解，能提供更全面的服务。前文里大家都在努力构建的设计方法论，在这时发挥了作用。

升级：从一个人到一群人

设计师的个人品牌往往成为设计团队公司化运营后的瓶颈。客户指名知名设计师本人来服务，但设计师自己的时间精力无法照顾太多项目。个人品牌的扩展性不高，团队品牌又不容易建立共情。怎么把一个人的名气变成一群人的名气？这是需要在初期就做好预案的问题。

>>>>> 前往查看8位设计师对此话题的具体回答 >>>>>

上行案例/ 侠客行-九号虾铺 品牌VIS  by 石昌鸿

《无染WURO 》品牌包装设计 by 你好大海品牌设计

Opportunities and challenges

工作中最大的困难是？

商业思维

独立设计师或是设计公司负责人，区别于职场设计师最大的特点应该就是商业思维了。一方面客户和领导对设计的要求是不同的，客户希望你的设计可以直接作用于商业结果，但领导更多只是希望你可以配合公司策略。另一方面，脱离了职场的设计师，要自己解决柴米油盐，不具备商业思维，就会直接出局。

瓶颈/未知/压力

这三项是不同的因素，但是把它们放在一起，代表着设计中最困难也最有趣的部分：挑战未知。做好设计需要的能力很多，每条成长路径上都会存在很多未知的歧途，如何管理好自己状态，始终以昂扬斗志去面对这些压力，是个永恒的话题。大家可以参考下面设计师们的回答和作品，去经历他们各自的成长。

人才/合作伙伴

设计是一个链接性的工作，通过链接上下游发生作用。尤其是外包项目，经常无法参与到最初的立项探讨中，导致面临一场场“残局”，所以就需要有强大抗压力和灵活性的伙伴来组成“特种部队”。几位设计公司的负责人，都一致表达了对人才的渴求，希望本文可以帮到他们。更希望大家可以从本文中得到一句一词的提示，让我们做出更棒的作品，拥有更好的客户。

<婷谷>向阳而生-品牌设计全案 by 力虎广告

66NORD官网设计 by 是北瓜呀

不好走的路上才有最好的风景，与大家共勉。

文章来源：站酷  作者：站酷策划

蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务

排版将文字从单纯的文本转换为巧妙的交流方式。字体和类型设计可以说出这么多–从突出的粗体字体到精致的衬线字体。从传统的永恒变化到全新的技术。

字体在现代文化和商业中的突出地位受到包豪斯艺术运动的影响。赫伯特·拜耳（Herbert Bayer）是包豪斯（Bauhaus）的学生，并通过采用还原性极简主义的原则在版式设计上留下了杰出的印记。

数字图形媒体和设计师本身的爆炸式增长催生了各种各样令人惊奇的想法和进化。有些想法只是一时的流行，而另一些则是可以保留的趋势。我们重点介绍了2021年最流行的字体趋势。

1. 衬线字体

衬线字体当然是永恒的–因此，当以新的现代方式使用它们时，它们会重新出现在趋势图上。通过将细长和粗体元素并置，我们看到古典衬线字体作为一种持续的趋势重新回到设计中。尤其是受到美容和DTC品牌的推崇，该款式具有柔和的美感，可以在许多行业中使用。

我们的示例显示了带有泥土色的苗条衬线字体的优雅搭配，从而柔和了整体氛围。

Neubel本身是一家字体铸造厂，使用柔和而优雅的颜色托盘并将文本覆盖在对比鲜明的艺术品上，以大胆地表达自己的观点。

设计公司Autumn展示了视觉层次结构的强大功能以及自信的版式和简单的形状。

2.轮廓字体

轮廓字体在2020年出现了很多的创意，我们希望在2021年会看到更多。透明字体在与粗体，填充字体并排显示时，更加强大。

我们的示例表明，轮廓倾向于在网页设计中占据中心位置。Heetch在相同颜色的纯色衬线字体上方使用蓝紫色轮廓字体，以表现出对比效果。

Aldo在“走进爱情”广告系列中使用了当年Pantone颜色的阴影。广告系列以自信和表达为中心，明亮的黄色将那种感觉放在了中心。轮廓字体是使粗体黄色发光的绝佳选择。日本设计师Ukyo Masuda凭借中性灰色调色板为该群体锦上添花，尽管如此，它还是通过创意的轮廓字体而栩栩如生。

3.进化的野兽派

如果您希望营造视觉张力并摆脱标准网页设计的束缚，那么野兽派字体与现代野兽派元素相结合就可以完成工作。野兽派字体的清晰，原始，略显复古的设计经过了现代化改造，成为我们所谓的“进化的野兽派”。在经过改进的版本中，苛刻的元素被软化并与各种调色板和形状结合在一起。

我们的示例显示了进化的野兽派的不同变体和组合。内森·泰勒（Nathan Taylor）使用了大量实验元素和互动性。整个设计是野兽派的，不仅仅是字体。这是对更加野蛮的野蛮主义的一个很好的展示，但是现代的元素使这种感觉更加精致和进化。

4.文本与其他元素的分层

通过有意地分层排列文本和图像，可以使得整个页面更有空间感。这种组合使焦点很清楚。它允许用户在滚动之前暂停一秒钟并全部接收信息。

这些示例是最有趣的。登录Mammut贝加尔湖页面后，您即会感受到电影般的震撼力。图像的运动和贝加尔湖文字与人类交织在一起，使您感觉自己像是体验的一部分。

德国品牌代理公司MJND的层次结构要简单得多，但是层次感仍然很突出。对于那些使用文本和图像的人来说，这种设计更容易上手。

Owlsome Studio使字体更加突出，并在其后面分层显示较小的正方形图像。这是其他两个示例的替代方案，但是由于它打破了网络的现状，因此可能以自己的方式产生影响。

5.文字图像融合

比文本分层更进一步的是文本与图像相互融合，而两者是密不可分的。这给图像带来真正的优质感，并引起您的注意。它们不再是文本和图像层的组合，而是变成一个整体。

我们喜欢这种格式允许的创意表达，并提供无尽的组合。Satellite414使用透明的轮廓文字，这些文字实际上成为照片的一部分。它是动态，现代和新鲜的。

Kieran Baybutt中文字完全取代了图像。这使得文本部分与典型镜头一样重要。Craig Reynolds中图像和文本滑入和滑出组合，将它们合并在一起，从而使用户注意到它们。

6.新迷幻效果

全新迷幻氛围是对时髦色彩的复古回归，融合了现代感。它借鉴了过去的迷幻设计。

从1960年代到1970年代的剧烈社会动荡带来了新艺术和设计的变革。迷幻的影响在那个时代就很明显了，今天我们看到了一种新的潮流。韦斯·威尔逊（Wes Wilson）是那个时代的重要设计师，他创造了一种新字体，成为该地区的象征-著名的迷幻设计。

Victor Moscoso为他的印刷沉重设计带来了鲜艳的色彩，这些色彩影响了示例中所见的现代霓虹色调色板。

宙斯·琼斯（Zeus Jones）是我们所看到的趋势的完美典范–光谱中各种鲜艳的色彩，以梦幻般的方式与斜体字体结合在一起，并为流动的渐变带来了清晰的通信效果。

查理·勒·麦格南（Charlie Le Maignan）为我们提供了一种有趣的复古字体，可在页面上扩展和折叠。此外，在Showreel部分，我们看到了一段令人迷惑的文字彩虹，让人联想起1970年代的专辑和那些酸酸的歌曲。

圣马丁代理公司在令人眼花scene乱的场景中为我们带来欢乐和情感的熔岩灯。字体与背景配合得很好–简单性与无穷复杂的色彩并置。

7.粗体现代衬线字体

到2021年，这并不是一个全新的概念，现代的衬线字体处理技术随着新外观的发展而不断变化。

一个新的变化是，我们看到粗体衬线字体完全占据了屏幕。在许多情况下，文本是整体设计，而粗体的现代衬线字体则可解决问题。

样条线使用黑底红字表示强烈的陈述，并使用完全大写的文字来增强效果。对于试图唤起技能，信心和权威的公司，这种组合效果很好。

Orto保持简单，但将宏伟提升到另一个层次。超大，明亮的字体只会迫使您注意并进一步深入。

8.赛博朋克风格

也许最分裂的想法之一是计算机朋克和汽具美学。计算机，视频游戏和1980年代流行美学的模糊组合以某种怪异，令人着迷的组合在一起。

80年代是数字游戏和新的计算机浪潮的开始。赛博朋克和汽具设计是80年代复古设计的变体。随着计算机和AI的发展，我们可能会看到印刷术和美学的新融合。

Next Big Thing Academy显然具有对未来的关注。虽然这里的字体选择不是什么极端的选择，但总体上符合复古主义的未来美学。

浮标也不使用任何大胆创新的字体，但是图像与字体的整体配对符合这种趋势。

文章来源：站酷   作者：Ballen成名

蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务

引人注目的UX设计背后的心理学

前言

在这艰难又魔幻的2020年的尾声，有必要系统汇总下关于UI/UX的设计发展方向，为接下来的2021的开篇带个好头。本文在了解这些趋势的同时，分析特点并举例落地实例，来帮助大家启发创意设计工作的思考切入点。

流行趋势跟人们所处的环境密切相关，从最初的方块马赛克——>追求极度写实——>扁平风——>到现在的质感拟物，扁平设计霸屏的这几年，设计风又向更立体、丰富、更有层次感的方向发展，所以说趋势就是一个轮回。设计风格没有绝对的好坏，在审美达到一定疲劳时，就会开始出现新的设计风格。每一个新风格都值得设计师去拆解、思考，本质都是为了提升更好的交互体验。 

而在进入下一个十年的过程中，我们对数字产品和体验的依赖将日益增长，预测真正胜出的将会是3D动画和用户界面/用户体验设计的结合设计，5G技术的发展，它将重塑了我们以前无法想象的交互方式，这将是一段充满创意、鼓舞人心的发展阶段。在这里让我们来看看未来那些不可忽视的设计趋势吧。

（注:图片来自网络，均标明出处及作者，若有侵权请告知删除）

1、3D与UI结合

随着且易用的3d软件工具的出现，3D 元素已经开始变得越来越受欢迎，而在这之前，UI界面一直被平面设计所主导。与 2D 不同，它提供了更为逼真的立体效果，从插画、动效、电商到平面视觉，在所有的设计类型中都能找到它，3D现实主义已是各个领域的大势。

圈中也出现了很多免费或付费的3D预设元素及场景组件，帮助3D小白更快地搭建出具有冲击力的视觉组合。

特点：

• 直观感受；

• 立体真实；

• 形态丰富；

▲Izmahsa

▲Mike

▲Tran Mau Tri Tam ✪

▲Vikiiing

▲https://www.awwwards.com/inspiration/3d-hover-number-reveal

实例应用：

各大厂都开始纷纷尝试在产品中加入3D元素，将自家IP立体化，植入到各个品牌静态页面，加深品牌印象渗入。3D技术虽然已经出现有一段时间了，但是为了保证速度和性能表现，较少应用到产品中，随着软件技术的提升，立体渲染产品将开始慢慢运用到更多的界面交互、H5活动中。

▲闲鱼、QQ、花椒直播的3D启动页

▲得物（毒）的3D空间动效

网易云音乐每年的音乐总结报告都追随着的设计潮流，今年还可以自由选择人物形象，增强了用户的主观代入感，以下是每年的设计风格变化：

▲2018-渐变插画、2019-撞色渐变、2020-3D人物场景

▲2020-总结陈词H5

▲总结报告Banner的动效

其中IP立体化最多的当属K12教育领域，除了制作IP周边外，3D效果能适应丰富的运营场景，高度还原现实世界，给小朋友带来最真实的学习互动体验。

▲洪恩识字（3D学习场景）、腾讯开心鼠英语ABCmouse

▲IP在播放儿歌时的互动

值得一提的是今年苹果发布的macOS Big Sur除了玻璃拟态的变化，图标还加入了3D维度的拟物视觉层次。

苹果的 mac OS 的人机交互指南中也明确指出：“图标不仅是装饰性的，而且在与用户交流中起着至关重要的作用，它应该传达应用程序的主要目的并暗示用户体验。”这次扁平化和拟物化的结合，将又要引领一波设计趋势。

2、软渐变（Soft gradients）

过于强烈的渐变不再是趋势，大多数设计师都开始喜欢使用非常简单和微妙的渐变，如果产品的目标用户人群需要轻松温和的视觉环境，那么此风格再适合不过。

软渐变包括背景、阴影、反光，常与线条平面图形结合，应用于界面、网站、图标、icon等设计中。

特点：

• 低调温和

• 微妙渐变

• 清新愉悦

2.1、柔和背景

在设计网站中我们已经看到了许多非常精致，明亮柔和配色方案，混合两种以上的颜色来创造多彩的模糊背景。它使设计看起来非常现代、不打扰、清新而令人愉悦，其中画面内容是主要视觉焦点。

▲Vladimir Gruev

▲Sajon

▲Anton Mikhaltsov

▲Ghani Pradita

实例应用：

▲咔咔、美柚

▲https://takearecess.com/

2.2、柔和阴影

柔和的彩色阴影使UI有了更微妙的深度变化，在图标设计中经常需要渐变或阴影来塑造物体，柔阴影使设计元素更丰富立体，并且它们有助于区分内容之间的层次结构。

▲Ghani Pradita

▲Sèrgi Mi

▲Taro Huang

实例应用：

▲有道数学（已下架）

▲Uki

3、玻璃拟态（Glassmorphism）

去年新拟态掀起了一阵狂热，但这种模拟受到挤压的塑料效果（凹/凸层次感），在用户的阅读性上可能会出现问题，新拟态更适合用在局部的少量元素点缀，无法完整地使用在整套应用程序中。

▲Alexander Plyut

伴随着今年苹果发布的 MacOS Big Sur 操作系统的发布，新的拟物风格正式回归大众视野，整体风格应用了新拟态（Neumorphism）的设计思路，利用大量的毛玻璃质感和大量投影纵深感，能很好的突出前景信息，中和了扁平化图文带来的生硬不立体感。而Big Sur的图标也加入了 3D 质感设计，设计语言更为时尚简洁。苹果设计师 Alan Dye 在发布会上也提到了设计风格转变的原因，主要是希望「降低视觉的复杂度，让用户能够将注意力集中在内容上」。

而的玻璃拟态则更加注重垂直空间 z 轴的使用，背景多鲜艳色彩，在上空使用隔一层高斯模糊的毛玻璃质感，模糊的边界有细微的浅色边框，整体效果就是让元素之间有虚实结合的特殊空间。毛玻璃运用在界面中对关键信息起到强调作用，用户可以看到物体间的层次关系，哪一层在哪一层之上，就像物理空间中真实的玻璃一样。

特点：

• 透气磨砂

• 层级空间

• 简洁拟物

▲引领新拟态风格的Alexander的作品也朝着玻璃拟态变化

▲Kostia Varhatiuk

▲Ghani Pradita

▲Ibrahim emran

▲Queble

实例运用：▲毛玻璃视觉可追溯到2007年发售的Windows Vista，而当时的 OS X Yosemite 也大量使用了这种设计语言

▲的MacOS Big Sur操作系统

▲图标的变化

4、暗黑模式

暗黑模式是白色界面的相反版本，适用于午夜时分。之前用了很长时间微信的暗黑模式，突然切换成白色界面后，就像吸血鬼见到太阳光般刺眼，果然暗黑模式用久了还是比较舒服的。

 暗黑模式和之前经常提到的夜间模式是有区别的，简单来说暗黑模式可以在任何场景下使用，并没有降低对比亮度；夜间模式则专为夜间场景设计，重在降低对比度，以降低在暗光环境下屏幕对人眼的刺激。

特点：

• 突出内容

• 减轻干扰

• 沉浸体验

▲Tom Koszyk

▲Victa Wille

▲Golo

▲https://www.awwwards.com/inspiration/3d-hover-number-reveal

▲Tran Mau Tri Tam ✪

实例应用：

▲有道词典

▲爱范儿（ifanr）

最常使用暗黑模式的车载系统：

▲小度车载

暗黑模式的灵感最早引起大家注意的应该是抖音，在这之前大部分的应用都是白色为主，抖音整体黑色界面带来的沉浸以及轻打扰体验还是很棒的，在这之后也相继出现了以黑色为主的APP设计：

▲MOO音乐(可手动切换颜色模式)

▲Space FM

5、多彩高对比度界面

受Material Design调色板的影响，2020年用户界面趋势的一定不能少了亮色和荧光色的，可以作为主色也可以作为辅色，简约的界面中明亮大胆且对比鲜明的色彩一直都处于增长趋势。荧光色一直是90后喜欢的风格，我个人就非常喜欢荧光色，现在要是谈到该风格的受众主力军可是90后啊。

颜色是为界面添加信息和情绪以及使其看起来美观和吸引人的最有效方式之一，对比鲜明的颜色在白色和黑色界面上都能很快吸引用户的注意力，这种风格已经成为清新、酷炫、数字时代的代名词，而在2021一趋势还将会继续影响UI、平面、广告、插画等领域。

特点：

• 活泼大胆

• 对比鲜明

• 潮流科技

▲Amy Martino

▲Halo Mobile

▲Anastasia

▲Paolo Spazzini

在网站设计中的应用：

▲https://www.theartcenter.nyc/

▲https://www.squadeasy.com/en/

▲https://takeboost.com/

实例应用：

▲GoFun出行

▲开言英语

6、抽象几何元素

从上世纪初开始，抽象构成中的简单几何形状就已经用于视觉艺术中，多用于主背景主题或色彩细节，使用钢笔工具编辑最简单的形状（正方形，圆形、椭圆形），加上不同的颜色或渐变，让设计看起来既规则又有趣。

几何图形可以运用到UI设计中 ，将它们混合在一起以创建马赛克的效果，形成具有品牌意向符号的记忆点。

特点：

• 规则组合

• 品牌印象

• 重复记忆

▲Johnny Nova

▲Vladimir Gruev

实例应用：

最近看到的一组原色视觉刚好融合了高对比度+几何这两种风格，那就是SHINee的正规六辑合辑《‘The Story of Light’》，采用红黄蓝三色加上圆形、正方形、三角形的大块面积来打造画面空间及变化，带来极具视觉冲击的音乐色彩与魅力。

▲专辑的主视觉

当然，几何形状不止用于色彩图案细节，在UI界面布局中经常使用大块面图形，这种设计方法受到越来越多的关注。

7、极简风

极简设计的前身是2010年代中期精巧又花哨的设计，这种设计已经存在很长一段时间了，但在2020年，人们每天需要消化的信息量越来越多，所以现在用户想要尽可能避免“视觉垃圾”，这也是为什么我们会选择更简洁专一的界面。

特点

• 专注信息

• 清晰易用

• 简单操作

▲RonDesignLab

▲Quan

▲BAOLIN

▲Gregory Loshakov

▲https://snp.agency/en

谈到极简主义，就不可避免会涉及到无键趋势，因为按键越少就意味着设计越简洁，而这种简化过的设计将让手势操作和语音交互更为流行。

▲Taras Migulko

▲Gleb Kuznetsov✈

实例应用：

▲夸克浏览器的夸克宝宝

8、将视频应用到UI中

在 2020 年，信息的触达的速度将会变得更快，而视频是很好的载体，各个年龄段的用户都喜欢观看引人入胜的动画，无论是选择通过短视频还是电影的方式来推广产品，都很好地灌输品牌理念，建立与受众群体的关系，加强用户忠诚信任感。

特点：

• 营造氛围

• 类型多样

• 品牌调性

▲Fireart Studio

▲Ehsan Rahimi

实例应用：

▲moo音乐登录页

▲虾米音乐欢迎页

9、插画与3D的界线越来越模糊

艺术插图从2017年开始到现在仍然很流行，几乎适用于任何类型的设计行业，是设计领域中最热的趋势之一。插画的视觉能很好的帮助用户理解产品背后的故事，为了把故事讲好，我们可以创造出一个品牌人物，赋予他人格，为他制造一些故事和冲突，最终帮助我们解决产品问题。这是在产品设计中讲好故事的基础，至于讲故事的方式，在 UI 和 UX 中都有使用，原理一样只是落地方式不同。 

在2018年的蜘蛛侠平行宇宙中我们就已经看到了3D与插画的结合，艺术家保留了人物在美式漫画中的的线条笔触，把“手绘”的细节和质感都放大到了荧幕上，在剧中还采用对比强烈的大色块扩大了视觉张力，分分钟把漫画书甩到面前，让人忍不住惊呼，索尼的艺术家们是怎么把片子做得这么酷！

▲3D人物的画笔触感

▲画面光源处由波普圆点组成的背景

▲纸本漫画书中的“声音词”

▲漫画经典线条

▲Entei Ryu在3D建模使用插画质感

▲Minh Pham ✪在ui界面中的尝试

实例应用：

腾讯旗下音乐平台JOOX最近的概念宣传片，从MG、三维、定格、插画多个风格之间来回切换，给我们带来了一个多元的音乐世界。各大视频网站还搜不到，不能直接链接视频地址，喜欢的朋友可以关注微信视频号“UoU_Studio”观看完整视频。

在3D开始迅速发展的阶段，二维与三维之间的界限变得越来越模糊，插画作品也可以具备强互动性，而3D插画与动效的结合提供了一种奇妙的新方法，希望能够看到未来插画更多的可能性。

10、更多的微交互动效

最后一点，还是要强调动效在UI中的的作用，微交互最早出现在 2018 年，让用户更好地理解系统如何工作，并在引导其获得更好的体验方面扮演着非常重要的角色。它们在 UI 设计中决定了一个 App 或网站是普通还是优秀，从点击反馈、加载等待、导航交互等等，为用户界面设计增加了动态性，交互性和直观性。

动效起到的作用：

• 引起人们对应该做什么或接下来将要发生的事情的关注；

• 创造流畅和视觉愉悦的过渡；

• 带给使用者美观的享受；

• 指导我们进行复杂的操作；

• 确认用户使用旅程中的操作。

▲Jakub Antalik

▲Forever D.

▲Kingyo

▲Eugene Paryhin

▲Leo Natsume

▲Taras Migulko

实例应用：

▲GoFun选择车辆后的页面转场动效

结尾：

2020的趋势在满足用户的美学要求上，侧重内容和感情表达，还会根据不同设备载体、新的技术而变化，为用户提供的丰富体验。

借用Adobe设计副总裁 Jamie Myrold 的一句话：如今设计师要思考的，绝不仅仅是设计一款App、网站或设计工具。我们要思考的是人类的需求、用户的需求，打造真正人性化、多元化与包容性的设计。

设计趋势还在快速增长变化，有些趋势总能长期霸屏，未来还将迎来更多新技术，每个设计人员都可以找到自己喜欢的方向，不管哪种趋势，最重要的是如何学习并合理地运用到产品中，以产生最大的设计商业价值。

文章来源：UI中国   作者：_阿丹a_

蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务