越来越火的To B行业，在 2021 年有哪些值得关注的设计趋势？

去一年 COVID-19 肆虐球，封锁与隔离使我们与数字世界的互动方式生巨变，使得我们在数字世界的时间变得更长，我们思考与互动的方式也产生变化，新冠病毒的爆也为 2021 年的设计趋势带来了新思考。

本文主要理了 2021 年设计趋势与思考，主要为 ToB 。随着业互联网业发展和数化进程，设计工具以及生也在不断进化发展。在 5G、工智能、大数据、云计算、物联网技术浪潮下，设计团队也提出了更高要求。

行业趋势

1. SaaS 趋势：一线工作者将成为决策的中心，“职前线”是态。

工作一直在我们的社会生中发挥着重要作，但从未像在疫情期间那样重要。在疫情期间，数月的封锁给人们的情感健康带来了损失。当然这有助于远程感知的技术和工具的发展和进步，但是还有很长的路要走。

于线员工来说尤其如此，不幸是，线员工常与公司联系最少，最容易感染该病毒。诸如教师，生，零售员和制造工类基本工常法获与事相公司范围内技术。许多甚至没有公司电子邮件，甚至没有办公桌。

△ @Farhan Fauzan

但是，司开始意识到一职工（他们通常是客户的一个接触点）以为组织带回宝贵而独特的见。企业现在正试图通集中工具来完成任务，例轮班或与他们的手机即时共享重要的健和安信息，从而使工的工更轻松。

△ @Barly Vallendito

普华永道副主席、风险投资与创新全球领导者 Vicki Huff 指出，数字化解决方案这里发挥重作用。”了 2021 茁壮，企业需将员置于作空间理念的中。通过对员体验的磨练，雇主可以提高产力，增加参与度，并创造出多连接高效的劳动力。实这一目标的核将与公司的技堆栈相整合，并员人提供性化服务的数字化解决方案。”

2. 数字健康与员健康趋势

我们对 COVID-19 的了解还不够，但这将会可穿戴设备，远程医疗人智能新数字健康发展机会。到 2021 ，我们可以预料这些技将继续发展。

还了一些出色的监控应用程序应用于可穿戴备，可提供有关步数，睡眠，心率或血压的即可视化数据。这些复杂的功能使用户能够掌控的康，并告知如何改变生活方式。

医疗保人工智能软件，硬件和服市，预计 2025 年全球将超过$ 340 亿@Businesswire

△ Pillo Home Healthcare Robot @415Agency

Oracle-Workplace Intelligence 最近对 12,000 名员工（包括 3,100 名 C 高管）进行的一项调查显示，企业领导者任何人一容易受职业压力的响。71％的高管表示 2020 年是有史以来最紧张的工作年，而 53％的高管表示在工作中遇神康问题。

△ @ILLO

专注于改善员工的福祉仅是正确的事情，而且公司意识到这可务绩效。这就是为么他们正在寻技术和他工具来工作满意，工人健康，可持续性，工作与生的平衡及灵的工作。

或许工智能类技术能于这追求提供要帮助。Oracle-Workplace Intelligence 研究发现，75％员工认为 AI 可以帮助提供其工作至关要信息，自动化任务并减轻压力。报告显示，68％员工宁愿使用而不是经理来讨论工作场所压力。

△ @Shahin Srowar

3. 工智能工程化（AI Engineering）

多年来，们担心自动化技术在企业迅速普及会导致工作岗位减少。现实要乐观多：自动化不是要替换工作，而是要增强工作。

司道，工在重复的工上花费太时间。因此，越来越地使用机器人来执行任务，例归档工单，送和签名文档以及与同换每小时的班次等。由自动化，企业将更的精力投到改善工文化和确工对工满意的工上。

人智能程化立足于三核支柱：数据运维、模型运维发运维。强的人智能程化策略将促人智能模型的性能、可扩展性、可解释性可靠性，完全实人智能投资的价。

△ @Craftwork Studio

4. 企业数字孪

数字孪真实世界环境、产品或资产的虚拟表示，用于多种目的。制造商使用数字胞胎理机器厂的性能效率，城市规划者则使用它们模拟新发项目的潜影响。2021 数字孪将会联网（IoT）平台中广泛的应用。

△ @azure.microsoft.com

5. 全面体验（Total Experience）

Gartner 将多重体验义一种重的战略科技趋势。今，这一趋势又一发展全面体验（TX），将多重体验与客户、员用户体验相联系。Gartner 预未三中，提供 TX 的企业机构关键满意度指标方面的表将超越竞争对手。”由于疫，移动、虚拟分布式互动日益盛行，因此企业机构需 TX 策略。TX 将改善体验的各组部分，实业务果的转型。这些相互交织的体验企业运用创新革命性体验实差异化，从从疫中恢复的关键驱动力。

△ @Hamza Abdelhak

6. 行互联网（Internet of Behaviors）

行互联网（IoB）不断涌，许多技都捕获并使用人们日常活中的“数字尘埃”。IoB 汇集了面部识别、置踪数据当直接关注人的技，并将结果数据与金购买或设备使用相关的行事件相关联。

企业机构使用该数据来响人的行为。例如为了在疫情期间监控对康规定的遵守情况，企业机构可以通过使用 IoB 计算机视觉来查员工是否戴着罩或通过热成像来识别发热者。

Gartner 预测，到 2025 年末，全球一半上的人口将至参一项商或政府的 IoB 计划。虽然 IoB 在技术上可成为可，但社会各界将对各种影响行为的方法展开广泛的伦和社会讨论。

△ BayouFord Driver App@hamam zai

7. 络全格（Cybersecurity Mesh）

络全格使任何人都可全地访问任何数字资产，无论资产或人员位于何处。它通过交付模解除策略执行与策略决策之间的联，并使身份验证成为的全边界。到 2025 年，络全格将支持超过一半的数字访问控制请求。

Gartner 研究副裁 Brian Burke 先生认为：“新冠疫情加快了耗时数十年数化企业变革过程。我们已经越过了个转折，大多数企业构网络资现在都已出传统物理和逻辑安全边界。随着随处运不断发展，网络安全网状组网将成为从受控设备安全访问和使用云端应用与分布数据最实用法。”

△ Digital security@Stephane Vasadze

体验趋势

1. 虚拟现实&增强现实（VR&AR）

虚拟现实（VR）再次兴起

VR 一直以来是“未来派”术的代表之一，在相当一段间却难成为主流，当然这 Facebook 的 Oculus Rift、HTC Vive 和 PS VR 之类头戴相关备高昂的价格标签也有一定的关系。

过由于最 VR 游戏的发行成功，包括“半条命”（Half-Life Alyx），VR 热再次上升。兴厂商为态和创性的混合现实构建的解决方案；此外，医疗健康，在线展览和娱乐艺术的需求在增。

虚拟现实游戏行的全球收入预计从$ 4 亿在 2017 年到 2024 年增长到$ 24 亿。@Statista

△ 软 HoloLens 展示了“计算的新现实”。@microsoft.com

那么除了游戏行该如何进军 VR 场？在疫情期间，GDC 在 2020 年使 VR 中持了他们的演讲，使远程参会者够 360 观看展台，通过络研讨会和聊天室进行互。在 2021 年，我们可看到更多的企会利这项技术来触及全球更多的户。

△ @Mikhail Gorbunov

时我们可以预见在数疗使用大量 VR 可以改善慢性疼痛，焦虑症和创伤后应激障碍治疗。我们甚至可能会看到剧院和物馆采用了这项技术，以保持公众虚拟开放。

设计增强现实（AR）

AR 样是是“未来派”技术代表，已经获越来越多普及。你可以在花园里偶遇头真大小长颈鹿，也可以想象宜家家具设计是否符合家里风格，不少厂商已经透露不少新颖 AR 应用场景。

过于 AR 品全球市场可能骤增至 85％，在未来四年将有$ 1650 亿市场@Statista

根据《业刊》报，苹等公司已经在和组日常用户更容易使用品。这家技巨头正在研发多 AR 品，括可以线连接至 iPhone 并佩戴者发出束内容（如电影，地图等）数眼镜，这听起来似乎有酷？

2020 年 9 月，克·扎克伯格（Mark Zuckerberg）宣布 Facebook 将于明年启动“迈增强现实眼镜路下步”。

△ @sparkar.facebook.com

2. 非接触式互动

语音用户界面（VUI）

在疫情期间，当思考如何在不触的情况下备进行交互，语音和势交互似乎成为了另一种 UI&UX 的趋势。

实早在疫情爆发之前，这种趋势就已经很明显，语音交互是未来几年要的 UI&UX 趋势之一，在设计中可添语音户界面的场景越来越多。例如，您可使语音聊天机器人使访客使语音命令进行通信。虚拟助手是如此。在未来几年中，许多公司将创建整的语音户界面。

学习语音交互设计 → https://www.uisdc.com/zt/vui

△ @ Denislav Jeliazkov

语音互基 AI 人工智能，我们希望最终能通语音助手来决复的问题并且易使用。下一代 AI 助手将具备：高级个化，个化主要的目标是使用户感内容是属的。基语音的助手将通分析语音和面部表情来确认互者的身份。非接触式互，语音优先界面帮助设计师减少用户达到期望结果所必须采取的步骤。

手势控

手势控是一种随着触控屏出现而引的各种手势控机的一种新技术拓展。现在悬空手势已经现在设备上正常工。例，最近欧洲豪华车品牌 DS Automobiles 通空中触反馈和手势展示其新的非接触式控件，声称该系统提供的精度比触摸屏高三倍。

△ Haptics and Gesture Control in Automotive @ Ultraleap

视觉趋势

1. 3D 设计

3D 样是 2021 年设计趋势，3D 设计目前更容易应用在企业品或品应用。

审美是一种循，在长达 12 年的扁平化设计之，Mac 新操系统 Apple Big Sur 也让 3D 在 UI 设计中得到更频繁的使用。

△ @Eric Hoffman

际上早在 2017 年的 Build 大上微软宣采用新的 Microsoft Fluent Design System 就包含 3D 设计的大核心元素：Light（光感）、Depth（深度）、Motion（动画）、Material（材质）和 Scale（缩放）。其中就包含微软最早在 Win7 时代就应用亚克力（毛玻璃）效果，而苹果则将一特挥得淋漓尽致。从 z 轴度出的设计，用它来造出覆盖内容之上的感，令界面元素更有级，更有趣。或许是因为微软并没有很的将 Fluent 应用在际产品中，一直处概念优际。

3D 设的流行离不行业的布道者们的引领，2021  3D 设将入一新的始。

△ @Ryan.Jyu

2021 年，计（艺术家）将彻底开对 3D 效的探索之门，这种趋势将会大量呈现计在各种材质、光效、物理模拟等深入研究的效果。

△ @mav.farm

基于 Web GL 的 three.js 正流行；通过 Web 可随时随地访问 3D 的故事场景，相过，现在的前端框架和库够显著升页面载时效，使得够支持更大更为精细的 3D 场景。

△ @adidaschile20.com

在 2021 年，3D 会变越来越流，尤其是看到日益普及 VR 和 AR 技术。很酷抽象感，不寻常度，您可以在 3D 完成所有操作而需使用真实实体象，例如，您需要展示昂贵或不寻常房子时，这常可以节省更多成本。3D 吸引了们注意力，并使网站更具吸引力，使用户在页上留时更长，转化率也提升了。

△ @experience.soletanche-bachy.com

当技术虽不断展，但 3D 的主要缺陷任存在。3D 对象结构越复，在用户设备上执行的负载也就越大。需要确网站已经优化完，以证以显示完整的动态效果。否则用户遇到加载慢或失败的情况下适得其反，用户产生严重流失。

△ @Gleb Kuznetsov

2. 动态化设计

我们相信所有年龄阶段的用户喜欢观看引人胜的动画故或者互动画动。尝试使用简约的界面与大胆有趣的元素结合在一，既吸引用户，也能证信息清晰明。

2021 ，动画设案例将越越多。无论界面 UI 动画，还型营动画（包含 3D），技的发展将全新的体验。

△ @richardmattka.com

3. SVG（可伸缩矢图）的广泛应用

过去企业应用设中，由于浏览器兼问题导致办法完全覆盖 SVG，除了可以应用全局 SVG Icon 以外还可以通过 SVG 绘制矢插图，插图使用 XML 义基本属性，例如径、形状、字体颜色以及高级的功能。

△ @Huseyin

当提高显示辨率，PNG、GIF 和 JPEG 会丢失质量。而 SVG 可以任放大或缩矢量格式而不会降低质量。相比位图，SVG 有更轻量的体积，更快的访问速度。

4. UI&UX 轻量化计

UI&UX 持续简优化已然是趋势，更少的字段显示更少的字段填写。即使用户达所需结果所必须采取的步骤也是如此。

注册与登录步骤就是案例，2021，请勿强迫户记住密码。例如，在在线商城中，户的个人标识符可是他们的电话号码或生物特征数据。

△ @developer.apple.com

苹公司出了“级按钮”，它替代了随数据进网络注册。在许多应用程序，您现在需个按钮即可注册，而需社交网络参与。

△ @Heavyweight

冗余的 UI 资产给设计系统的护和迭代带来沉重的负担，留核心组件并提升组件用率，去繁化简似乎是未来的趋势。

△ @bn digital

随 iOS  Android 陆续支持了深色模式，深色模式也众应用设的标配。企业级应用的深色模式也将 2021 的趋势之一。

生产力趋势

疫的封锁与隔离给我们的作方式极的挑战，远程办公与线协作将会常态化，如何效的让设师们线协作一直一巨难题。

1. 基于 Web 的在线协作工具，多人实时在线协同

Figma

Figma 是一款免费的在 UI 设计工具，用创建、协、原型设计与设计对接。通时在的设计协能够打破设计师之间的视图壁垒，能够时进行设计共享、修改以及反馈。你无需担心是否存，你的设计稿永远持最新版。平台兼容，只需打开浏览器就以随时随地进行设计。除此之外 Figma 与 Sketch 一样通轻量化主+开放的 API 接口和插件生态系统，富的三方插件市场能够为设计生产带来更的能。

截至 2020 年 4 月，Figma 的估值超 20 亿美元。@斯

△ Figma@Remilla Ty

Miro

团队线上协作的设计思维导图工具，核心功是支持团队在线协作白务，无论是思维导图、各式图表、概念图、还是资讯分析的鱼骨图、值链分析、PEST 分析，Miro 供了丰富的免模。仅如此 Miro 还供了更为丰富的容格式，包括视频、图片、档、标签等。

△ @miro.com

Pitch

在线演示稿工具，支持多人实时在线或离线及跨设备构建。这是一种针对现代团队需求而构建的演示软件。Pitch 可帮助团队更好地协作，效、精美地制作演示稿。

△ @pitch.com

2. 基于 Web 的轻量化工具

在线工具已然成为一种趋势，从格式转换、图片处到 3D 建模我们逐渐可通过一个浏览器来使这些轻量工具来解决我们实际的设计问题，Figma 已经满足 UI 设计师的生产工具有需求，未来或许有更多基于 Web 的生产工具现。

Spline

Spline 是一款 3D 设计工具，你可无需载客户端在浏览器中创建 3D 项目。Spline 最大的特点是轻量，操作界面跟 Sketch、Figma 结构一致，够 2D 的方式进行 3D 设计；无需 3D 设计基础。Spline 具备基础的 3D 模编辑功，同时供丰富的在线 3D 模库使，模支持添事件，通过设置同模状态进行交互切换。件可导静态图片可免导离线页。

△ @spline.design

Vectary 3.0

Vectary 一款在线 3D 建模设计工具，供免场景、模和材质库，无需从头开始或很长时间建模，升 3D 设计效率。素材库包含上千个免的可自定义 3D 模，及数百种质量纹的材质可供使。VECTARY 现已在 Iphone 和 Android 中全面开通支持 AR 界面，通过在您的上使 Vectary 3D / AR Viewer，每种类的访客都可获得交互式 3D 或 AR 体验。

△ @vectary.com

3. 工具平台化

未来设计工具将仅仅聚焦设计产本身，而是断向设计的上游延伸，打通工作的流程中的各个节点，连接和传递每个节点产物、打通信息流，从设计研究→设计创作→代码实现→项目&资产管，做到全流程全角色全场景覆盖，形成一个更低成本、更捷的团队协作模式。

△ @invisionapp.com/studio

4. 自动化&智能化

户界面设计工具的趋势之一：借助现代工具和技术简设计师的工作流程。例如，Adobe 在 10 月宣布了他们对 Photoshop 22.0 版的更，中包括 Nvidia 的许多令人敬畏的 AI 驱的功，这是一组图像编辑工具，Adobe 称为“神经过滤器”。Sketch App 最更了颜色变量和组件视图功，方更有效的管颜色一致性。Figma 迅速更了为分布式团队添功，包括模和虚拟会议功，这些功使远程协作更轻松。Pixelmator 的图形编辑器的最更具有增强的机器习功和 GPU 驱的图像编辑功。

生成设计（Generative design）是另个潜在 UX / UI 趋势。这是可以分析大量相似数据，找到其定义特征和特征，然后根据所提供数据创新特征数据。

△ @helpx.adobe.com

5. 结构化设计系统

代码结构化思维应用设计工具将是 2021 年趋势，助力设计师构结构化组件。Figma 更新组件变体功能将设计系统组织形结构化，统管理组件多类型、尺寸、以及不状态；优化设计层级，从而简化了资板并更紧密地将组件映射到代码。

△ @Mohamad Rasouli

6. 设计开发态

设计开发态够极大升设计与开发的对接效率，减设计师与开发者直接的隔阂。

例如：你可以创响应设计内容动态框架。过去搭或改个组件需要不断调设计尺寸及距，现在过自动布局设定参数即可自动适应。Figma 自动布局（Auto Layout）功能其实是引入了接近 CSS Box 模型和 Flexbox 在 Web 上工作。

△ @AsiaInfo Design

New Invision DSM 在 Web 端更新开组件管理方式，通将“组件代码”与“设计稿件”绑定，将设计系统进行统一管理；Zeplin 同样也更新设计组件（UI components）绑定代码（React components）的功能，让开同学查看设计稿切图标注时，直接访问已经代码化的组件详情，提升前端开效率。

△ @Wojciech Zieliński

7. 设计稿即代码（Design to Code）

我们常见的 D2C 主要出现在设计付前端工具中， Sketch Mesure、Zeplin，主要功能是导出静态页面代码（HTML+CSS）其问题是：代码机构不合理，护差。目前业内讨论的是图生成代码的能力：通 AI 人工智能将草稿/视稿一键生成护的前端代码，提高前端开效率。

微软的 Micosoft AI 的 Sketch2Code 即通过 AI 训练的 Custom Vision Model 可以针对 HTML 手绘模式执行对象识别，用于将意义的设元素检测到图中，每检测到的元素通过文本识别服务提取手写内，被检测对象的信息及其图中的置被同到底层算法结构中，后对应包含检测到的设元素的布局效的 HTML。

除了基本的静计能力外，动交互、动画展示等等在新一代的计产品面都可以结构化描述的，未来的 D2C 可以运用这部数据来生成交互逻辑、动画代码等。

△ @No-Code web builder@Mohan

结语

计趋势是周期性的，UI&UX 计的新趋势每年都在变化，这是一种审美循环。趋势是必然的，趋势背后是术发展的浪潮。可见的是计创造的可视语言，这是一种段，而更应该关注背后所传达价值。

注作者微信公众号：「AsiaInfo Design」