首页

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

资深UI设计者

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

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

本文主要整理了 2021 年的设计趋势与思考,主要为 ToB 方向。随着产业互联网行业的发展和数字化的进程,设计工具以及生产方式也在不断进化发展。在 5G、人工智能、大数据、云计算、物联网的技术浪潮下,对设计团队也提出了更高的要求。

行业趋势

1. SaaS 趋势:一线工作者将成为决策的中心,“职业前线”是常态。

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

对于一线员工来说尤其如此,不幸的是,一线员工通常与公司的联系最少,但最容易感染该病毒。诸如教师,医生,零售人员和制造工人之类的基本工人通常无法获得与同事相同的公司范围内的技术。许多人甚至没有公司电子邮件,甚至没有办公桌。

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

△ @Farhan Fauzan

但是,公司开始意识到这些一线职工(他们通常是客户的第一个接触点)可以为组织带回宝贵而独特的见解。企业现在正试图通过集中工具来完成这些任务,例如轮班制或与他们的手机即时共享重要的健康和安全信息,从而使这些员工的工作更轻松。

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

△ @Barly Vallendito

普华永道美国副主席、风险投资与创新全球领导者 Vicki Huff 指出,数字化解决方案在这里发挥着重要作用。”为了在 2021 年茁壮成长,企业需要将员工置于工作空间理念的中心。通过对员工体验的磨练,雇主可以提高生产力,增加参与度,并创造出更多连接和的劳动力。实现这一目标的核心将是与公司现有的技术堆栈相整合,并为员工个人提供个性化服务的数字化解决方案。”

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

我们对 COVID-19 的了解还不够,但这将会是可穿戴设备,远程医疗和人工智能等新数字健康发展机会。到 2021 年,我们可以预料这些技术将继续发展。

我们还看到了一些出色的自监控应用程序应用于可穿戴设备,可提供有关步数,睡眠,心率或血压的即时可视化数据。这些复杂的功能使用户能够掌控自己的健康,并告知他们如何改变生活方式。

医疗保健人工智能软件,硬件和服务市场,预计到 2025 年全球将超过$ 340 亿@Businesswire

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

△ Pillo Home Healthcare Robot @415Agency

Oracle-Workplace Intelligence 最近对 12,000 名员工(包括 3,100 名 C 级高管)进行的一项调查显示,企业领导者与任何人一样容易受到职业压力的影响。71%的高管表示 2020 年是他们有史以来最紧张的工作年,而 53%的高管表示在工作中遇到精神健康问题。

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

△ @ILLO

专注于改善员工的福祉不仅是正确的事情,而且公司也意识到这可以提高业务绩效。这就是为什么他们正在寻找技术和其他工具来提高工作满意度,工人健康,可持续性,工作与生活的平衡以及灵活的工作安排。

或许人工智能之类的技术能对于这一追求提供重要帮助。Oracle-Workplace Intelligence 研究发现,75%的员工认为 AI 可以帮助提供对其工作至关重要的信息,自动化任务并减轻压力。报告还显示,68%的员工宁愿使用机器人而不是经理来讨论工作场所的压力。

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

△ @Shahin Srowar

3. 人工智能工程化(AI Engineering)

多年来,人们一直担心自动化技术在企业中的迅速普及会导致工作岗位减少。现实要乐观得多:自动化不是要替换工作,而是要增强工作。

公司知道,员工在重复性的工作上花费了太多时间。因此,越来越多地使用机器人来执行这些任务,例如归档工单,发送和签名文档以及与同事交换每小时的班次等。由于自动化,企业将更多的精力投入到改善工作文化和确保员工对工作满意的工作上。

人工智能工程化立足于三大核心支柱:数据运维、模型运维和开发运维。强大的人工智能工程化策略将促进人工智能模型的性能、可扩展性、可解释性和可靠性,完全实现人工智能投资的价值。

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

△ @Craftwork Studio

4. 企业数字孪生

数字孪生是真实世界环境、产品或资产的虚拟表示,用于多种目的。制造商使用数字双胞胎来管理机器和工厂的性能和效率,而城市规划者则使用它们来模拟新开发项目的潜在影响。2021 年数字孪生将会在物联网(IoT)平台中有更广泛的应用。

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

△ @azure.microsoft.com

5. 全面体验(Total Experience)

Gartner 将多重体验定义为一种重要的战略科技趋势。而在今年,这一趋势又进一步发展成为全面体验(TX),将多重体验与客户、员工和用户体验相联系。Gartner 预计在未来三年中,提供 TX 的企业机构在关键满意度指标方面的表现将超越竞争对手。”由于疫情,移动、虚拟和分布式互动日益盛行,因此企业机构需要有 TX 策略。TX 将改善体验的各个组成部分,实现业务成果的转型。这些相互交织的体验是企业运用创新革命性体验实现差异化,从而从疫情中恢复的关键驱动力。

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

△ @Hamza Abdelhak

6. 行为互联网(Internet of Behaviors)

行为互联网(IoB)不断涌现,许多技术都在捕获并使用人们日常生活中的“数字尘埃”。IoB 汇集了面部识别、位置跟踪和大数据等当前直接关注个人的技术,并将结果数据与现金购买或设备使用等相关的行为事件相关联。

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

Gartner 预测,到 2025 年末,全球一半以上的人口将至少参加一项商业或政府的 IoB 计划。虽然 IoB 在技术上可成为可能,但社会各界将对各种影响行为的方法展开广泛的伦理和社会学讨论。

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

△ BayouFord Driver App@hamam zai

7. 网络安全网格(Cybersecurity Mesh)

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

Gartner 研究副总裁 Brian Burke 先生认为:“新冠疫情加快了耗时数十年的数字化企业变革过程。我们已经越过了一个转折点,大多数企业机构的网络资产现在都已超出传统的物理和逻辑安全边界。随着随处运营的不断发展,网络安全网状组网将成为从非受控设备安全访问和使用云端应用与分布式数据的最实用方法。”

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

△ 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

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

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

那么除了游戏行业该如何进军 VR 市场?在疫情期间,GDC 在 2020 年使用 VR 中主持了他们的演讲,使远程参会者能够 360 度观看展台,通过网络研讨会和聊天室进行互动。在 2021 年,我们可以看到更多的企业会利用这项技术来触及全球更多的用户。

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

△ @Mikhail Gorbunov

同时我们还可以预见在数字医疗中使用大量 VR 可以改善对慢性疼痛,焦虑症和创伤后应激障碍的治疗。我们甚至可能会看到剧院和博物馆采用了这项技术,以保持对公众的虚拟开放。

设计增强现实(AR)

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

通过对于 AR 产品的全球市场可能骤增至 85%,在未来四年将有$ 1650 亿市场@Statista

根据《行业周刊》的报道,苹果等公司已经在重建和重组日常用户更容易使用的产品。这家科技巨头正在研发多种 AR 产品,包括可以无线连接至 iPhone 并向佩戴者发出光束的内容(如电影,地图等)的数字眼镜,这听起来似乎有点酷?

2020 年 9 月,马克·扎克伯格(Mark Zuckerberg)宣布 Facebook 将于明年启动“迈向增强现实眼镜之路的下一步”。

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

△ @sparkar.facebook.com

2. 非接触式互动

语音用户界面(VUI)

在疫情期间,当我们思考如何在不接触的情况下与设备进行交互时,语音和手势交互似乎成为了另一种 UI&UX 的趋势。

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

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

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

△ @ Denislav Jeliazkov

语音交互基于 AI 人工智能,我们希望最终能通过语音助手来解决复杂的问题并且易于使用。下一代 AI 助手将具备:高级个性化,个性化主要的目标是使用户感知内容是专属的。基于语音的助手将通过分析语音和面部表情来了解确认交互者的身份。非接触式交互,语音优先界面帮助设计师减少用户达到期望结果所必须采取的步骤。

手势控制

手势控制是一种随着触控屏出现而引入的各种手势控制机制的一种新技术拓展。现在悬空手势已经实现在设备上正常工作。例如,最近欧洲豪华车品牌 DS Automobiles 通过空中触觉反馈和手势展示了其新的非接触式控件,声称该系统提供的精度比触摸屏高三倍。

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

△ Haptics and Gesture Control in Automotive @ Ultraleap

视觉趋势

1. 3D 设计

3D 同样是 2021 年的设计趋势,3D 设计目前更容易应用在企业的品牌或产品应用中。

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

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

△ @Eric Hoffman

实际上早在 2017 年的 Build 大会上微软宣布采用全新的 Microsoft Fluent Design System 就包含 3D 设计的五大核心元素:Light(光感)、Depth(深度)、Motion(动画)、Material(材质)和 Scale(缩放)。其中就包含微软最早在 Win7 时代就应用了亚克力(毛玻璃)效果,而苹果则将这一特性发挥得淋漓尽致。从 z 轴维度出发的设计,用它来制造出覆盖内容之上的感觉,令界面元素更有层级,更有趣。或许是因为微软并没有很好的将 Fluent 应用在实际产品中,一直处于概念优于实际。

3D 设计的流行离不开行业的布道者们的引领,2021 年 3D 设计将进入一个新的开始。

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

△ @Ryan.Jyu

2021 年,设计师(艺术家)们将彻底打开对 3D 的探索之门,这种趋势将会大量呈现设计师们在各种材质、光效、物理模拟等深入研究的效果。

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

△ @mav.farm

基于 Web GL 的 three.js 正流行;通过 Web 可以随时随地访问 3D 的故事场景,相比过去,现在的前端框架和库能够显著提升页面加载时效,使得能够支持更大更为精细的 3D 场景。

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

△ @adidaschile20.com

在 2021 年,3D 只会变得越来越流行,尤其是看到日益普及的 VR 和 AR 技术。很酷的抽象感,不寻常的角度,您可以在 3D 中完成所有操作而无需使用真实实体对象,例如,当您需要展示昂贵的汽车或不寻常的房子时,这通常可以节省更多成本。3D 吸引了人们的注意力,并使网站更具吸引力,使用户在页面上停留的时间更长,转化率也提升了。

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

△ @experience.soletanche-bachy.com

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

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

△ @Gleb Kuznetsov

2. 动态化设计

我们相信所有年龄阶段的用户都喜欢观看引人入胜的动画故事或者可交互动画动作。尝试使用简约的界面与大胆有趣的元素结合在一起,既可吸引用户,也能保证信息清晰明了。

2021 年,动画设计案例将越来越多。无论是界面 UI 动画,还是大型营销动画(包含 3D),技术的发展将带来全新的体验。

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

△ @richardmattka.com

3. SVG(可伸缩矢量图像)的广泛应用

过去在企业应用设计中,由于浏览器兼容问题导致没有办法完全覆盖 SVG,现在除了可以应用全局 SVG Icon 以外还可以通过 SVG 来绘制矢量插图,插图使用 XML 定义基本属性,例如路径、形状、字体和颜色以及更高级的功能。

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

△ @Huseyin

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

4. UI&UX 轻量化设计

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

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

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

△ @developer.apple.com

苹果公司推出了“超级按钮”,它替代了随机数据进行网络注册。在许多应用程序中,您现在只需一个按钮即可注册,而无需社交网络的参与。

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

△ @Heavyweight

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

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

△ @bn digital

随着 iOS 和 Android 陆续支持了深色模式,深色模式也成为大众应用设计的标配。企业级应用的深色模式也将成为 2021 的趋势之一。

生产力趋势

疫情带来的封锁与隔离给我们的工作方式带来极大的挑战,远程办公与在线协作将会成为常态化,如何有效的让设计师们在线协作一直是一个巨大难题。

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

Figma

Figma 是一款免费的在线 UI 设计工具,可用于创建、协作、原型设计与设计对接。通过实时在线的设计协作能够打破设计师之间的视图壁垒,能够实时进行设计共享、修改以及反馈。你无需担心是否保存,你的设计稿永远保持版本。全平台兼容,只需打开浏览器就可以随时随地进行设计。除此之外 Figma 与 Sketch 一样通过轻量化主体+开放的 API 接口和插件生态系统,丰富的第三方插件市场能够为设计生产带来更多的可能性。

截至 2020 年 4 月,Figma 的估值超过 20 亿美元。@福布斯

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

△ Figma@Remilla Ty

Miro

团队线上协作的设计思维导图工具,核心功能是支持团队在线协作白板服务,无论是思维导图、各式图表、概念图、还是资讯分析用的鱼骨图、价值链分析、PEST 分析,Miro 提供了丰富的免费模板。不仅如此 Miro 还提供了更为丰富的内容格式,包括视频、图片、文档、标签等。

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

△ @miro.com

Pitch

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

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

△ @pitch.com

2. 基于 Web 的轻量化工具

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

Spline

Spline 是一款 3D 设计工具,你可以无需下载客户端在浏览器中创建 3D 项目。Spline 最大的特点是轻量,其操作界面跟 Sketch、Figma 结构一致,能够以 2D 的方式进行 3D 设计;无需 3D 设计基础。Spline 具备基础的 3D 模型编辑功能,同时提供丰富的在线 3D 模型库使用,模型支持添加事件,通过设置不同模型状态进行交互切换。文件可以导出静态图片也可以免费导出离线网页。

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

△ @spline.design

Vectary 3.0

Vectary 一款在线 3D 建模设计工具,提供免费场景、模型和材质库,无需从头开始或花费很长时间建造模型,提升 3D 设计效率。素材库包含上千个免费的可自定义 3D 模型,以及数百种高质量纹理化的材质可供使用。VECTARY 现已在 Iphone 和 Android 中全面开通支持 AR 界面,通过在您的网站上使用 Vectary 3D / AR Viewer,每种类型的访客都可以获得交互式 3D 或 AR 体验。

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

△ @vectary.com

3. 工具平台化

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

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

△ @invisionapp.com/studio

4. 自动化&智能化

用户界面设计工具的趋势之一:借助现代工具和技术简化设计师的工作流程。例如,Adobe 在 10 月宣布了他们对 Photoshop 22.0 版的更新,其中包括 Nvidia 的许多令人敬畏的 AI 驱动的功能,这是一组图像编辑工具,Adobe 称其为“神经过滤器”。Sketch App 最近更新了颜色变量和组件视图功能,方便更有效的管理颜色一致性。Figma 也迅速更新了为分布式团队添加新功能,包括模板和虚拟会议功能,这些新功能使远程协作更加轻松。Pixelmator 的图形编辑器的最近更新具有增强的机器学习功能和 GPU 驱动的图像编辑功能。

生成设计(Generative design)是另一个潜在的 UX / UI 趋势。这是可以分析大量相似数据,找到其定义特征和特征,然后根据所提供的数据创建新特征的数据。

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

△ @helpx.adobe.com

5. 结构化设计系统

代码结构化思维应用设计工具将是 2021 年的趋势之一,助力设计师构建结构化组件。Figma 更新的组件变体功能将设计系统的组织形式结构化,统一管理组件的多种类型、尺寸、以及不同状态;优化设计层级,从而简化了资产面板并更紧密地将组件映射到代码。

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

△ @Mohamad Rasouli

6. 设计开发态

设计开发态能够极大提升设计与开发的对接效率,也能减少设计师与开发者直接的隔阂。

例如:你可以创建响应设计内容的动态框架。过去搭建或修改一个组件需要不断的调整设计尺寸及间距,现在通过自动布局设定参数即可自动适应。Figma 中的自动布局(Auto Layout)功能其实是引入了接近 CSS Box 模型和 Flexbox 在 Web 上的工作方式。

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

△ @AsiaInfo Design

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

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

△ @Wojciech Zieliński

7. 设计稿即代码(Design to Code)

我们常见的 D2C 主要出现在设计交付前端工具中,如 Sketch Mesure、Zeplin,主要功能是导出静态页面代码(HTML+CSS)其问题是:代码机构不合理,可维护性差。目前业内讨论较多的是图片生成代码的能力:通过 AI 人工智能将草稿/视觉稿一键生成可维护的前端代码,提高前端开发效率。

微软的 Micosoft AI 的 Sketch2Code 即通过 AI 训练的 Custom Vision Model 可以针对 HTML 手绘模式执行对象识别,用于将有意义的设计元素检测到图像中,每个检测到的元素通过文本识别服务提取手写内容,被检测对象的信息及其在图像中的位置被同步到底层算法结构中,最后对应包含检测到的设计元素的布局生成有效的 HTML。

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

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

△ @No-Code web builder@Mohan

结语

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

文章来源:优设  作者:AsiaInfo Design

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


B端C化也许是产品设计的新风向

ui设计分享达人

最近好多朋友加我微信,向我“咨询”一二(咨询真是不敢当,充其量就是一起探讨),基本上集中在 B 端的产品设计上,略加整理,大概如下几个问题出现的频率比较高:

前两个问题百度一下就可以知道,我就不多说了,重点说说最后一个:B 端如今还有什么机会留给设计师们发挥的空间么?

当我在思考这个问题而不得结果的时候,偶然间发现今日头条上线了“我和我的家乡”,可以免费观看,我就利用坐马桶的时间断断续续看完了。说来也挺有意思,感觉恰巧因为这部电影找到了答案:主旋律电影想要被大众接受顺势而为是必然;

从当年火爆到的“建国大业”到去年的“我和我的家乡”都是典型的主旋律电影娱乐化;这个事情让我明白,歌颂祖国未必要手撕鬼子,葛优大爷和沈腾叔叔的段子也可以让我明事理… 所以说不要一味的固守,破局或者顺势有可能是未来的路。我用这个思路套了下刚刚的问题,嗯~也许B端C化是未来 toB 产品的新方向;


NO.1

从设计风格上来讲 B 端产品走 C 端老路的趋势已经越来越明显;从我的角度来看原因主要是(都是在下的猜测),身份模糊(公民和员工之间来回切换)但承载设备不变(都是手机或电脑)的情况下打开的 app 也顺势越来越趋同,依据场景变来变去的诉求大幅降低;再聚焦回来,C端产品从最开始的提倡“花里胡哨”到如今的“高级感”演变过程走了很长,接下来B端也跟随着从“克制/简约”进化到了“高级感”,具体体现在 2 个点上:信息层次和色彩体系;

1.信息层次:封装度高,密度低

不知道大家有没有察觉,在过往使用toB的经验里,会有特别累的感觉?我一直坚持一个观点,不管是UI还是交互做设计的本质同样是对信息的重新编排和处理;通过设计用的舒服才是王道;

C化最核心的一点就是对信息的处理,以往toB产品的信息密度高和模块化封装度低的特质,随着新方向的到来也势必会退出历史的舞台;(PS.这些短语都是知识点哈,赶紧记下来,省的汇报的时候只知道说大白话,不知道怎么用理论支持)。

另外随着MacOS和windows的设计语言升级(一定意义上操作系统也是B端工具),越来越多的产品跟随着走上了“材质区分层级”的路线,这也不失是一种好的做法,阿里云就是个典型:


2.色彩体系:

如果你是我的老读者,应该还记得我之前写过的一篇跟颜色相关的文章,里面有相对还算全面的定义色彩体系的理论和实操,感兴趣的话可以翻看一下,另外给大家准备了色彩样板,有需要的铁子可以可以试试(文末有领取方式)。

这里再啰嗦一句,作为B端来说,万绿丛中一点红是形成“高级感”的最好办法,其他的就先不展开。之前坊间传言B端不需要视觉设计?我是真真的不认同啊,不好看也是烂体验的一种,毕竟颜值即正义,好看并不可耻,中看不中用才是忌讳,别给B端产品瞎定义,做一个既好看又好用的产品ta不香么...


NO.2

从我的认知上讲,用户体验不再区分B/C两端很多年了,但截止到目前为止B端产品的体验远不如C端产品做得;其中的原因无非这 2 点:

专业性上好理解,就是用户基本会被冠以「专业」之名,所以会出现很多「我以为你懂的」的设计理念;对于信息量的庞大与否,坦诚的讲,造成的原因很有可能是交互上对信息的处理处理不到位,反反复复进行单一流程的多次复用,导致看起来很庞大的假象,就这个问题我们展开来说说:

1. “单线程”变“多线程”

B端产品永远的主旋律都是“效率”,简化复杂流程,专注当前任务,是体验的“标准方法”;对于效率的追求我从不否认,但对方法的执行我还是持怀疑态度,打个比方QQ作为C端巨无霸级的产品一早就出现拖拽 tab 上的红点消除所有信息:

如上图所示,这个交互设计解决了把单线程的操作整合成了单个行为控制多线程操作,减少了很多劳动力的重复浪费;这么说有点绕不好理解,用图来表示估计会好理解一些:

类似的产品还有12306的抢票,思路也大致相同,假如你是过年回家需要购票,当你盘算出车次和时间之后,是不得逐条线路抢票?抢票是帮助你规划线路,你只需要设置终点,ta自动分流到,匹配到合适的车次,这就是单操作变多线程的处理办法;

距离QQ的那个交互6年过去了,依旧没有B端产品可以借鉴这个思路(企业im的一键已读不能算哈,这个借鉴不高级),其实很多工作场景下对多线程自动化的工作需求比比皆是,比如很多企业内部上传文件的时候,上传一个等一会,且不说有多么低效,更重要的是工作的节奏遭到了破坏...

概括起来说,在某些场景下(可能是大部分)并不需要专注过程,关注结果的意义也许更大;

虽说打工人天下无敌,但也扛不住面面俱到,设置好工作起点和终点,分配好精力也是B端产品设计义不容辞的责任,其他无关紧要的过程,只要不出大的差错,就随ta去吧~


2. 新手引导和用户反馈要做巧

不管是 B 还是 C 在新手引导的主流方法,基本上是上来一股脑的/倾其所有的给我展示所有功能,每次都是无奈的狂点下一步下一步;但当用了一段时间,发现功能没认全的时候...我再也找不回来新手引导了,哈,没法复现了,这尼玛应该是最糟糕的体验了吧!基于此我建议新手引导要与内容场景相结合,通过场景牵引的方式达到学习操作的目的;举个用户评分的例子:

总之减少用户试错,也必定可以极大优化用户体验。


总结一下

特殊情况影响让今年是企业产品高速发展的一年,各种各样的企业赛道号角都已经吹响,拼功能的年代已经过去,体验有可能是决定购买决策的关键点;所以在不改变功能和底层技术的情况下找到体验突破口是对业务最大的贡献;另外希望别过度迷恋所谓的行业标准方法,试着打破壁垒,站在“产品体验架构师”的角度上才能一览众山小,加油~

文章来源:UI中国  作者:负能量补给站

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

UI设计-个人集锦

前端达人

收藏
收藏
收藏
收藏
收藏
收藏
收藏
收藏
收藏
收藏
收藏
收藏
收藏
收藏



转自:站酷

作者:Lyxi106


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

合群汽车APP

前端达人

为海南合群汽车销售公司设计的一站式服务平台APP



转自:站酷

作者:RainBow丶Lin


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

工具管理系统

前端达人

收藏
收藏
收藏
收藏
收藏
收藏
收藏
收藏
收藏
收藏




转自:站酷

作者:戏欢你


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


产品细节剖析,让你看看大厂是如何做设计的

ui设计分享达人

前言


设计的思考不仅要注重表象层面,也需要围绕信息传达这一设计的本质功能,以充满自省的精神深化和反思自己的设计意识,即做到“好看、好用”。在设计过程中,要站在公司的利益上,懂用户所想,在每一个关键点都要带给用户意想不到的惊喜,这些往往都是通过细节体现出来的。





2021 | 第01篇分享目录(001~015)


001.「夸克浏览器」首个页面-我的地盘我做主

002.「百度」为什么把返回按钮放在了左下角?

003.「优酷」弹幕中毫不违和感的广告推送

004.「QQ」发送图片-便捷的交互路径

005.「美团」减少一步操作、提升一级体验

006.「京东」搜索框-触发用户转化动机的占位符

007.「腾讯视频」付费片-试看6分钟的激进小心思

008.「高德地图」模拟现实事物运行规律的微交互

009.「网易云音乐」定制您的专属首页

010.「夸克浏览器」关键词-提前预知用户的需求

011.「快手」刚刚看多-贴心的用户提醒

012.「腾讯视频」VIP栏目-免费营销策略转化用户

013.「支付宝」城市天气-不仅仅是天气预报

014.「躺平」趣味化的下拉刷新样式

015.「滴滴打车」添加途经点-解决位置不统一的情况





001.「夸克浏览器」首个页面-我的地盘我做主


产品体验:

进入夸克浏览器的首个页面,除此必要的元素之外,看到的是一片纯净之美。长按搜索框下方的空白区域,点击“+”号,可根据用户自己的喜好从弹窗中将想要的站点入口添加到搜索页,便于快捷访问。

设计思考:

UC浏览器可能不是每个移动端用户都知道,但绝对是一方霸主,夸克与UC本是一家。昨天在网上看到一个帖子说“自从用了夸克之后就把别的浏览器全部删掉了,没有天气挂件、没有新闻推送、没有购物频道、没有游戏插件、没有精准广告、就是最原始的上网工具,仿佛在这看到了当年的塞班时代一心一意做用户体验的影子”。迄今为止,没有任何一个应用可以满足所有用户的需求,UC浏览器也是如此,夸克可以将那些视UC为粪土的用户给揽过来,表面上看似抢夺用户,实则是风险对冲,当一个出了问题不是还有另一个么?用户不管是在夸克还是UC,其实都在自家,一个独善其身,一个兼济天下。

用过手机浏览器的人都知道,在资讯爆炸的今天,夸克的画面干净得令人难以置信。在干净的同时,并非是缺少这些站点模块,而是放在了暗处,用户可以根据自己的喜好将站点咨询模块调用出来,自定义空白区域,寓意用户“自己的地盘自己做主”。众所周知,大多数浏览器都有站点推荐的功能,不过该功能都是给相应网站打广告的,内容沉杂,尤其是一些强制性的内容让用户产生了逆反心理,而夸克精选中的网站,则是一些价值很高的优秀站点,并非广告业务,这点可以从致用户的一封信和网站类型得出。这也是夸克被誉为最纯净浏览器的原因之一,不管是APP内容还是用户体验、易用性方面都能提升用户的忠诚度,深得广大用户喜爱。





002.「百度」为什么把返回按按钮放在了左下角?


产品体验:

进入百度APP,页面中80%以上的返回操作入口都放置在左下角,单手操作手机的用户触手可及。

设计思考:

Android智能设备的返回入口其实一直都在屏幕下方,只不过是根据品牌的不同,左右位置不同而已。根据后来大屏手机的普及,为了节约空间资源,使屏幕最大化的被使用,把原先硬件上的部分操作入口给隐藏了,但一直都存在。设计师都知道,iOS与Android的设计规范存在着差异化,比如返回入口就一直在左上角,虽然也有右滑返回的交互手势,但毕竟是隐藏的,而且对于部分页面的左右滑动,只能对tab导航起到作用,基于目前的趋势,手机的屏幕越来越大,单手操作的灵活性就成了难点。

百度APP的大部分页面则是把返回按钮直接从左上角搬到了左下角,被较为激进的用户称为反人类的设计,其实并非如此。大屏幕尺寸已经是趋势,屏幕大意味着内容可以更大限度地得到展示,将返回按钮放在左下角能有效的解决的用户单手操作大屏幕手机操作的难点,更易于操作,提升便捷性。更有效的防止用户因操作困难而导致手机滑落(碎屏),增加安全系数。





003.「优酷」弹幕中毫不违和感的广告推送


产品体验:

在优酷观看视频打开弹幕后,每隔几分钟,系统会推送一条广告穿插在弹幕的内容中,点击可进入对应的页面。

设计思考:

在互联网产品中,花样广告的出场方式屡见不鲜,比如在看视频、看书之前/过程中,总是被突入起来的的广告打断,用户虽然很烦但别无选择,毕竟没有一款真正的既免费又免广告还很牛B的产品无偿提供给用户使用,即便用户觉得自己没有认真看过这些广告,但是只要它们在用户面前完成了播放,哪怕只是听到了,那就完成了品牌意识 的输出这个过程,可能会无形中就知道了这个品牌的存在和定位,在未来的某个场景中,用户会默许和遵从这个品牌的输出方式,乃至消费。广告作为企业盈利的一种方式,不可避免,只会在尽可能减少用户反感或抗拒的情况下自然出现。

优酷APP用了一种较为新奇的方式植入广告,基于很多用户在看视频时都有开弹幕的习惯,直接将广告穿插在了弹幕区域,每间隔几分钟就会推送一条,跟随弹幕一起流动,毫无违和感。虽然广告植入会引起用户的反感,但以弹幕的方式出现,并未占用额外空间及打扰用户观看视频,很大程度上降低了对用户的打扰及观看视频的沉浸体验,增加了用户对广告的接受程度,如果对某个广告感兴趣,点击后面的入口即可直接跳转对应的内容页面。





004.「QQ」发送图片-便捷的交互路径


产品体验:

在QQ聊天对话框,点击工具栏的图片入口调出相册,按住想要发送的图片并往上拖动,松手即可发送。

设计思考:

我们下载到手机的APP,大部分在首次打开时都会弹出一系列的系统权限,比如相册、相机、位置、网络...等,社交类型的更是不必多说,基于应用本身的性质,相册、相机及通讯录类型的权限都是必备开启状态,以便于在使用过程中的图片、视频交流。

QQ开启相册权限后在用户体验上更是举一反三,用户在聊天过程中如果有使用图片的需求,点击后,系统会将手机最近保存的50张图片,按照时间的先后顺序以完整缩略图的方式直接显示在聊天界面的工具栏下方,用户只需按住想要选择的图片并往上拖动,松手即可发送,非常方便,免去了常规的触发跳转页面调取相册的多步骤操作,且有效降低聊天过程中因页面跳转带来的沉浸式的视觉思路阻断,优化了操作路径,提升产品的易用性。





005.「美团」减少一步操作、提升一级体验


产品体验:

在美团订单列表页面,单击其中一个订单从右侧向最左侧滑动,即可出现弹出提示,点击删除完成操作。

设计思考:

删除操作,我们一点也陌生,大部分出现在列表类型的页面。早期智能设备的删除入口基本都是通过右上角编辑或单个内容区域明显的删除图标入口以完成对应的删除需求。后来,也不乏一些应用为了节省页面空间,去掉了明面上的删除入口,通过长按交互操作来完成删除流程,但时至今日,并不广为人知。

美团APP的订单列表,只需将单个内容从右滑至最左侧,从自动出现的弹窗中完成删除操作。其实这种交互方式在目前看来并不新鲜,基本普及了,但关注细节的用户会发现,大部分APP内容的删除,都是在左滑之后调出删除入口,需点击之后才弹出确认框,继而完成删除。美团APP则是在用户有明确删除需求的情况,从右至左大区域滑动并自动触发删除入口,省去点击触发弹窗的操作步骤,正所谓移动界面、体验至上,减少一步操作,就能提升一级体验。

(除了需要对用户的删除操作做出挽留、有营销的多功能隐藏入口外,如无明确需求,建议省略左滑后需要再次点击触发弹窗的这一步操作)





006.「京东」搜索框-触发用户转化动机的占位符


产品体验:

京东搜索框的占位符,会根据用户曾经搜索或查看过的商品关键词进行提示,每2秒钟切换一次,以便提醒用户再次查找之前可能想购买的的商品。

设计思考:

占位符就是在输入框中占住一个固定的位置,然后用户可以根据文案描述或提示语来明确每个表单输入框应当填什么内容,并且能够促进表单输入完成和提高转化率所存在的一个元素。最为常见的就是“请输入xxx”一段提示性质的文案,但如果把占位符的作用仅限于此,那就太浪费资源了。

京东APP搜索框的占位符开启了自动搜索建议机制,不仅展示了平台主推、热门等部分商品的关键词,还通过动态预测用户查询方向,曾经搜索或浏览过的商品关键词会替代占位符给予用户提示。比如用户搜索或购买过狗粮,后续进入APP,系统就以占位符的方式推荐跟小狗相关的商品,比如狗窝、驱虫药、罐头等,虽然不能直接进行搜索,但足以唤醒无目标用户的购物记忆,帮助用户明确购物需求,以便用于迅速作出决策、执行操作,起到提升下单转化的推动作用。





007.「腾讯视频」付费片-试看6分钟的激进小心思


产品体验:

观看腾讯视频付费影片,可免费试看6分钟,时间到了会自动暂停并弹出付费渠道弹窗,付费/放弃观看二选一。

设计思考:

广告和影片付费对视频类型的应用来说,是两个非常重要的盈利渠道。平台除了日常的维护费用外,且不说影片的质量怎么样,单是购买版权就是很大一笔费用,所以收费也是合情合理,用户通常可以通过购买单片或开通平台VIP观看付费影片。使用过腾讯视频的用户都知道,付费影片可以免费试看6分钟,那么为什么不是直接放在付费区域,只对付费用户开放呢?

腾讯视频的试看其实相当于打开用户的潘多拉魔盒,大部分影片6分钟基本已初入剧情,能吊足胃口,激发用户看下去的兴趣,如果用户不喜欢,也有自己选择的权利。通过一小段的试看把付费片的部分价值明确告知用户,用细节不断触达用户心智,达到吸引用户、引导用户转化目的。另外,很多用户都倾向于回报别人的好意,投之以木桃,报之以琼瑶,通过免费时间段的观看,碍于面子心理,也有可能触发用户的付费动机(这个不难理解,比如我们路过某个熟人的水果摊,每次都会叫我们去尝一下,久而久之,即使没有购买需求,碍于面子,多少也会买一点),从而形成转化,为平台带来收益。





008.「高德地图」模拟现实事物运行规律的微交互


产品体验:

高德地图规划路线后,选择出行方式时,用模拟现实事务的微动效图标+文案提示对应的出行方式,直观且趣味的表现方式更有代入感。

设计思考:

我们经常在网上看到这样的问题“高德地图与百度地图到底哪个好用”,准确的说是各有千秋,高德地图用户略多于百度地图,若论起用户使用体验,两家的应用一点都不含糊。在导航软件作为用户出行必备软件之一的今天,不仅仅是认路,更是用户在外吃、喝、玩、乐的一款综合体,其用户体验一直都是企业研究的重点。

使用高德地图选择出行时,出行方式图标以模拟现实事物的运行规律, 利用现有认知,帮助用户轻松掌握界面的使用方式,缩短对出行方式的理解时间, 的降低用户的学习成本。同时图标动效的展现方式,能增加趣味性、以及用户对于界面功能直接操纵的感知,降低操作难度,用情感化方式的表现,提升用户粘性。





009.「网易云音乐」定制您的专属首页


产品体验:

在网易云音乐首页,将页面向上滑至底部,进入自定义排序功能,即可定制用户自己喜欢的专属首页样式以及功能模块的先后顺序。

设计思考:

很多设计团队都深知用户体验至上的道理,但一个应用界面的交互及展现样式不管以何种方式呈现,都不可能满足所有用户的需求,只能在不断追求细节的基础上来满足更多用户。首页自定义在一些部分较为个性化的APP上已经不足为奇了,即根据用户自身的需求,去修改系统、官方提供的页面内容及先后顺序。不过在众多APP的首页自定义功能的认知里,都是对页面的原有功能进行增减及自定义排序。

在网易云音乐APP版本的首页底部也增加了自定义排序功能入口,不同于其他APP页面自定义的是除了能对现有功能进行增减及排序外,还特别定制了三种不同设计样式的呈现以供用户选择,相当于用户随时都可以对首页进行改版。不用的用户都有不同的视觉浏览及操作喜好,比如大卡片、九宫格、操作热区的范围等,网易云音乐通过提供不同的首页样式可以满足更多用户的需求,提供更愉快的使用体验,增强用户的信任感,即多满足一个用户就可能多留住一群用户,降低了用户流失概率。





010.「夸克浏览器」关键词-提前预知用户的需求


产品体验:

使用夸克浏览器搜索相关内容时,系统会自动检索关键词,并将关键词对应的常见内容结果以卡片样式展示给用户,随着关键词的变化,匹配的内容也随之改变。

设计思考:

说到浏览器的作用,想必大家脑海里的第一印象就是搜索,将自己不明白的东西通过搜索引擎从互联网大数据中自动匹配出海量的相关数据链接,提供的信息量非常庞大,包含各色各样的新闻、问答、文章,可以说一应俱全,涵盖一切,其各种浏览器的搜索操作方式大同小异,基本都是通过输入关键词,然后点击搜索出结果。

夸克浏览器在用户搜索的操作(点击搜索之前)过程中,增加了一个细节,即“行为预判”,通过用户输入的关键词,提前预知用户可能想要查找的内容,以简介的方式呈现,给用户提供一个快捷通道,加深用户对此关键词条的认知,快速判断出是否满足自己的需求。系统所匹配的卡片式内容简介是通过数据库长时间的数据分析,提取其中较为共性、常见的内容来反映用户可能出现的兴趣与需求,并合理挖掘使用,通过引导便于用户快速识别并点击,缩短输入时间,还能解决用户对关键词组织不清晰、逻辑不清的用户给与指导,提升产品的易用性。





011.「快手」刚刚看过-贴心的用户提醒


产品体验:

从快手“精选”栏目进入用户主页,在作品列表将所浏览过的视频上标记刚刚看过,避免重复点击观看。

设计思考:

身处移动互联网浪潮之中,我们不难发现,如今的短视频把用户的卷入和参与推向了一个新高度,尤其是生活在大城市高度压力下的年轻用户群。学累了,就想刷个小视频放松下,真以为然后就能集中精力再去学习?其实都是在扯淡,总觉得接下来的某个视频会有种奇异的魔力,一刷就停不下来,就好比在无边无际的海洋中,越喝越渴,别说自身难以碎片化学习,就连老人和小孩都带进来了。抖音和快手作为目前短视频的代表,都有着庞大的用户群,在用户需求基本都能满足的条件下,其战略方向准确的基础上,谁的用户体验最好,谁就是最后的赢家。

快手APP虽然被后来者抖音赶超,但在用户体验上从未含糊过。细心的用户可能会发现,在用户主页的作品列表中,刚刚看过的短视频做作了提醒标记,告知用户少走冤路,避开已看过的短视频,可以避免用户因重复点击观看而浪费时间,且在非WiFi环境下,还能节约用户的数据流量,这个提示算是很贴心了。





012.「腾讯视频」VIP栏目-免费营销策略转化用户


产品体验:

腾讯视频VIP栏目中的电视剧,基本都可以免费看前面的几集,然后根据剧情的发展程度,从免费变成付费,未完结的电视剧还可以通过二次付费进行超前点播。

设计思考:

免费的东西人人都喜欢,古今中外大都如此,免费策略营销也因此有强大的生命力。但互联网应用如若完全免费,不具商业性,可能连基本的日常生活都难以维持。大家都知道,会员付费是影视类应用盈利的一大来源,但用户对付费造成自己财产损失有种天然的抗拒,通常电视剧都提供几集免费观看,然后才硬性要求开通VIP。

视频类应用大都如此,这里以腾讯视频为例。不难发现,付费区不同的电视剧,其免费观看的集数不同,这并不是随意设定,而是根据剧情的发展程度,在某个“高潮”即将迭起的那一集开始收费,通过免费阶段的观看,对用户产生一定的吸引,勾起想要看下去的欲望,从而出现付费动机以促成用户开通VIP。这其中还有一部分互惠原则存在,即给用户免费一部分之后,降低用户付费的心理负担,提高对费用的接受程度,来而不往非礼也。针对未完结的电视剧,如果热度较高,在用户的观看欲望高涨之际抓住机会点,通过二次付费提供超前点播,用户也随之接受。不管是强制VIP还是二次付费点播,其都需要在合适的时间、合适的地点予以合理的出现,才有利于的转化用户。





013.「支付宝」城市天气-不仅仅是天气预报


产品体验:

支付宝首页左上角城市下方提供了天气状况,进入切换地区页面,会展示当前城市最近几天的天气情况。

设计思考:

随着支付功能的普及,几乎也成了每天都会打开的引用,它集合了我们的衣食住行,以前出门不能忘了带钱包,而现在只需要一部手机就能搞定一切。虽然功能众多,但对大部分用户来说,最主要还是归结于支付功能,除了部分线上支付外,就是线下支付了,顾名思义,线下即涉及用户的出行。

支付宝首页城市下方的天气预报,为用户提供了贴心的提醒,便于有出行需求的用户根据天气状况的程度决定是否必须出行或准备出行的必备物品。同时支付宝集合人们的生活服务,即使用户放弃出行,部分事情也可以通过支付宝线上解决,比如外卖、购物等。





014.「躺平」趣味化的下拉刷新样式


产品体验:

躺平APP在页面下拉刷新时,会出现一个倒挂俯冲的“小人儿”动效结合情感化设计,趣味且引人注目。

设计思考:

下拉刷新是APP不可缺少的功能,十分常见,主要从品牌、功能、惊喜、运营、反馈五个维度结合情感化设计。在页面下拉刷新的时候,整个页面也会跟着下移,待页面数据加载完成,页面会恢复到初始状态,在这中间就存在一个时间差,一个好的下拉刷新样式,能让用户通过时间差享受到趣味化的视觉体验及减少等待过程中的焦虑感。

躺平APP下拉刷新使用了品牌IP插图,从外观视觉上是给用户打造品牌印象,倒挂俯冲的“小人儿”动效结合情感化设计,趣味化的用户体验,能在产品特性上带给用户惊喜,勾起回忆,通过视觉跟用户进行情感互动。





015.「滴滴打车」添加途经点-解决位置不统一的情况


产品体验:

使用滴滴出行叫车,用户在行程前输入目的地时,点击右侧“+”符号添加最多不超过三个途经点。司机将按照乘客预先设定多个“途经点”,把多个乘客送达预定位置,每个途经点的停留时间不超过3分钟。

设计思考:

打车模式从之前的线下出租车转战到线上,诞生的了很多叫车平台,其用的最多、知名度最高的当属滴滴出行,线上叫车服务给我们的出行带来的极大的便利。不知道大家有没有碰到过这种情况,几个人一起叫车但下车点不同,等到需要时可能会跟司机发生不必要的纠纷或不愉快的出行。多个人的上车点不同,但终点一样,也会被迫每人都要叫车,因此需要付出更多的金钱成本。

滴滴出行APP的添加途经点功能,完美的解决的多个用户出行的这种烦恼。途经点旨在满足多人共同乘车、个人多点出行等场景下多目的地经停的需求,减少口头沟通带来的误解与不便。途经点可以为乘客停车3分钟,不用额外收费,如乘客需要在某个地点长时等待,则需与司机沟通达成一致即可,随着此功能的上线,滴滴出行为用户提供了更为便捷的打车体验。


文章来源:站酷  作者:大漠飞鹰CYSJ

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


设计的概念

ui设计分享达人

什么是设计?如何定义设计?

设计概论的系列文章是从新设计概论与应用的课程中分裂出来的,整个完整的知识体系参考了100多本设计概论,艺术概论,设计史等书籍的知识,属于非常专业知识。设计概论作为设计的最深层的知识,不应该只应用于考研与学术研究,我个人很希望把这些研究型知识作为应用型知识的参考。


如果问设计师设计是什么,可能大多数人都回答不上来。设计只注重表面形式与风格,就无法产出有深度的作品。每天都在看流行风格与设计趋势,而不探究和挖掘设计的本质相关的知识,设计思维就会被形式所困,风格所限。



目录


1. 第一个故事(电话机)

2. 第二个故事(瓦西里椅)

3. 设计的萌芽

4. 思维延伸(快速过稿)

5. 再延伸(自我思维)

6. 语言与语源




第一个故事


在理解设计的概念之前,我们先讲两个关于设计的小故事,第一个故事,在1876年3月,亚历山大·贝尔申请了电话的专利,早期的电话是壁装式的,是装在墙壁的,上面的两个铃铛起到来电提醒的作用,下面是听筒和话筒;贝尔申请完专利后,同年他发出了世界上第一条电话信息,1年以后创建了贝尔电话公司,从此改变了人们的通信方式。

Alexander Graham Bell  1847~3/3-1922年8月2日 


过了61(1937年),美国艺术设计师亨利 · 德雷夫斯,为贝尔公司设计的以塑料为材料的电话机,如下图所示,别看它表面很光滑像金属,其实它的外壳是塑料材质;

undefined

塑料材质电话机  型号Model 302


金属材质的电话机长这样,观察细节它有拨号盘是用黄铜做的,外壳就是金属的;以塑料材质的电话机迅速代替了以金属为材料的电话机,塑料的成本低,做工工艺要求更低,就这样,塑料材质的电话机迅速风靡全球,影响至世界;

金属材质电话机  贝尔电话MFG公司


那我们纵观电话的发展来看,电话一直不断的进行创新,如金属材质变为塑料材质,座机变为手持电话,还有诺基亚经典手机3210和苹果Iphone12智能手机的出现,都是在满足人们的诸多需求;直到2007年乔布斯发布第一代Iphone手机后,现代智能电话不仅成为了人们必备的通信设施,也成为了人们娱乐和工作的智能工具。

 史蒂夫·乔布斯



这里我们就要思考一下!

为什么要不断进行电话改进?

进行的创新与创造?

 

  


第二个故事


我们坐过的或者见过的钢管椅,如图所示比较现代化的椅子,这种椅子就是用钢管作为骨架的椅子,它的原型,也就是世界上第一把钢管椅,是由包豪斯设计师马塞尔 · 布鲁耶设计的,也就是他做的这个椅子。

马塞尔·布鲁耶与瓦西里椅


椅子尺寸是79×79×79厘米,最大高度42厘米;背靠与座面采用皮革、帆布材料,1925年生产,他的设计灵感来自阿德勒自行车的把手,这里有点抽象,我们找一个实际例子进行对比,大图就是阿德勒自行车,自行车把手和椅子外形很像吧。为了纪念他的老师,抽象艺术大师瓦西里·康定斯基,就把这椅子命名为“瓦西里”椅。

现代钢管椅的设计是瓦西里椅的延伸

 

讲完故事我们需要思考一下。电话机由金属材料改为塑料材料,改良的意义在于要满足当下的需求进行的创新与制造;而瓦西里椅不管是以阿德勒为原型进行设计,还是现代椅子以它为原型进行设计,设计的特性都是在原有的思维基础上进行创新与创造。电话机和椅子的创新都意味着“设计是思维形成的过程”,这也是设计本身的概念。

 



设计的萌芽


上面讲的两个故事因贴近我们的生活,所以理解起来没什么难度。其实这里用“设计的萌芽”来解释这个概念似乎更合理。


设计的萌芽是从旧石器时代开始的,当时人类对一些天然的石块(玛瑙和石英岩等)进行石器的打制(通过敲打的方法进行工具的制造),打制的方法有几种,分别是锤击法,碰砧法,砸击法,间接打法,石器的制作是通过对各种石头的敲打制成的。

旧石器时代特点 - 打制石器


而新石器时代的到来,人类利用骨头、石头和木头等材料,通过磨制的方法来制作各种各样的石器。后来通过改变材料的物理性质为尝试,做出了手工艺美术代表——陶器。

新石器时代特点 - 磨制石器


新石器时代的器物注重实用性与审美性的结合,满足物质需求与审美需求的需要。作品有陶鹰鼎、人头形器口彩陶瓶、漩涡纹罐、弧边三角纹彩陶盆等,石器时代也意味着设计活动的产生。

陶鹰鼎 -代仰韶文化 (约公元前5000年-前3000年) 


从打制石器到磨制石器,以及人类开始使用工具¹利用工具²进行艺术创造活动³ ,新的思维不断发展和形成,就意味着设计是思维形成的过程。


注解¹²:磨制的石器、陶器、畜牧业、手工业和原始农业这些新时期石器的根本标志的出现,就足以说明人类开始更有效地使用工具和利用工具。


注解³ :设计活动是依存于最早的艺术活动中的,也可以直接说设计源于艺术;但艺术的起源一直都是斯芬克斯之谜;而我只能通过格罗塞的著作《艺术的起源》中寻找一些信息。


第三章 - 原始民族 开头写到“艺术的起源,就是文化起源的地方”;

第四章 - 艺术 章节中写道“无论什么时代,无论什么民族,艺术都是一种社会的表现,假使我们拿它当作个人的现象,就立刻会不能了解它原来的性质个意义;是不可以理解,孤芳自赏的各类艺术形态均是社会现象的缩影呢,这个还挺值得探究的。

 

 

思维延伸


我们确定了设计是思维形成的过程后,根据“两个故事”和“设计的萌芽”进行理性的推断,就可以得出设计的定义。从广义的角度去理解,人类一切创造性活动和造物活动都可以称为设计;


狭义角度去理解,设计就是构想和解决问题的过程,应以人为本,通过系统化的方法去满足消费者的市场需求,进而产生功能价值审美价值

 

我们只理解设计的概念(设计是思维形成的过程)和设计的定义是远远不够的,知识是拿来思考拿来使用的,所以这里就要利用“设计是思维形成的过程”这个核心概念,看它能引发什么新的思考,能得哪些相应的体现。


首先要考虑的是 “为什么不能快速过稿” 的问题,设计师是设计思维,客户是战略思维,设计思维考虑的是设计的审美与功能的问题,战略思维考虑的是成本控制,转化率,市场渗透,品牌统一化等等一系列问题;设计师与客户考虑问题的角度不同,思维不同就会产生摩擦与碰撞,造成意见和观念不一致的结果。所以人们的思维模式与认知影响了设计,影响了设计的形成。


当设计思维与战略思维不同频,不同步的情况下,就会产生矛盾与分歧,互相不理解,互相不配合,甚至各自强行给对方灌输自己的思维模式与认知,最后完全由客户来指导设计师做设计,进而破坏了设计的意义与作用。
相反,让两种思维同频,设计师理解客户,客户理解设计师,出来的稿子就能更准确,更能符合实际的客户需求与市场需求,最终就可以实现快速过稿。怎么让思维同频,快速的建立起互相理解的过程呢,这里是有方法的。


客户理解设计师的方法是,设计师通过阐述自身的设计理念来让客户更有代入性的去理解你的设计目的。设计师理解客户的方法,是通过较为客观的研究与分析,来更深入的理解客户的需求。这就需要掌握一手资料和二手资料,从中进行分析和研究,才能对症下药设计出适合客户并满足需求的设计。


一手资料有两个维度的考量,分别是调研方法研究和图文影像资料的研究,调研方法研究里面包含几种研究方法,分别是对人,事,物,环境的观察、直接沟通、客观分析、角色互换、采访(电话/微信/邮件)、问卷调查、小组讨论、民族调查研究(社会性),内容比较多就不讲了..



调研方法研究(研究方法)

客观分析采访(电话/微信/邮件)

问卷调查
小组讨论

民族调查研究(社会性)


图文影像资料研究(资料收集)

自媒体 / 小视频

宣传片

图片资料

现场拍摄

文档资料

录音

音频资料

草图和绘画

H5小程序

 


再延伸


如果说设计是思维形成的过程,那我们设计师的自我思维就直接影响了设计的形成。如我是一个固步自封的设计师,自我思维是封闭的,那又怎么能做出包罗万象的设计形式呢!


自身知识储备不足,又怎么能设计出有层次,有高度的作品呢!正如克莱夫·斯特普尔斯·路易斯(C.S路易斯)说过:你的所见所闻决定于你所站的位置以及你是一个怎样的人。自我思维越完善,知识储备越丰富,看待设计的角度就会变得不同,解决问题的方法也就会更多。

 

思维知识可以扩展延伸出“自我思维”“自我控制”“自我认识”“思维态度”“兴趣点与好奇心”“自我管理”“自我控制”“自我认识”等!


思维知识延伸(基于设计的概念)

自我思维 - 心理学家日莫曼(B.JZimmerman)提出了著名的关于自我思维和自我监控结构;

自我控制 - 自我检查和分析 / 主动纠正偏差 / 及时反馈信息

自我认识 - 自我观察 / 自我图式 / 自我概念 / 自我评价

思维态度 - 心理结构三大因素(认知因素 / 情感因素 / 意向因素),态度的特性(社会性 / 针对性 / 协调性 / 稳定性 / 潜在性),态度的功能(对社会性的判断 / 忍耐力 / 工作效率),态度的形成(欲望 / 知识 / 个体经验),态度的改变(顺从阶段 / 同化阶段 / 内化阶段)..

兴趣点与好奇心- 通过寻找兴趣点与激发好奇心的方式来调动我们的主观能动性 / 内驱力与外驱力

内驱力 - 缺少兴趣的诱因,就会造成工作不饱的自身问题。对所做的工作没兴趣就不会觉得满足,对设计知识缺少探索心理,不会唤醒你自身的紧张状态,是缺乏内部驱动力的表现。

外驱力 - 缺少好奇心的诱因,就会造成工作不饱和的环境问题。每天你都在重复同样的工作,做着类似的视觉效果,处理类似的业务需求,长时间处在这样的环境中,会把你对设计和其他知识的好奇心给磨灭掉,是缺乏外部驱动力的表现。

 


语源与语言


从语言的角度去理解设计,语言是文化的载体,在语言中找到最早描述艺术与设计的概念,就能更好的去理解设计,并能通过更客观的角度去理解设计的概念与定义。

undefined

在希腊语言体系中,希腊语Tekhné(τέχνη)是“艺术”的意思,这个词也有“技术”和“技艺”的意思。

undefined

古希腊人理解的“艺术”涵盖范围比较广,其中包括音乐,绘画,雕塑,手工业,农业,医药,烹饪等。在古希腊人眼里,艺术(审美性)与技术(功能性)是不同的且又不能独立和分离的活动。



其余内容就是课程的知识了!

语源的源头

英语体系中对Design的定义

Design的名词释义

Deisgn的动词释义

Design的语义

考研知识梳理

..

文章来源:站酷     作者:罗耀_系列

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

从2020年终复盘看2021新商机:8个趋势、3个洞察、1种信仰

资深UI设计者

魔幻的2020年已经过去了,我们终于迎来了新的一年。站在2021年的开头,本文作者对2020年进行了总结,盘点了2020年的8个趋势热点、预测了2021年的3个洞察以及为什么新经济公司要做长期主义者,希望读后对你有所启发。

充满期待的2021年已拉开序幕,我决定为2020这一年中值得思考和回味的事情做个总结。桥水基金创始人瑞·达利欧说:如果你不觉得去年的你是个蠢货的话,说明你进步慢了。

2020年的红人新经济领域,究竟经历了哪些有价值的改变和进化?在我的记忆碎片中,瞬间涌现了下面8个趋势热点:

  • “后浪”崛起;
  • 明星红人化;
  • 新国货;
  • 宅经济;
  • 社群卖场;
  • 下沉市场;
  • 红人算法化;
  • CEO带货。

再将上述8个碎片关联起来,清晰呈现了3个行业洞察:

  1. “去中心化”是大势所趋;
  2. 品效合一是必然选择;
  3. “红人”职业化,“职业”红人化

收集碎片,遵循规律,知行合一,我们渐渐踩准了时代趋势。没有预约,时代的机遇也不用刻意安排。

约翰·列侬有一句话:“所有的事到最后都会是好事。如果还不是,那就是还没到最后。”史蒂夫·乔布斯作为约翰·列侬的狂热粉丝,在执掌苹果公司的那些年里,将“长期主义”一以贯之。

什么叫长期主义?“长期主义”的英文叫Long-termism,在我的理解中,就是不赚“短期的钱”,不接受“无战略的盈利”,产品被视作“价值观和信仰的载体”。

8个趋势热点,3个行业洞察,和长期主义信仰,作为我这里复盘2020的基本脉络。如果还没有把复盘、反思当作习惯,也许你的工作还没正式开始。行动时尊重未来的自己,复盘时尊重过去的自己。

一、盘点2020年的8个趋势热点

有人用一句话回顾2020年:“我们无数次凝视深渊,也无数次被深渊凝视。”我们何曾想过,某些时间买个口罩那么难,回一趟家那么难,电影院开个门那么难,奥运会开个幕那么难……

哪怕挑战多多,2020年的新经济热点和亮点仍是层出不穷。

1. 趋势热点之:“后浪”崛起

2020年是一个重要时间窗口,95后、00后的年轻世代,即“后浪”们,正在形成新的流量中心。

你在抖音、B站、快手上看到的,尽是一些诸如“爷青回”、“有内味了”、“AWSL”、“真香”这类新词,类似李子柒、朱一旦、华农兄弟这些网络红人,不断创造很多新的、有趣的东西掀起了“后浪”们的热情。

“后浪”们眼中的有趣,是随心、随喜的。

比如,华农兄弟在院子里宰杀动物,一只公鸡无意中路过,进入了视频画面,观众们一看,像是来送终的,于是“送终鸡”的弹幕流行起来(跟韩国演员宋仲基的名字发音一样),成为华农兄弟走红的一个标配。

农村生活的平淡无奇,可以在“后浪”粉丝的筛选、反馈之下,成为一个一个传播力甚广的红人标签。

任何可以调侃的素材,刺激笑点的瞬间,在“后浪”们眼里,都可以作为话题,作为一种小众爱好,凝聚粉丝,积聚流量。他们时刻想知道,这世界上还有哪些未知的生活方式。

流量向哪里迁移,商业也随之发生变革:流量从线下转移到线上,诞生了亚马逊、淘宝和京东商城;流量从PC端转移到移动端,由于移动端可以随时在线、随处定位,诞生了美团、饿了么和滴滴;流量从四面八方向红人、意见领袖身上转移,天下秀、B站、完美日记逐渐成为焦点。

2. 趋势热点之:明星红人化

2020年,很多一线红人逐渐“明星化”,部分一线红人“带货”流量远超过一线明星,有淘宝主播、有脱口秀红人主播活跃于热播综艺,受关注度都不输影视明星。

很多影视明星在疫情之前就遭遇“失业潮”了,他们不断寻求新的出路,比如主动进入直播电商领域,商业效果反而不敌那些一线红人,于是出现了“明星失业、红人补位”的声音。

影视明星是否真的被草根红人打败?这不是重点。明星主动进入电商直播间给消费品牌“带货”,已经不是新闻了。

明星带货和红人带货的消费逻辑大不相同:红人带货就是物美价廉,高性价比,邻家女孩真诚推荐;明星带货则撬动了粉丝们的“养成心态”,粉丝要支持偶像(爱豆)成长。

直播带货的最大商业阻力,大概就是“人红货不红”了。很多影视明星的粉丝量特别大,也积极尝试直播带货,但翻车的情况不少。影视明星往往太过表现自己,抢走了观众本该对产品(品牌)的注意力。

这就像演员和推销员的区别,一个推销员可以成为很棒的演员,可是演员不一定能成为很棒的推销员。因为推销员要同时做到让人鼓掌叫好,让人愿意掏钱买单。演员就不擅长做后一点,这就是隔行如隔山。

重点是让产品成为关注焦点,而不是卖东西的人本身成为关注焦点。很多重要的内容细节,建议参考我之前的文章《为什么你的直播带货赔钱了》。

3. 趋势热点之:新国货爆发

在2020年天猫“双11”成交过亿的品牌里,有16个是入驻天猫不到3年,其中大部分是新国货品牌;同时,诸如大白兔奶糖、回力运动鞋、谢馥春、百雀羚、马应龙这等祖母级品牌,也正在经历一轮复苏。

按照《彭博商业周刊》的观点这背后的最大推手就是95后、00后新世代消费者,因为从2019年开始,95后和00后成了全球最大的消费群体,这个趋势会一直持续到2030年。

95后、00后是中国“正常”一代的开始,他们没有物质匮乏的记忆,也不缺机遇,所以,不用顾虑这顾虑那,而折叠自己、迎合别人,屈就周围环境。他们就是做自己喜欢的事情,做好自己。

95后、00后是“去中心化”的一代,他们眼中已经没有大众品牌、国民偶像了,他们接受信息的来源主要是社交网络、红人社群,他们买东西、看东西,几乎都会给自己打标签,将自己与芸芸众生区别开。

“后浪”们对品牌认同度普遍降低,不是品牌变得不重要了,而是品牌触达“后浪”消费者的路径不同以往了。

现今,在年轻消费者的购物“决策链”中,从兴趣激发(即“种草”),到研究比价,到下单购买,最后到分享裂变,处于中心位置的,是社交APP和社交红人。绝大多数的“后浪”消费者在进入销售渠道前已经做好了购买决定,在美妆和3C数码品类,这种趋势尤其明显。

过去,品牌公司那种广告轰炸+明星代言的常规做法,依然可以奏效,但是效费比已经大大不如从前了。

在这个变化中,娱乐圈也大受冲击,已经不可能再打造类似“四大天王(刘德华、张学友、郭富城、黎明)”那样的全民偶像。相反,红人主播、红人博主、红人UP主们更加契合“后浪”们的胃口。

4. 趋势热点之:宅经济效应明显

“宅经济”是2020年一个热词,新闻媒体谈了很多。“后浪”们的孤乐主义持续升级,宅起来,线上解决一切问题。

  • 2017年,美团外卖服务了1.3亿单身“孤宅”人群;
  • 2018年,国内的游戏总用户数达到6.26亿,其中“孤宅”用户贡献了一大半销售额;
  • 2019年,天猫“双11”的进口商品,不是婴儿奶粉,不是高科技产品,而是进口猫粮;
  • 2020年,红人新经济迎来引爆式增长,游戏主播、红人博主UP主开始成为一种成熟职业,诸如导购、教师甚至菜农等360行纷纷“红人化”。

“后浪”们普遍有一种“孤乐主义”心态,与其在人群中委曲求全,宁愿选择自己宅起来。阿里研究院的数据显示,95后、00后人群当中,一个人看电影的比例高达54%,一个人叫外卖比例达到了33%……

所以,阿里电商系统开始推一人食、一人租、一人旅行、一人火锅以及迷你小家电、自助唱吧等等。这是一种“单人的乐活模式”,更是一种新的商业布局。

这个商业生态包括远程办公(阿里钉钉、腾讯文档、华为云WeLink)、网购电商(京东、淘宝天猫、拼多多)、社交社区(微信、陌陌、西五街、小红书),资讯服务(头条、百度、腾讯新闻)、外卖生活(美团、饿了么、58同城)、娱乐视频(抖音、快手、优酷)、网络游戏(腾讯游戏、网易游戏)、在线教育(学而思、新东方、简书)、金融理财(蚂蚁金服、东方财富)等等……

这个商业生态更是包括众多头部、腰部和精致的纳米红人,以及背后的7亿粉丝群体,构成了线上最具人气的商业流量中心。当城市越来越大、新经济生态越来越成熟、人际交往越来越虚拟的时候,“孤独的城市动物”正在催化各种商业创新。

5. 趋势热点之:社群卖场兴起

2020年,红人导购已经成为零售行业的重要武器。红人导购最关注的,是社区团购,就是围绕一个线下社区,以近距离社交为起点,来发起团购。

每一个导购员就是一个带货红人,早上在社群里推“超划算的爆款产品”用于巩固铁粉,晚上发布打折信息,定时发问候红包(现金+菜品折扣)用于培养用户习惯。

一位叫香帅的金融课红人教师,讲过一位“皮皮妈妈”,特别能干,她与附近几个小区的团长合作,没有依靠任何平台,利用微信群建立了近千人规模的“团购合作社”——他们几个团长,本身有超市采购、机场免税店、粮油食品企业的工作背景,有很多供应链资源,可以与厂商直接对接。

他们每周组织团购5次左右,商品品类覆盖蔬菜、水果、肉蛋奶,甚至是羽绒服、化妆品、品包包。

传统零售的接触用户过程,是漏斗型的一级一级筛选用户,先要广泛搜罗用户,然后从众多用户里进行精准定位,找到并影响目标用户,从目标用户里筛选潜在用户,再找到普通用户,最终获得忠诚用户。

社群零售的接触用户过程,是宝塔型的一级一级影响用户,要先去找到忠诚用户,通过忠诚用户去找到并影响普通用户,通过普通用户再去影响潜在用户,最终向广泛的目标用户扩大影响。

传统零售是“越筛选越小众”,社群卖场是“越影响越大众”。

6. 趋势热点之:深挖下沉市场生态

过去,很多创业者总是讲“工匠精神”,要精工细料、要死磕细节。但这是要成本的,产品贵到了一定程度,你的市场很难走出北上广深,商业的可复制性也没有了。比如,30元一杯的星巴克是无法下沉到小县城、小乡镇的。

如果你有打江山的那个霹雳手段,将效率做到感人,将价格压到骨头,从一线都市到六线县城乡镇,你都有办法搞定,让现存的、潜在的对手都怕你,那就算你厉害。

看看中国地图,查查政府官方网站,可以清楚看到未来消费市场新的增长引擎,主要来自于国内2856个“县”、41658个“乡镇”、662238个“村”,他们没有高房价或高租金的困扰,可支配收入并不低。

甚至有人直言,藏在县城的万亿生意,尚未被充分发掘。现在的下沉市场越来越好,一个卖大鸡排的本土品牌,门店数量已经超过麦当劳,一个做刨冰起家的本土品牌,门店数量也超过了星巴克。

我看,突破下沉市场的核心方法论就一句话——站在巨人的肩膀上拉客卖货。这个巨人就是当今中国强大的数字商圈生态。

有人认为,腾讯、阿里巴巴、天下秀、滴滴、美团都在做一件事,就是“线上商圈基础设施建设”,它们在各自的领域里“铺路”和“修桥”,而且这个“线上商圈”是没有城乡界限的。

现今1美金的平均快递成本就可以通运全国,品牌也可随时随地触达8亿网购用户。超过100万的红人,透过IMS天下秀平台直线对接万千消费品牌,红人逐渐成为一种主流的且大受欢迎的新兴职业。

现今,想要开创一个新消费品牌,包括产品的研发设计、制造、物流、营销等环节,都会出现专业化的服务商。你只需要专注洞察、连接及服务好用户,将用户或者消费者变成粉丝,集中精力做品牌就好了。

哪怕你身处遥远的深山、疆域的边缘、城市的角落,只要你懂需求、会表达、能沟通,就可以打造个人IP,直连消费品牌,除了红人主播可以带货,可能一篇好文章、一张好图片甚至一曲好音乐,都可以赋能品牌,都可以带货。

很多农村小哥、小镇青年、偏远地区的民宿业者,靠短视频带货赚钱,或是打农家乐广告招徕游客,已经非常普遍了。

7. 趋势热点之:红人算法化

2020年9月,《人物》杂志刊登了一篇热文《外卖骑手,困在系统里》,近几年来外卖平台通过算法系统压缩送餐时间,建立了一套“超时罚款”规则,使得骑手的工作难度越来越大,甚至越来越危险。送餐小哥活在了算法里,压力很大,网络红人可能也不轻松,红人要怎么当,算法来告诉你。

2020年,几乎所有互联网平台都抛弃了按照纯时间线排布内容的算法,改用打乱时间线的智能算法推荐(最保守的微信公众号也迈出了这一步)。

比如:B站首页默认就是推荐模块,哪怕用户订阅列表里的所有红人全停止更新了,也不影响消费者(粉丝)获取源源不断的感兴趣内容。

比如:抖音的分发机制也变得更加务实,红人创作的内容投喂给算法,算法再分发给用户,用户不会在乎哪个红人创作的,用户只在乎自己的口味。

创业者们一定要知道,内容消费,就是当我们刷抖音、微博、微信看到内容的时候,这些消费是目前为止互联网里面最大的消费,而这些内容的源头是红人博主、主播、UP主。最终靠什么发掘其中的商业价值?

答案是:算法。

Google的商业算法,很好理解,就是用户在搜索引擎里搜过内衣,好的,网页打开之时,就会看到很多内衣的消费选择。

Facebook的商业算法,就是另外一种套路,用户可能曾在社交平台上对一个汽车产品点赞,但他的个人页面上,可能会出现完全没什么关系的度假村内容,因为平台通过大数据分析,知道你是谁,就必然需要什么。

红人新经济时代的算法策略,将红人和场景当作“广告位+新货架”。你看到的那些红人,本质上是一个个算法。 你透过直播互动的数据沉淀,清楚知道用户(消费者)的生活方式,在一种生活方式的背景下,用户想要什么,就很清楚了。

红人为什么会变成算法?

在一个时间段内,哪一个产品最好卖?哪一个定价最好卖?哪一些台词最好卖?哪一些包装最好卖?同时,如何应对直播用户的问答?怎样的问题需要怎样的台词、演示细节进行匹配?如何持续改良行为模式,提高直播效率?……

这些都是靠背后动态沉淀的大量数据,进行矫正、优化的。如何驾驭这些数据,靠的就是一套好的算法。“一线红人们”的一言一行、一个眼神,都是基于直播间人气、销售转化等等数据指标,进行算法矫正的。所以,“一线红人们”就是一个一个人格化的算法。

Google、Facebook以及红人新经济时代的商业算法,决定了用户最终会看到什么内容。

Google的推荐系统,基于用户搜索行为,包括搜索的历史记录等等;Facebook获取的,是用户的社交信息,像是居住地、性别、职业,还有用户在平台上的点赞、留言;红人直播模式获取的,是基于红人、粉丝互动呈现的生活方式数据。

  • 搜索商业算法,瞄准你想要什么;
  • 社交商业算法,瞄准你是谁,然后一定会需要什么;
  • 红人商业算法,瞄准你想要什么样的生活方式,自然需要什么。

需要更多深度观察,请参阅我之前的文章《算法时代,伟大的公司如何痴迷于客户》。

8. 趋势热点之:CEO带货潮

2020年的消费市场,典型特征就是“看人下单”,每一个内容账号的背后,每一个红人主播、博主、UP主的背后,都是一个细分消费市场。

“后浪”消费群体主要透过社交分享,实现了基于人与人之间信任关系的购买。淘宝的直播带货,快手的达人卖土特产,小红书的大V种草,西五街的新品测评,以及拼多多的熟人推荐,都是看人下单(而非看品牌下单)的逻辑。

CEO们(甚至很多政府官员)纷纷走上一线,亲自进直播间卖货,不一定是要拿到多少销售额,更重要是,赢得需求洞察上的话语权、产业链上的主导权、公司命运的主宰权。

需求洞察方面,近年快速崛起的喜茶、完美日记,几乎都是CEO直接主管内容团队,每天都在网上跟消费者接触,沉淀了更多源于用户的意见,这就有了在需求洞察上的话语权。

尤其是那些年轻创业者,因为预算有限,会选择低成本、红人化的品牌推广,将自己塑造成为一个红人(意见领袖),把流量导向产品销售,经过多次转发、传播,这些红人CEO不仅给企业省下巨大的广告开支,也让年轻消费者觉着他们和自己贴得更近了。

这个商业效果,是不能用带货金额来计算的。产业链话语权方面,很多红人主播直接绕过了品牌,让厂家直接供货,李子柒、薇娅是这样。也有一些红人主播甚至直接绕过厂家,自己做供应链。

多年以前,比尔·盖茨曾经表示:“要么电子商务,要么无商可务。”可是,现在已经不是B2C了,而是直接绕过商家,从供应商那里买东西,甚至自己做供应链。红人直播带货给电商运营效率,带来了革命性的升级。

组织动员方面,CEO亲自直播卖货,也是要赢得公司命运的主宰权。这给人一个清楚信号,“老板都直播带货了,这么拼,你为何不积极跟上?”这不仅是一种广告效果,更是一种“全员营销”的动员能量。

总体看来,CEO主动直播带货,主动参与内容创作、与粉丝(消费者)对话,这种迅速收集消费需求、汇拢资金、按需生产、分发商品的模式,效率远高于传统电商。

可以预期,未来红人直播带货将会成为新消费品牌的新常态,而CEO直播带货也将成为给公司“立人设”的一种灵活方式。需要更多内容细节,请参阅我之前的文章《董明珠直播带货20万,其实是赚到了“2个亿”》。

二、面向2021年的三大洞察

诺贝尔医学奖获得者纽斯林·福尔哈德说过:“解决问题的关键在于收集到足够数量的碎片,并努力积累到这些碎片之间的关联性。”

华为轮值CEO徐直军直言:“经验是华为最大的浪费。”不要轻易放过一段经历和经验,如果能够从每一段经历和经验中沉淀一点未来可能用得上的思考,积累下来就是大智慧。

2020年的趋势热点当中,可以呈现三大洞察:

1. 流量“去中心化”是大势所趋

去年疫情期间,物流受阻,电商平台的效率发挥不出来,“社区团购(红人导购)”进来补位;孩子上学的节奏受影响,红人教师(和助理们)可以P2P(一对一)进行辅导;公司难以集体办公了,小团队一个个可以自行组织工作任务,即“去中心的自组织”……

红人新经济领域的“去中心化”,十几年来是一以贯之的。

十几年前的红人,主要是传统媒体(营造出格事件)催化走红的;后来,有了博客、视频网站,你要走红还得靠平台的编辑优先推荐;有了社交媒体,诸如Papi酱、雪梨等人,靠生活调性走红;现今,大量红人主播承接了短视频和直播兴起的势能,比如李子柒、手工耿、李雪琴,主要靠优质内容走红。

红人新经济本质上是一种去中心化的呈现方式,除了红人、意见领袖之外,某个物品、某个品牌、某个地方、某样美食、某一首歌,甚至某个虚拟形象都可以成为红人主体,进而与粉丝建立起稳定关系,促进了消费变现。

什么叫“去中心化”?

我举两个例子:过去,村里就你家有一部固定电话,好的,你家很快成了村里与外界联系的中心节点;现在,人人有一部智能手机,人人都成了信息节点,那个连接效率是不可同日而语的。那么,最有价值的就是那个掌握大家联系方式的人。

你上视频网站下载电影,你要下载的那个电影,并不是存在视频网站的服务器(中心平台)上,而是存在无数人的电脑上。

视频网站只是维护了一张列表,上面记录着:谁的电脑上有哪部电影,当你的电脑要下载一部电影时,会自动查一下这张列表。那么,最有价值的就是那个掌握大家资源列表的人。

去年,我们公司被“百万红人”送上A股主板市场。天下秀不是中心化的商业强权,而是掌握了红人资源列表,进行“去中心化的商业赋能”。

据克劳锐《2020年中国红人发展年报》显示:综合了微博、微信、抖音、快手、小红书、B站、淘宝直播数据发现,2020年粉丝量大于1万的红人数量已经达到了900万+,而这些红人日均产出内容数量达到了3750万+。

为什么品牌需要我们?

因为品牌需要在正确的时间、正确的场景,连接正确的红人,以正确的传播方式(文字、图片、视频)出场。

为什么红人需要我们?

因为红人也需要在正确的时间、正确的场景,连接正确的品牌,释放商业价值。这么多的“正确”搭配在一起,就需要有大数据和算法进行精准匹配,而我们就提供了这样一种能力。

2. 品效合一是企业的必然选择

过去的品牌公司会有一个基本考量:营销推广、品牌运营是两个维度的,(营销)追求销售效果or(品牌)追求企业调性?预算该怎么投,怎么平衡这个比例?长期以来,是非常伤脑筋的。

2020年则是实现品效合一的关键一年,其中的重要变量就是红人。红人就是把“粉丝”还原成“消费者”的那个物种,品牌则千方百计找到最合适的红人帮忙。

为什么红人商业(红人广告+直播电商)可以促使品效合一的加速到来?背后有两个核心逻辑:

1)效果革命

红人增进了交易效率的空前提高,过去,从产品到消费者,要经过多层渠道商、经销商,到零售店,最后被消费者看见,决定会不会买,这是一个很长的决策链条。

过去的交易方式,付款需要输入密码,网银需要用 U 盾来支付,现在这些步骤都省略了,刷个脸就行了,甚至可以免密支付。

现在,从产品到消费者,只需要一个直播间,只经过一层物流。除了消费链条大幅缩短,供给和需求之间的连通效率大大提高了。

如今所有的直播带货,从带宽、运算、支付、成交,到最后的朋友圈发文炫耀,一个人从决策到购买的链路缩短到3分钟之内——这是中国互联网历史上完全没有过的。

2)品牌革命

红人作为现今最重要的内容生产者,是广告位+新货架的完美合体。本质上,一切的表达都是文案,一切的产出都是创意,一切的产品和品牌都是内容,一切的内容都是广告。

近几年来,消费品牌纷纷借助红人流量,给自身品牌进行“人格化”赋能,要使消费者不仅仅将品牌当作一个僵化的标签,而是一个可交流、有温度的人格IP。

商业的本质就是消费者的注意力在哪里,产品就在哪里。聪明的品牌越来越清楚,能支持自己走得更远的其实是粉丝,而不是哪个标签或者LOGO。

3. “红人”职业化,“职业”红人化

2020年,是红人职业化、职业红人化的重要一年。

无论你是什么学历、什么出身、什么背景、你喜欢什么、擅长什么,你都可以把自己摆在网络平台上,被所有人看见。比如有很多五星级酒店大厨,因为有一门烹饪的手艺,通过短视频教会更多人做家常菜。

也有很多优秀的老师,把黑板搬到了网上,做更广泛的知识普及;还有医生、化妆师、心理学家、装修工人等等,在网络上分享自己的专业经验,获得很多人的喜爱。

红人的“准入门槛”确实不高,只要你有手机,注册一个账号,就可以开始发视频,开直播。但还有一个事实是,步入社会之后,我们说一个行业,一份工作的“门槛”高低,不仅体现在“准入门槛”,更在于职业化。

什么是职业化?不是在工作技能上有多高超,而是你学会把自己的生活人格和职业人格分开。在合适的地方,合适的时候,扮演合适的角色。

任何人把自身的优势发挥到,都可能成为焦点。但是,能不能长久在里面待下去,能不能胜任这份工作,背后仍需要有专业化的技术(数据、算法)引导。前面讲过,算法可以教你怎么做好红人?

算法之外,更重要是你要用自己的本心与这个世界碰撞。

你随意的一个感受瞬间,分享一首曲子,或者发一条微博、朋友圈、小红书、抖音,都在向身边的人传达着你平凡生活中的点点滴滴,可能被人忽略,可能被人厌烦,也许,也许,你也会被人喜欢,被人关注,被人模仿。只要你是认真的,世界上总有一直喜欢你的人。

那些一直喜欢你的人,就是你的价值观同盟,你也可以成为他们的品味代言人,这也是红人的核心本质。人人都有机会成为红人,无疑你也可以,流量和效果不用花钱买,你的口碑和影响力会自然扩散,成为你的私域流量。

给自己的观点找到知音,让自己的(内容)产品遇见懂你的人,这是“红人”职业化+“职业”红人化的内在本质。

三、1种信仰:为什么新经济公司要做长期主义者

所有的美好都是与你环环相扣的,只是需要时间。

复盘2020,进击2021,但是我们不会忘记,把时间和信念投入到能够长期产生价值的事情上,我们始终是长期主义者。

我的理解当中,长期主义不是一个策略选择,不是你想要什么,不是你赌现在收获or未来收获,而是一种绕不过去的必然坚持。

1. 唯有长期主义者,才能踩准风口

我说唯有长期主义者,才能踩准风口,可能有点反直觉。

你看2020年的直播电商引爆行情,从红人到明星、企业家、店主店员,无人不直播,无商家不转型迈入直播电商,大家都要抢这个风口,但真正赚钱的是极少数人。

你以为红人主播、直播电商是“风口上的猪”,但被风吹起来的,一定是长期主义者。这个领域人家已经深耕十几年了,以前默默无闻,现在终于成功了,你说风口来了,可是,风口就是人家做出来的。

红人,是消费品牌与消费者之间的最连接者。

但是要实现这个连接,并不容易。你要匹配红人与品牌,就要有最完整的红人资源清单;你要精准找到人、货、场的优化组合,就要对红人价值合理评估;你还要有专业的红人孵化机制,以及针对不同需求建立传播矩阵、策略组合,这都需要很长时间的积累和沉淀。

我们去年获得了不错的发展成就,你觉得这是站在了风口上,但是背后十几年的长期准备,很少有人看见。

很多看起来像是风口的东西快速到来,那些没有准备的人,或者没有考虑好的人,或者盲目去应战的人,他一定会尝到非常多的失败。因为任何行业机会都是螺旋进化的,一边发展,一边洗牌。

2. 长期主义是反人性、磨心智的

真正的长期主义者专注做一件大事,而这件大事一定是一直默默取得进展,这个过程是反人性、磨心智的。

“股神”巴菲特总是把自己的投资策略(长期投资、价值投资)开诚布公,贝索斯有一次忍不住问:“你的策略这么简单,为什么大家不照抄你呢?”

巴菲特的回答耐人寻味:“因为没有人愿意慢慢变富。”人性啊,显然更喜欢见效快的努力。

长期主义者多年专注一个细分领域,不敢越雷池一步。

日本人建筑做得好,日本水泥有100多种。法国人面包做得好,法国面粉有100多种。你离开专业,就所知有限了,不能总听人讲故事,那些讲故事的人大多是业余的,他们的故事也只是科普水平。

有人问我,我公司为何不签约、捧红一些自己的红人?我说:“我公司没有红人,也不去签约和捧红某一个红人。但我有红人大数据平台,做了亚洲范围内的自媒体排行榜,甚至教红人怎么成长。

这是我们作为大数据公司、平台公司所应该做的事情”,长期专注,其实是最磨练心智的。

坚守是最不容易的,做好一个企业需要10-20年时间。如果你想做到,可能需要30-40年时间。一个堪称伟大的企业,必须要有50年以上的历练。

在我关注的领域里,基本十年能有一个结果都算比较快了。

四、总结

最后,我想再重复一遍:“很多关键时刻,会有一些运气,比如当下的直播电商热潮,但都不会影响大局。你要保持长期的集中心力建立护城河,也就是那些改不了、夺不走、丢不掉的东西。

真正的长期主义者,不管潮起潮落,人来人往,这些长期不变的东西,就是你公司的基本盘。”

文章来源:人人都是产品经理  作者:IMS李檬

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



万字干货!超全面的色彩与应用指南

周周

万字干货!超全面的色彩与应用指南

色彩是影响用户最简单和最重要的一个因素。研究表明,人们只需 90 秒就能对一种产品做出下意识的判断,而其中高达 60%以上的判断仅基于颜色。因此,选择合适的颜色对于改进产品的转换率和提高产品的可用性是非常有用的。在没有文字的场景中,颜色的搭配非常重要。如何配色可以使设计感更强,如何配色更好看,哪些配色不好看,解决这些问题就需要学习色彩理论。

色彩基础知识

我们身处在一个多彩的世界中,物体的不同颜色,会让我们产生不同的情绪。色彩,即光从物体反射到人的眼睛所引起的一种视觉心理感受,按字面含义上理解可分为色和彩。「色」是指人对进入眼睛的光传至大脑时所产生的感觉,「彩」则指多色的意思,是人对光变化的理解。色彩的基本理论虽然老生常谈,但在 UI 设计中具体怎么运用,还有关于色彩的性格和含义,都是我们需要了解的。因此在学习 UI 配色之前我们先来了解色彩的基础知识。

1. 色彩常识

原色

所有的色彩都源自“红黄蓝”三种原色,很多人误以为三原色是“红绿蓝”,其实不是。红绿蓝是显示上的三原色,计算机屏幕的显示是色光三原色(红 red,绿 green,蓝 blue)即 RGB 组成的,每一个像素的颜色都用三原色值来显示,与美术上的三原色不一样。原色是其他颜色调配不出来的。把原色相互混合,可以调和出其他种颜色。

万字干货!超全面的色彩与应用指南

虽然 RGB 在显示设备上表现良好,但并不够人性化。因为人们判断颜色,往往是通过:这是什么颜色?是不是太艳了?是太亮了还是太暗了?这样的感官维度,而很难通过红绿蓝的亮度层级去判断。所以人们后来基于 RGB 衍生出了 HSB 模式和 HSL 模式。

印刷三原色为青(Cyan)、品红(Magenta)、黄(Yellow)。是减色模式,混合为深灰色,并不能产生黑,所以在印刷时加上黑色油墨,才能产生纯正的黑,就是 CMYK 颜色模式。

万字干货!超全面的色彩与应用指南

间色

又叫“二次色”。它是由三原色两两混合调配出来的颜色。红与黄调配出橙色;黄与蓝调配出绿色;红与蓝调配出紫色,橙、绿、紫三种颜色又叫“三间色”。在调配时,由于原色在份量多少上有所不同,所以能产生丰富的间色变化。

万字干货!超全面的色彩与应用指南

复色

也叫“复合色”。复色是用原色与间色相调或用间色与间色相调而成的“三次色”复色是最丰富的色彩家族,千变万化,丰富异常,复色包括了除原色和间色以外的所有颜色。例如,黄色与橙色混合得到橙黄,红色与紫色混合得到紫红。

万字干货!超全面的色彩与应用指南

冷暖色

最后由三种原色、三种间色和六种复色组成的系统就称为十二色环,从紫色至黄绿为冷色,黄色至紫色为暖色。冷色令人联想到天空、海洋、冰雪等,产生寒冷、理智、宁静等感觉;暖色则令人联想到太阳、火焰、热血等,产生温暖、热烈、危险等感觉。

万字干货!超全面的色彩与应用指南

虽然可以用「冷」、「暖」色系来划分色彩,但配色的变化却有千种万种。借着色彩的组合方式,从「非常冷」到「凉爽」到「暖和」再到「炎热」都可以用不同的配色组来表现色彩的印象。

  • 知识点:

不同的色轮由不同的人发明,他们对于色彩的见解不一样,因此创建出来的色轮用途也不一样。比如:伊顿色轮又被称之为美术三原色,是由颜料的三原色混合叠加而成;RGB 色轮主要运用于电脑、手机、平板等一系列科技产品,RGB 的三原色是光的三原色;CMYK 色轮主要用于印刷领域。

2. 色彩三属性

丰富多样的颜色可以分成两大类,即有彩色系和无彩色系。彩色系的颜色具有三个基本特征:色相、明度和饱和度,在色彩学上被称为色彩三大要素或色彩三属性。

万字干货!超全面的色彩与应用指南

色相(Hue)

色相是自然状态下的色彩,是色彩的相貌。简言之,色环上没有改变明暗的色彩。色相是色彩的首要特征,是区别各种不同色彩的标准。例如红、橙、黄、绿、青、蓝、紫就是其中不同的基本色相。黑色是没有色相的中性色。不同的色相在人眼中的差异是色相本身对应光的波长不同而造成的。红色波长最长,紫色的波长最短。

万字干货!超全面的色彩与应用指南

饱和度(Saturation)

饱和度是色彩的纯度,他表示颜色中所含有色成分的比例。增加饱和度,色彩会变得更强烈、鲜艳生动;降低饱和度,颜色中灰色成分越大,色彩会变得暗淡乏味。当一种颜色掺入黑、白或其他色彩时,纯度就产生了变化,当掺入的颜色达到很大的比例时,人的眼睛就无法感知出来了。

万字干货!超全面的色彩与应用指南

饱和度为 0 的颜色为无彩色,就是黑、白、灰。数值越大,颜色中的灰色越少,颜色越鲜艳。饱和度高的地方给人感觉靠近,而饱和度低的地方则给人的感觉很遥远。高饱和度和低饱和度的色彩都给人坚硬的感觉。

明度(Brightness)

明度,指色彩的明暗度,反应的是色彩的深浅变化。以自然界为例,一些物体在早晨和晚上的色彩不同。如树木和山脉,早晨色调浅;傍晚因为光线减少了,色调变得偏暗。距光源越近的物体,明度越高,反之,则明度越暗。

万字干货!超全面的色彩与应用指南

明度在 UI 设计中扮演重要的角色,明度运用得好,可以实现好的对比效果。明度达到 100%时,色彩就会变成白色(黑白模式下);明度是 0%时,就会变成黑色。色彩的明度变化往往会影响到纯度,例如蓝色加入黑色以后明度降低了,同时纯度也降低了;如果蓝色加入白色则明度提高了,纯度却降低了。

3. 色彩的搭配

完整的 UI 配色应包含主色、辅助色和中灰色。主色通常与品牌色一致,辅助色一般选择与主色色调一致且能拉开层次的颜色,强调色选择与主色相对立的互补色。下面我们来学习几种常见的配色方案。

单色

单色是指某个色彩的明度变化,即在色彩上叠加 10%-90%白色或黑色得到的一组颜色。单色搭配由于彼此之间色彩相同,因此能和谐共处,但因较为朴素也就不容易引人注目,而且会给人一种单调的感觉。单色配色在色彩变化上也适合长时间阅读,颜色波动较少,比较适合沉浸式交互的界面设计。

万字干货!超全面的色彩与应用指南

虾米音乐就是单色搭配的最好例子,它将主色橙色用在主要功能入口、标签栏图标等所有界面的关键元素上,给人非常精致和统一的视觉体验。

万字干货!超全面的色彩与应用指南

如若想要在色彩变化上融入一点微妙的变化,可以尝试在色环中选用两侧相近的颜色,这样色彩层次丰富了而统一感也不会变,称之为“邻近色配色”。

邻近色

是指在色相环中相邻的两种颜色,在色相环上相距 60°,或者相隔五六个数位的两色。它可以在同一个色调中建立起丰富的质感和层次,优点是阳光、活泼、稳定、和谐但不单调,理所当然称为最安全的配色法则。邻近色色相相近,冷暖性质相近,传递的情感也较为相似。例如,红色,黄色和橙色就是一组邻近色。邻近色表现的情感多为温和稳定,没有太大的视觉冲击。

万字干货!超全面的色彩与应用指南

美颜相机的主色是粉色,将浅粉色和浅紫色作为辅助色,既能信息区分又和谐统一。

万字干货!超全面的色彩与应用指南

互补色

互补色是指在色相环上对立(180°)的两个颜色,色相环上夹角呈现一条直线,例如黄色和紫色、橙色和蓝色、红色和绿色等。互补色有着非常强烈的对比度,在颜色饱和度很高时,可以产生许多十分强烈的视觉效果,就会使这两种颜色都显得更加鲜明,也将视觉冲击力强度提升至峰值。这类配色形式优缺点和对比色很相似。常给人一种潮流、刺激、兴奋的感觉,把互补色放在一起,会给人强烈的排斥感,搭配不好会很山寨。

万字干货!超全面的色彩与应用指南

Airbnb 的主色为红色,界面设计中使用主色的互补色「墨绿」作为主色调,给人清晰、简洁的感觉。

万字干货!超全面的色彩与应用指南

分裂互补色

分裂互补色是指寻找三种颜色,其中两种互为邻近色,另一种与它们形成互补色,例如黄色和蓝色、洋红。这种搭配既能保持互补色强烈的对比及视觉上的趣味性,又能让颜色变得柔和。

万字干货!超全面的色彩与应用指南

36Kr 将蓝色作为主色,互补色黄色作为辅助色用在图标、标签上,再选择黄色的邻近色红色作为另一辅助色,用在不同的信息上,有助于用户区分产品信息。

万字干货!超全面的色彩与应用指南

对比色

指在色环上相距 120°~180°之间的两种颜色,也是两种可以明显区分的色彩,包括颜色三要素的对比、冷暖对比,彩色和消色的对比等。对比色能使色彩效果表现更明显,形式多样,极富表现力。需要注意的是,互补色一定是对比色,但是对比色不一定是互补色。因为对比色的范围更大,包括的要素更多,如冷暖对比、明度对比、纯度对比等。这类配色形式优点是视觉冲击力强烈、富有跳跃性、突出、点缀能力强,比如常用作画面中的点缀色,或与主体固有色成对比关系的背景色,用于突出主体。缺点是大面积使用比较难把控。

万字干货!超全面的色彩与应用指南

马蜂窝的主色是黄色,对比色蓝色作为辅色用在标签、小图标上,红色作为强调色用在价格等信息上。

万字干货!超全面的色彩与应用指南

对比色也不单纯是两个颜色之间的对比,而是色调之间的对比!对比色还包括:补色对比、色相对比、明度对比、饱和度对比、冷暖对比,饱和度越高对比越强烈,明度反差越大对比越强烈。

四元色搭配

四元色搭配在色环上形成了一个矩形,使用不是一对而是两对互补色。将其中的一个颜色作为主色,其余颜色作为辅色进行搭配可以得出不错的效果。

万字干货!超全面的色彩与应用指南

四元色是比较难以平衡的颜色,不过搭配好了会非常出彩。不信可以自己用用感受一下,尤其是使用其中一个颜色作为主色,其他的三个颜色作为辅助色的时候。

万字干货!超全面的色彩与应用指南

4. 色彩和光源关系

了解了色彩的基本知识,下面说说色彩和光源的关系。如果想描绘好对象的色彩,那么就必须了解对象的固有色、光源色、环境色及它们之间的关系和变化。

固有色

即物体本身的颜色。是指在光源条件下物体占主导地位的色彩,如红色的罐子、绿色的植物等。物体的固有色并不存在,在绘画过程中为了观察方便经常引入“固有色”这一概念。从实际方面来看,即使日光也是在不停地变化中,何况任何物体的色彩不仅受到投照光的影响,还会受到周围环境中各种反射光的影响。所以物体色并不是固定不变的。

万字干货!超全面的色彩与应用指南

光源色

物体只有在光源的照亮下才能观察到它们的色彩。光源有自然光(太阳、天光)和人造光(灯),这些光源都各自具有不同的颜色。太阳光是偏黄色暖色光,月光是偏青的冷色光,阴天则更多的是蓝灰色的天光,普通灯光是偏黄色的暖色光。光源的颜色对物体的颜色影响很大,想象一下一个置于红色光源照射下的蓝色物体会是什么颜色。

环境色

物体周围环境的颜色就是环境色。环境色对物体的影响非常大,如在红色背景下的白色物体,由于光源打到红色背景上的背景反射光也会“染”到白色物体上,因此白色物体的部分表面会蒙上一层淡红色的色彩。所以,设计师在用电脑作图时也需要考虑并想象环境色的影响。

5. 色彩空间

Lab

Lab 的全称是 CIELAB,有时候也写成 CIE L*a*b*。最突出的特点是它的生理特性,一是它包括人眼所看到的所有颜色,是目前为止色域最宽的色彩空间,二是跟人眼一样,首先看到的是明暗,其次是色彩,可以用数字化的方式描述人的视觉感应,在计算机视觉中广泛应用。

万字干货!超全面的色彩与应用指南

LAB 颜色空间中,L 表示亮度,取值[0-100]对应[纯黑—纯白];A颜色表示从绿色到红色的范围,取值[-128—+127]对应[绿—洋红];B表示从蓝色到黄色的范围,取值[-128—+127]对应[蓝-黄],正是暖色,负是冷色。Lab颜色空间中亮度和颜色是分开的, L通道没有颜色,a通道和b通道只有颜色。不像在RGB颜色空间中,R通道、G通道、B通道每一个既包含有明度又包含有颜色。

在表达色彩范围上,最全的是 Lab 模式(其次是 RGB 模式,最窄的是 CMYK 模式),它弥补了 RGB 色彩模型和 CMYK 色彩模式色彩分布不均的不足。也就是说 Lab 模式所定义的色彩最多,且与光线及设备无关,并且处理速度与 RGB 模式同样快,比 CMYK 模式快数倍。

Hsb

HSB 和 HSV 是同一个东西,只是名称不同。在 Photoshop 拾色器上可以看到每个颜色都有一组 HSB 值,H 表示色相、S 表示纯度、B 表示明度。色相值为 0~360 度,即圆;纯度和明度值为 0~100%,因此,了解 HSB 模式的原理,就能了解色彩的本质。

当我们需要调配同色系色彩,保持色相不变,只需要改变纯度和明度即可。如下图所示的 3 种同色系绿色,他们的色相(H152)都一致,仅在纯度和明度上有所变化。

万字干货!超全面的色彩与应用指南

当色相和纯度都为 0 时,色彩称为中性色,也称为灰度色,即黑白灰。其中,灰不是单指某一种颜色,而是一系列从黑到白的过渡色。

万字干货!超全面的色彩与应用指南

灰度色多用于文字,通常一个应用中的文字不应超过 3 种灰度色。深黑用于标题、正文等主要文字;浅黑或深灰用于辅助、提示性文字;浅灰用于禁用、失效等状态文字;纯白用于深色按钮文字。

万字干货!超全面的色彩与应用指南

此外,灰度色由于没有任何色相,始终沉着冷静,减少对内容的视觉干扰,因此常用于界面背景色,例如 MOO 音乐的界面设计。

万字干货!超全面的色彩与应用指南

Hsl

HSL 色彩模式是工业界的另一种颜色标准,是通过对色相(H)、饱和度(S)、亮度(L)三个颜色通道的变化以及它们相互之间的叠加来得到各式各样的颜色的。在原理和表现上,HSL 和 HSB 中的 H(色相) 完全一致,但二者的 S(饱和度)不一样,L 和 B (明度 )也不一样。

取一个颜色试试看,先选一个颜色 #0688F9,放入 “HSL Color Picker”,显示 HSL 数值为:H(208), S(95), L(50),但是我们放在 Sketch 里面看一下,显示的 HSB 数值为,H(208), S(98), B(98) 。

万字干货!超全面的色彩与应用指南

HSL 的 H 代表的是人眼所能感知的颜色范围,这些颜色分布在一个平面的色相环上,取值范围是 0°到 360°的圆心角,每个角度可以代表一种颜色。色相值的意义在于,我们可以在不改变光感的情况下,通过旋转色相环来改变颜色。在实际应用中,我们需要记住色相环上的六大主色,用作基本参照:360°/0°红、60°黄、120°绿、180°青、240°蓝、300°洋红,它们在色相环上按照 60°圆心角的间隔排列。

万字干货!超全面的色彩与应用指南

HSL 相比 RGB 的优势

我们来做一个基于 HSL 的调色实践。你可不可以快速说出“海棠红”所对应的 RGB 色值?如果再加一点橙色进去,把亮度提高一点,色值又是多少?想想那应该是一个介于洋红和红色之间的,性感娇艳的颜色。我们可以假定它在色相环 H 上的角度是 330°左右,饱和度较高,亮度适中,看看那是什么颜色?

万字干货!超全面的色彩与应用指南

em…我们想要的颜色应该再接近红色一点,让我们把色相(H)+20°到 350°,现在好多了。

万字干货!超全面的色彩与应用指南

通过改变色相值 H,我们实现了色相从洋红向海棠红的偏移。 大感觉接近了,但还是略微有点灰暗,我们可以通过增加饱和度(S)+15%,让这个颜色变得更鲜活,看起来更亮丽。

万字干货!超全面的色彩与应用指南

感觉还是差点,海棠红是属于少女的颜色,应当再嫩一点、通透一点,不会这么强烈。那可以通过增加亮度 L,+10%试试看,嗯,这才是我们想要的颜色。

万字干货!超全面的色彩与应用指南

同理,如果想加点橙色进去, 再亮一点,我们通过心算就大致可以确定色相环的相位和亮度值。在这里,我们需要让 H 增加 20°,L 增加 5%。

万字干货!超全面的色彩与应用指南

在使用 HSL 调色的过程中,不需要了解复杂的色光混合原理,这是一个自然的、感性的、易于理解的过程。相比之下,RGB 调色方式显得非常笨拙复杂、难以理解,而 HSL 是多么的友好。

  • 知识点:

需要提醒一下的是,CSS 代码里支持的是 HSL,而不是 HSB。如果和前端对接时,UI 给到的是 HSB 的色值,那么最终落地的颜色效果会与设计稿有出入。Photoshop 中的 Hex 和 RGB 颜色可以直接在 CSS 文件中使用,但是 Photoshop 中的 HSB 模式颜色和 HSL 是不同的。

Yuv

YUV,是一种颜色编码方法。常使用在各个影像处理组件中。YUV 在对照片或影片编码时,考虑到人类的感知能力,允许降低色度的带宽。Y 表示明亮度(Luminance 或 Luma),也就是灰度值;U(Cb)表示色度(Chrominance);V(Cr)表示浓度(Chroma);通常 UV 一起描述影像色彩和饱和度,用于指定像素的颜色。

万字干货!超全面的色彩与应用指南

采用 YUV 色彩空间的重要性是它的亮度信号 Y 和色度信号 U、V 是分离的。如果只有 Y 信号分量而没有 U、V 信号分量,那么这样表示的图像就是黑白灰度图像(回想一下小时候看的黑白电视)。彩色电视采用 YUV 空间正是为了用亮度信号 Y 解决彩色电视机与黑白电视机的兼容问题,使黑白电视机也能接收彩色电视信号。

色彩心理学

色彩心理学是美术知识学习中非常重要的一部分。他所研究的是色彩通过对人视觉上的刺激,而引发人情感和感官上的变化,通过日常生活中人们对应用色彩的经验积累而归纳总结出人类对色彩心理上的预期感受。在生活中,色彩心理学对人们对颜色的认知有很大的影响。为什么交通信号灯用红色表示停止通行而不是绿色呢?为什么大多快餐店用红色或黄色作为品牌的主色?这都是色彩心理学的相关知识。

万字干货!超全面的色彩与应用指南

虽然红、蓝是受到最普遍喜爱的颜色(通过对 App Store 应用流行颜色分类统计得知)。但并不意味着这一准则可以套用在所有产品上。产品的属性是什么,用户定位是什么,要传达的产品气质是什么等等,这些都是选择应用图标的颜色时需要考虑的问题。世界上第一间 Airbnb 房间是在一条叫 Rausch street 的街上诞生的,因此 Airbnb 的主色被命名为「Rausch」的温暖颜色。在挑选主色调的时候,4 名设计师前往世界 13 个城市,只为了更好地理解 Airbnb 的理念:热情、能量和自信,这正是 Rausch 要传递的信息。除了 Rausch 以外,Airbnb 还有其它九种颜色,包括 Kazan、Beach、Tirol、Foggy 等等,它们也都是以 Airbnb 的社区街道命名的。

万字干货!超全面的色彩与应用指南

下面来讲解每一种颜色都各自带有什么样的性格,只有理解了颜色的性格才能正确的使用它们。

黑色

黑色代表着品质、高端、时尚、低调、权威、严肃、稳重,是一种充满质感的颜色。它是所有色彩中最有力量的,能很快吸引用户的注意力。作为一种无彩色,能让它和其他色彩百搭,黑色+金黄色,给人一种奢华精致的感觉;黑色+银灰色,则给人一种成熟稳重的感觉;黑色+红色,给人一种时尚潮流的感觉。因此黑色是一种永远流行的主要色彩。

万字干货!超全面的色彩与应用指南

白色

白色代表着纯洁、简单、纯真、朴素、信任、开放、雅致,白色常常被认为是“无色”,即不是色彩。单一使用白色通常不会引起任何情感,但是当白色与其他颜色配合使用时,白色能很好的衬托,大量的留白让其他元素脱颖而出。在界面设计中,作为无彩色的白色,常用于背景色,缓和各种颜色的冲突,以衬托其他色彩,提高画面明度,提高文字可读性。

万字干货!超全面的色彩与应用指南

灰色

灰色是代表着睿智、老实、执着、严肃、压抑、沉稳。介于黑色和白色之间,也属于无彩色,没有色相也没有纯度,只有明度的变化。它和任何颜色都能很好的搭配,也常常用于背景色或用于突出其他彩色。灰色不像黑色那么坚硬刺眼,他更有弹性,它比黑色更有深层次的力量。因此在画面中,很少出现纯黑,基本都是用深灰色来代替黑色,也可以用浅灰色来代替白色。

万字干货!超全面的色彩与应用指南

红色

红色代表着喜庆、热情、欢乐、斗志、奔放、自信,是一种充满能量的颜色。这是最醒目和强势的颜色,一登场即获得全场的关注,甚至能引起一些生理反应,例如心跳呼吸加快等。红色最能烘托气氛,在中国传统节日里都使用热闹的红色来装饰,因此也就不难理解每逢佳节各大电商应用活动页一片红,为的就是发冲动,引人消费。同时红色也代表了警示、告诫。所以在界面设计中常用红色的文字和按钮来警示用户慎重操作。

万字干货!超全面的色彩与应用指南

橙色

橙色代表着温暖、欢乐、辉煌、健康、阳光、年轻、华丽,是一种充满朝气的颜色。橙色并不像红色那样咄咄逼人,而且它烘托出的活跃气氛没有危险的感觉,反而是一种友好。因此越来越多的应用避开常见的红色和蓝色,而选择橙色的原因。

万字干货!超全面的色彩与应用指南

黄色

黄色代表着信心、青春、聪明、尊贵、辉煌、时尚,是一种充满活力的颜色。黄色是明度极高的颜色,其鲜亮的色调使它在众多图标阵列中显得尤为突出。尽管在警示效果上没有红色那么明显和强烈,但是还是能给人很醒目和危险的感觉(例如道路警示牌)。同时因为过于明亮,也是一种非常难以运用的颜色,性格不稳定常有偏差,和别的颜色配合使用易失去本来的性格。不过黄+黑的搭配很流行,例如站酷和美团外卖。

万字干货!超全面的色彩与应用指南

绿色

绿色代表着健康、生命、青春、宁静、自然、和平、安全、舒适,是一种充满希望的颜色。绿色给人无限的安全感,当情绪低落与消极时看一些绿色,能缓解我们焦躁的情绪。绿色在生活中被广泛运用,如安全出口的颜色就是绿色,但绿色的饱和度要适当控制,如高饱和度的绿色也会令人兴奋,引起注意。

万字干货!超全面的色彩与应用指南

青色

青色代表着坚强、古朴、活泼、清爽、柔和、优雅、希望,是一种充满灵动的颜色。青色是一种介于绿色与蓝色之间的颜色,如果无法界定一种颜色是蓝色还是绿色时,这个颜色就可以被称为青色。豆瓣的主色调是青色,很符合豆瓣小清新的气质,带给用户恬静的感受。

万字干货!超全面的色彩与应用指南

蓝色

蓝色代表着冷静、科技、灵性、自由、放松、未来、理智、纯净、商务,是一种充满理性的颜色。蓝色是天空的颜色,是大海的颜色。在色彩心理学的测试中发现,几乎没有人对蓝色反感。纯净的蓝色通常让人联想到海洋和天空,可以抚平内心的伤口,让人的内心感到平和,有助于人的头脑变得冷静。例如 twitter 的主色调是蓝色,在社交应用里蓝色是一种很安全的颜色,高纯度的颜色传递了信赖、年轻和沟通的氛围。

万字干货!超全面的色彩与应用指南

紫色

紫色代表着高贵、浪漫、优雅、性感、幸运、梦幻、时尚、创造性,是一种充满神秘的颜色。是小孩子和有创造力的人十分喜欢的颜色。紫色的光波最短,在自然界中较少见到,所以被引申为象征高贵的色彩。紫色的明度在所有有彩色的颜色中是的。与不同的颜色结合会展现出不同的风格特色。紫+粉常用于女性化的产品调性,黄色是紫色的对比色。

万字干货!超全面的色彩与应用指南

色彩对用户体验的影响

当我们讨论色彩的时候,聊的更多的是色彩的搭配。虽然有些设计师认为有些色彩是一些纯粹的美学上的选择,但是实际上,色彩对于用户的心理和行为的影响相对更深,最终会反映在用户体验和行为反馈上。

当然,色彩理论是一个相对复杂的主题。从用户体验的角度上来说,色彩所涉及到的远不是配色方案这一个维度。通常,我们聊得最多的是不同色彩所产生的心理效应,以及多色彩搭配时,相互之间的影响和可访问性上的问题。设计师可以将色彩更好地运用到设计中,而无需重新考虑整个过程。一旦设计师掌握了基础知识,色彩理论中最有意义的部分之一就是学习将更多意想不到的色彩融入他们的设计中。

万字干货!超全面的色彩与应用指南

1. 色彩心理学和用户体验紧密关联

界面颜色的情感影响不容忽视。尽管有些颜色在 Ui 设计中是“通用的”(例如,黑色,白色和灰色,实际上几乎所有好的设计中都使用了其中的至少一种),但它们结合使用的颜色可能会对体验设计产生巨大影响。当然,颜色的使用方式也会对颜色的感知产生巨大影响。以蓝色为例,在简约的布局当中,大面积使用蓝色作为主色调,和在大面积白底上使用很小的一抹蓝色用来强调 CTA 按钮,所带来体验是截然不同的。

尊重文化差异

人类对于色彩都有着共通的认知,但不同国家对于色彩赋予了不同的含义。红色在中国象征着喜庆、财富和爱情,而在西方国家被赋予了流血、牺牲、暴力和激进的文化意义,贬义的味道更重一些。而白色与红色相反,白色在中国代表了死亡、反动和投降,以白色为主的设计常常会被视之为过于「素」,认为不够吉利。而西方国家却认为白色高雅、纯洁和幸运,因此要根据不同的文化背景,使用不同的色彩,才能更好地降低被误解的风险。

万字干货!超全面的色彩与应用指南

另外一方面,随着现代主义运动的普及,白色也拥有了更加现代的特征。在日本,白色甚至和当地文化结合,延伸出更加细腻独特的精神特质,随着日本战后设计领域的发展和崛起,白色在这一地区的含义则更加丰厚。原研哉在《白》一书当中,针对白色的含义和特征进行了非常深入的探讨,之后的《Subtle》一书当中,虽是围绕纸来探讨微妙的体验,但是也没少提及白色本身的特征。

万字干货!超全面的色彩与应用指南

例如股票交易市场,在国际股票市场通常是绿涨红跌,这是因为红色在西方国家代表着财政赤字,绿色代表着财富;而在中国正好相反是红涨绿跌,这是因为在中国红色象征着财富。

万字干货!超全面的色彩与应用指南

设计师必须根据产品的目标受众来审视其调色板的文化含义,这一点很重要。如果产品要面向全球受众,请确保在使用的颜色和图像之间取得平衡,以防止负面的文化内涵。如果产品主要只针对特定文化,则设计师可以不用太关心所选调色板在其他文化中可能产生的影响。

历史对配色的影响

时间变化对于配色所带来的影响不仅仅如此。比如中日两国在色彩使用上,还存在一个非常典型的差异,历史上日本在一个很长的周期内是作为中国的属国所存在的,这也使得中国自古以来崇尚饱和度较高的正色,而日本则大多使用饱和度偏低的间色,这一特征可以从两国的传统色上体现出来:

万字干货!超全面的色彩与应用指南

△ 中国传统色:https://color.uisdc.com/

万字干货!超全面的色彩与应用指南

△ 日本传统色:https://color.uisdc.com/jp.html

性别误区

或许天生如此,女性不喜欢灰色、棕色和橙色。她们钟爱蓝色、紫色和绿色。而男性不喜欢紫色、棕色和橙色。男性喜欢蓝色、绿色和黑色。只要记住,当你的产品目标用户群是男性时,选择能传达男性气概的色彩,想象下你把运动类应用的界面使用女性色彩,结果可想而知。

万字干货!超全面的色彩与应用指南

△ 男女最喜欢的颜色

万字干货!超全面的色彩与应用指南

△ 男女最不喜欢的颜色

3. 针对色盲用户群体的设计

你有没有想过你的 APP 使用人群中会有视力障碍者?

当人们谈论色盲时,他们通常指的是不能感知某些色彩。 大约 8%的男性和 0.5%的女性患有不同程度的色盲——他们在识别部分或者全部颜色时有困难。面对如此庞大的特殊受众,设计师理应关注他们的需求。

万字干货!超全面的色彩与应用指南

△ 正常人和红绿色盲看到的相同色彩

因为色盲有多重表现形式,例如红绿色盲,蓝黄色盲和单色色盲。所以运用多样的视觉线索来连接你 APP 的重要状态是很重要的。绝不要仅仅依靠色彩来表示系统状态。 相反,应使用元素(如笔画,指示符,图案,纹理或文本)来描述操作和内容。需要注意的就是不要简单认为色盲就是简单的分不清红绿,色盲用户对色彩的感受差异不仅仅是单独某种的问题,是某些范围色光的敏感程度问题。

有趣的事实:Facebook 的标志和不怎么讨喜的蓝色配色是特意挑选的。因为 FB 创始人马克·扎克伯格是红绿色盲,他对蓝色的识别是最好的。他曾说过,“蓝色是我生命中最丰富的颜色,我几乎可以看见这世上所有的蓝色。”

万字干货!超全面的色彩与应用指南

△ facebook

Photoshop 有非常实用的工具来帮助模拟色盲,在「视图」的「校样设置」菜单内选中就可以使用了。这个功能让设计师可以看到在色盲用户的眼中你的界面是什么样子的。

万字干货!超全面的色彩与应用指南

△ pinterest登陆页红绿色盲视图

下面以点状图信息图形为例,来说明如何为色盲用户优化信息图:

万字干货!超全面的色彩与应用指南

优化采用了这样一些手段:1.调整配色,将色盲人士容易混淆的红、绿、橙色换为红、蓝、黄色。2.调整明度,使图中几个颜色在明度上差异更明显。3.为不同元素赋予不同形状。所有使用点元素的信息图,都可以参考这种解决方式。

在实际设计过程中,我们需要在美观和友好之间进行权衡。我们也可以采用一些交互手段,避免同一界面中元素太多太过杂乱的问题。

4. 流行趋势对色彩的影响

这是更长维度上的变化,在短时间以内,流行色的趋势变化,对于用色也同样存在影响。这种影响在时尚行业有着非常直接的体现,而在网页和 UI 设计行业,同样存在。比如 2020 年的潘通年度流行色是「经典蓝」(Classic Blue),也就明白了为什么 iphone12 今年的主打色是蓝色了。

万字干货!超全面的色彩与应用指南

所以,当你在设计的时候,如果你的目标用户群体有着清晰的地域或者性别偏向,你可以有目的地利用这些知识来规避设计陷阱,更好地发挥色彩本身的功能和优势。如果受众广泛,则可以尽量使用通用性更强的色彩来进行设计。

  • 知识点:

你知道世界上的颜色是什么吗?

是否存在一种色彩,是不分性别文化,大家都会喜欢的呢?确实有人通过大规模的调研和探索找到了一种世界上的色彩:马尔斯绿(Marrs Green)。来自全世界 100 多个国家 3 万多人响应号召完成了这项投票,并且最终选取出来的一款绿色。

万字干货!超全面的色彩与应用指南

色彩在UI设计中的应用

1. 色彩的应用

人脑对于色彩的记忆度要高于形态,即一个 App 给用户留下深刻印象的往往是界面的色彩。例如说到支付宝,我们可能想不起它的首页长什么样子,标签栏图标是那些,但能马上记起它的界面主色是蓝色。因此运用好色彩对 UI 设计十分重要,它能直观的呈现产品的气质和性格,能有效的帮助用户组织和阅读信息,与界面设计产生联系和记忆。好的配色往往依靠设计师审美、感觉搭配出来,但合理的颜色搭配必定存在合理的配色规律和配色方法论的支撑,下面结合相关案例为大家讲解色彩运用的几个技巧。

不得触碰的禁区

分析研究了很多优秀设计作品,发现他们在用色的时候有一部分区域是不会使用的,也就是我们常说的“配色禁区”。当然,这里的“禁区”是带双引号带的,并没有什么绝对的禁区,只是说这些颜色不易控制,在连基础色都没有驾驭好之前,尽量少碰。

配色禁区大概分为这三种:三角形禁区、矩形禁区、扇形禁区(红色为禁区),如下图:

万字干货!超全面的色彩与应用指南

综合看来,不管是那种禁区,右下角区域的颜色是很少用的。毕竟他们又脏又深,当然什么颜色都能驾驭的大师请略过。

  • 知识点:

在界面设计中,一般主色和辅助色都集中在右上角,次要的和不可点的颜色都集中在中上方,而文字信息和背景色则集中在左侧,右下角禁区是我们要重点避开的对象。

色调一致

在 App 设计之前应先确定界面的主色调,主色将占据界面中很大的比例,通常是品牌色,而辅助色、点缀色、背景色等都应以主色调为基准来搭配,这样才能保证 App 整体色调的一致。色调一致的界面,能带给用户始终如一的视觉体验。例如马蜂窝将黄色(品牌色)作为主色,以及从主色搭配出的蓝色(对比色)贯穿 App 始终。

万字干货!超全面的色彩与应用指南

60-30-10 原则

60% 30% 10%的原则,是达到色彩平衡的最佳比例。在 60%的空间使用主色,可以运用到导航栏、按钮、图标等关键的元素中,使之成为整个 App 的视觉焦点和色彩关系;30%的空间使用辅助色,可以平衡过多的主色而造成的视觉疲劳;最后剩下 10%的空间为点缀色,可以用在一些不太重要的元素又需要区分的时候。6:3:1 原则构建了一种丰富的色彩层次,让界面看上去和谐、平衡和不杂乱。

万字干货!超全面的色彩与应用指南

哔哩哔哩将粉色运用到页签、标签栏、按钮、入口图标等上,蓝色的辅助色用在角标、图标上,还有黄色、红色用在一些小图标、小标签上,主次非常清晰明了。

万字干货!超全面的色彩与应用指南

色不过三

经常很多大神在网上说配色不要超过三种色,其实就是「色不过三」原则,即在一个页面中不要使用超过 3 种颜色搭配,这也和上面说的“60-30-10 原则”类似,即一个主色、一个辅助色和一个点缀色。但在实际 UI 设计中,迫于产品的需要可能会使用更多数量的色彩,但切记不可超过 7 种色相(注意不是 7 种色值),每个色相还可以运用其饱和度、明度的变化分解出丰富的色彩搭配。

万字干货!超全面的色彩与应用指南

美团外卖的首页 20 个功能入口大图标的背景用了 9 种不同的色彩,每种色彩又包含一种低饱和度色彩进行彩色渐变,但并没有显得杂乱,而是呈现一种年轻时尚的律动感。这是因为这里虽然使用了 9 种不同的色彩,但仔细观察发现只使用了 3 种色彩,其他 6 种则是从前者邻近色中提取出来的搭配,再将它们错落放置,呈现出丰富多彩的色彩搭配,整体和谐统一。

远离纯黑色和纯灰色

黑色就像没有生命力的深渊,使用户陷入冷冷的负面情绪中。远离纯黑色和纯灰色,是因为它们不存在于现实世界里。尝试在纯黑和纯灰中加入一些色调,会让界面看上去更柔和自然。另外,纯黑色还会与白色产生强烈的对比度,看久了会使人疲劳,让用户产生焦虑的情绪。MONO 的导航栏并不是深黑色,而是加入了蓝色的低饱和度蓝黑色,它的界面背景也是加入了蓝色的的浅色,这样就不会让界面看上去死气沉沉的。

万字干货!超全面的色彩与应用指南

遵循色彩心理学

前文我们已经了解过各种色彩的心理学知识,就是为了我们在进行 App 设计时提供依据。这些色彩都是源于人类对大自然最原始的感受,蓝色的天空、绿色的草地、黄色的沙漠等等,自然的色彩,对于我们来说是司空见惯的,但其中却蕴含着丰富的美感,并达到了和谐统一。网易云音乐使用红色作为主色,这种热情奔放的颜色传递出一种充满能量、自信的气质。

万字干货!超全面的色彩与应用指南

良好的可读性

良好的可读性在界面设计中能为用户提供主次分明、层次清晰的阅读体验,而一个可读性差的界面则会成为用户浏览的障碍。那如何确保界面具有良好的可读性呢?这就需要在界面设计中注意色彩搭配的对比,如在浅色背景上使用深色文字,在深色背景上使用浅色文字,使用高对比的度的亮色展示重要的元素,用低对比度的浅色来体现需要弱化和次要的内容。例如苹果 Music 的主要功能入口,标签栏图标、按钮等都是用了高纯度的红色,与其他元素形成鲜明对比,就连深灰色的辅助文字都有着清晰的可读性。

万字干货!超全面的色彩与应用指南

从大自然中获得灵感

配色中尽量使用大众熟悉的色彩,如自然界中人们常见的色彩等。从大自然中获取的配色灵感可以使你的设计更加切合用户的审美,非常自然。而艺术是对自然的直接反映,是非常宝贵的资源,值得好好利用。我们可以搜集各种与自然风光相关的图片,从中提取色彩运用到设计中,这些几近完美的搭配呈现出来的和谐美感能瞬间打动人心。天气应用 Marline 就是一个很好的例子,它的界面背景渐变就参考大自然的变化,随着不同时间段呈现出清晨、日出、正午、日落、深夜、雨天等渐变色,打开应用即唤起了用户的快乐情绪。

万字干货!超全面的色彩与应用指南

将 UX 颜色与品牌相匹配

品牌价值在创建调色板中发挥关键作用,但是它们不是唯一重要的因素,行业规范也是关键。使用与品牌主要竞争产品几乎相同的配色方案不失一种好方法。配色在品牌视觉中所发挥的作用是不言而喻的,但是,色彩本身的内涵和情绪特质并不是全部。比如一个行业当中,很多产品都使用了蓝色,那么你的产品继续使用蓝色,可以让用户更快「识别出」你所属的领域,但是本身也存在让人混淆的风险。如果你想要在视觉上脱颖而出,可以试着使用不同的色彩。

万字干货!超全面的色彩与应用指南

△中国区或美国区,红色和蓝色都是最流行的颜色。

在进行品牌设计的时候,选择配色的第一步,始终是了解各种颜色或者色相的气质和情感属性。然后,在具体设计的时候,再进一步根据品牌的气质和需求,再在色相的基础上调整明暗和饱和度。也可以打破常规创造出与众不同的配色方案。

从强调色入手

想要让配色方案更加突出,在设计中添加强调色可能是最容易入手的地方。举个例子,一个律师咨询的 App 可能会使用传统的蓝色作为基础配色,但是,如果能够加入柠檬绿作为强调色,会显得独特很多。

冷暖色对比搭配

冷暖对比色是自然平衡的规律,可以在设计中大量使用,这样的配色会使作品非常的出彩,同时不显单调,让用户感觉舒服平和。而且这种搭配方法基本没有啥缺点,使用在设计中,技巧性比较多,对设计的细腻感受要求比较高,需要多练习。

万字干货!超全面的色彩与应用指南

黑白色搭配不过时

黑色是所有中性色中最强的,而白色是最常用的背景颜色。黑色是一个很好的选择,有种高端和永恒的感觉,而白色可以带给用户自由,宽敞和透气的感觉。如上所述,黑色和白色也是最大的对比色,如果合理的使用黑色配合白色,会营造出一种优雅的氛围。

万字干货!超全面的色彩与应用指南

强交互色彩

交互色彩在执行过程中必须清晰且在界面中保持一致。号召性用语必须相对于背景具有足够的对比度,并且相对于其他组件必须具有足够的视觉权重,以便用户可以轻松识别它们。Nike 健身应用中,「开始」按钮以高饱和度的柠檬绿作为主色,从背景中脱引而出。

万字干货!超全面的色彩与应用指南

但是,交互色彩并不总是以最具饱和度或最亮为特征,而是通过色调、形状、大小或对比度,从屏幕上脱颖而出。因此,交互色彩的有效性将基于用户识别交互区域和执行任务的速度来衡量。同时,次要功能权重要更轻,并在视觉上更接近信息元素。如上图 Nike Training 界面中,“设置”和“声音”按钮只用简单的白色,减轻对主按钮的干扰,也避免了页面中出现多个强交互按钮。

保证良好的可读性

可读性是任何设计中的重要因素。你的颜色应该清晰易读,尤其是在处理文字时。因此对比度对视觉效果的影响就非常关键,对比度过小,就会使得界面出现灰蒙蒙的效果。清晰的对比度,一般会采用色彩的两极,黑纸白字或白纸黑字。而在彩色背景上要让内容清晰可见,就需要搭配纯白或高明度的文字,避免灰色文字。也要注意避免彩色背景上搭配互补色和明度接近的文字,因为这两种搭配会产生一种“震颤效应”,发出光晕的视觉效果。

万字干货!超全面的色彩与应用指南

UI 中的阴影

没有完全纯黑的阴影,阴影的颜色是会受到物体本身固有色的影响,一定要避免使用纯黑色(#000000),使用不太深的灰色,效果会更好。对于有颜色的元素,好的做法是为阴影设定与元素相同的颜色,并使其更暗一些。

万字干货!超全面的色彩与应用指南

如果是有颜色的元素,并且它处在黑暗的背景下,一般情况下,是不建议使用阴影的。但是如果你一定要用,把阴影透明度调到小于 10%及以下,并且颜色跟随主色调来。比如按钮为绿色,则可以为按钮设定一个更深的绿色阴影,并加上小于 10%的透明度数值。如下图,左侧的按钮阴影很自然,右侧的则有一层模糊发光的效果,显得不够漂亮。

万字干货!超全面的色彩与应用指南

  • 知识点:

为什么「超链接文字」要用蓝色?

简单说,因为在最早期的网站页面中,蓝色能呈现最高的对比度。

万字干货!超全面的色彩与应用指南

Tim Berners-Lee——web 的主要开创者,被认为是最早用蓝色链接的人。

一个很早期的 web 浏览器 Mosaic,用的是深灰色背景和黑色文字。那时候,能用的非黑色、最深的文字颜色,就是蓝色。所以,让超链接文字突出显示,同时保证可读性,就选定了蓝色。此后超链接文字都用蓝色的传统沿用至今。

2. App 设计中的色彩搭配

App 的色彩搭配能直观、快速的反馈到用户的大脑中形成记忆思维。好的色彩搭配可以加深用户对产品的印象;明确界面的视觉层次,让用户分清主次信息;同时还能给用户赏心悦目的视觉享受。那么,在 UI 设计时该如何进行色彩搭配呢?我们可以从 App 中都包含了那些色彩开始,通常一个 App 中包含了主色、辅助色、点缀色、背景色这 4 类,下面就以微信读书为例进行详细的讲解(个人角度)。

主色

主色是指在配色中处于主导地位的色彩,给用户的第一眼印象,通常是产品的品牌色。在 App 设计中,主色一般占有色相色彩的 60%的比例。这里指的是 60%的界面都使用到的主色比例,而不是使用面积(因为通常一个界面中使用面积最大的是背景色)。还有就是背景色多为浅灰色或白色,它们都属于无色相色彩,因此不涉及到配色过程中。我们看到微信读书的第一印象,就可以判断它的主色为蓝色,这也是它的品牌色。在标签栏、按钮、图标、注册登陆全都使用了这种纯净的主色,使界面看上去非常和谐一致。

万字干货!超全面的色彩与应用指南

辅助色

辅助色与主色相辅相成,辅助色的功能是帮助主色建立更完整的形象,使界面丰富精彩起来,避免画面过于单一。通常,主色的邻近色、互补色、分散互补色和三角对立色都可以成为优秀的辅助色,但注意辅助色不宜过多,否则就会使界面看上去花哨分散了主题。根据 6:3:1 原则,辅助色可以占有色相色彩的 30%或更少为宜。

万字干货!超全面的色彩与应用指南

在微信读书中,绿色、橙色、梅红、蓝紫色是除了主色以外使用最多的颜色,它们都是辅助色,主要用于功能图标和栏目分类上。虽然辅助色看起来有点多,但其实都是从主色的邻近色和对比色(及其邻近色)中提取出来的搭配,而且只用在页面中很少的地方,这种搭配技巧既可以丰富色彩的搭配,传递出年轻活跃的产品气质,又保证了整体搭配的和谐统一。

万字干货!超全面的色彩与应用指南

点缀色

点缀色是除了主色和辅助色以外的另一种色彩,通常体现在细节上。其作用是,当页面中主色和辅助色不能满足关键信息的提示时,就需要点缀色来吸引用户眼球,还有就是利用点缀色来平衡画面的冷暖色调。点缀色通常都是分散的,使用面积小,颜色非常显眼,能与主色形成强烈的对比。一般点缀色是主色的互补色。在微信读书中,使用了香槟金、梅红和红色作为点缀色。香槟金用在文章分享按钮上,梅红色用在点赞图标上,强调其特殊性,红色用在通知及退出登录提醒上,用于警示。

万字干货!超全面的色彩与应用指南

来康康这三种点缀色与主色之间存在什么样的关系,在色相(H)上,3 种点缀色为邻近色,与主色为互补色;在明度(B)上,3 种点缀色均为高明度色彩,起到强提醒的作用。这种强对比的互补色的点缀色可以快速引起用户注意力。

万字干货!超全面的色彩与应用指南

背景色

背景色就比较好理解了,通常为了衬托内容,大多数 App 都是用浅灰色作为背景色,以白色作为背景色的对比色,来区分视觉层次。建议是可以根据前景色来提取背景色,将其调亮或变暗,这样可以让界面色调更加统一。在微信读书中背景色是偏蓝色调的浅灰色,而不是纯灰色,背景对比色是在白色里加入了蓝色色相,而不是纯白色,整体对比较柔和,给人清爽通透的感觉。

万字干货!超全面的色彩与应用指南

  • 知识点:

支付宝 Alipay Design 团队提出过一个配色原则:

以同色系配色为主导,多色搭配为辅。

同色系为统一的色相,使用中可以加深品牌色的感知,可以让界面更有层次,同时可以让界面保持色彩上的一致性;由于业务的多样化,我们需要多色搭配为辅;多色的辅助颜色,也可称之为功能色,可设定不同的任务属性和情感表达;再搭配中性色黑白灰,赋予更多的变化和层次。两种配色通过主次、使用比例,可灵活运用在业务的各个场景中,具有非常好的延展性。

3. 迷人的渐变色

不同于单一色彩,渐变色不属于任何色彩,它营造出千变万化的视觉效果,却又不会增加视觉负担。相较于单一的色彩,渐变色的复合性质让它在界面设计中具有更强的视觉冲击力,有助于快速抢占视线。如今,这种的色彩正逐渐成为一种潮流,究其原因是目前大量的扁平风格造成 UI 设计的严重同质化,人们需要追求更加个性的视觉语言来满足日益增长的设计需求。下面我们来了解几种常见的渐变的使用技巧。

色相、饱和度、明度的渐变

色相(H)渐变是指由一种色彩向另一种色彩的过渡,这种渐变因跨度大产生的视觉效果非常明显;饱和度(S)渐变是指同一种色彩不同纯度的过度,其产生的视觉效果比较和谐单调;明度(B)渐变是同一种色彩不同明暗的过度,这种渐变的视觉效果给人一种沉静的氛围。

万字干货!超全面的色彩与应用指南

渐变的表现形式

在界面设计中经常看多各种各样的渐变表现方式,使用最多的有以下几种:

  • 水平渐变

这个很好理解,是指角度为 0 的线性渐变,是最流行的渐变形式。界面设计中多用在导航栏、进度条、按钮等元素上,能让画面变得精致而通透。例如京东使用橙红渐变的设计语言贯穿整个 App,从应用图标到导航栏、按钮、标签,全部都运用了这种由红色到橙色的过渡。仔细观察发现在很多小标签上都使用了水平渐变设计手法,使产品看起来更年轻化。

万字干货!超全面的色彩与应用指南

  • 知识点:

在水平渐变中,通常把轻(亮)的色彩放在左边,重(暗)的色彩放在右边,这样由左向右的方向感刚好与人的浏览习惯保持一致。而反过来就会与人的浏览视线相悖,应避免。

垂直渐变

即角度为 90°的线性渐变,它通常被用在正方形或竖条形的元素上,如注册登陆页,个人中心头部等。垂直渐变中上下两种色彩的深浅变化会产生截然不同的视觉效果,上浅下深会让给人一种凸起的立体感,而上深下浅会给人一种凹陷下去的空间感。例如「纪念碑谷」的背景是采用了单色相和多色相的垂直渐变作为游戏背景,在让整个画面丰富的同时又不会太抢夺主体的色彩,使画面显得清新透气而不沉闷。

万字干货!超全面的色彩与应用指南

角度渐变

角度渐变通常有对角渐变和多角度渐变。有角度的渐变相比水平和垂直渐变,它的使用场景更广,如图标背板、启动页、注册登录页、标签等。想让界面更加绚丽、动感和迷人,这时候我们可以考虑多组渐变搭配使用。

万字干货!超全面的色彩与应用指南

色块渐变

渐变的颜色不只可以运用在一个色块上,还可以运用在一组色块上。设计师运用一组近似性色彩,将每个菜单项清晰区分开,让界面平衡在一个频率上,这样的画面更有节奏感和舒适性。不同于平滑的渐变,色块渐变不再是单纯的背景装饰,在某些地方还具有一定的功能性,比如使用不同的色块来分割的列表样式。Clear Todos 是一款日常任务清单的 APP,它抛弃了传统的列表样式,使用了一系列色块来作为列表的分割,非常漂亮和精致。

万字干货!超全面的色彩与应用指南

径向渐变

是指色彩以圆心向四周扩散的渐变,是一种模拟光源照射的视觉效果,因此光源是整个画面的视觉焦点,将关键元素放在光源中心就会成为主角。通常被运用到大背景上,如启动页、引导页等。Solar 天气应用的背景就是径向渐变,光源扩散的效果营造出一种梦幻般的美感。

万字干货!超全面的色彩与应用指南

和谐的渐变色

渐变色是由一个色彩走向另一个色彩的过程,有着迷人的视觉效果。如果你仔细观察两种色彩的过渡关系,就会发现不是每次都会得到满意的效果,例如红绿渐变就很糟糕,因为它们两者是互为对立的色彩,但是如果加入黄色的过渡色就会好很多。原因是当两种色彩之间超过 90 度就会导致其渐变色看上去不太和谐自然,只有控制在 90 度之内才会产生美妙的变化。如何改善超过 90 度的两种色相的渐变呢?这时候可以在两色之间加入过渡色进行调和。例如当从黄色到蓝色渐变时,就可以加入紫色作为过渡才能呈现完美的视觉效果。

万字干货!超全面的色彩与应用指南

  • 知识点:

在搭配渐变色时,尽量只改变其色相(H)、饱和度(S)、明度(B)中的一项,这样才能创造出和谐的渐变色方案。

创建调色板及配色工具

调色板帮助我们在设计项目中建立色彩规范、提高工作效率。通过上文对色彩基础知识的学习,接下来为大家介绍几种简单易用的创建调色板的小技巧,以及 Materia design 配色方法和配色网站推荐。

1. 从设计作品收集色彩

打开 dribbble,每一幅作品预览页左下角都有一份自动生成的配色板,很多同学可能不知道这个配色文件是可以下载的。将调色板保存到本地,为自己在创作时提供灵感。在 ps 里的操作步骤是:点击“窗口—色板”,然后在色板的属性面板右上角打开“导入色板”,载入刚下载的色彩文件即可。

万字干货!超全面的色彩与应用指南

它也有颜色搜索工具,输入或选择颜色值即可搜索相关配色的设计作品。

万字干货!超全面的色彩与应用指南

2. 从图片取色

这种方法也很常用,不需要任何插件,丢一张图片到 Ps,然后将图片「马赛克」处理下就可得到一组配色。例如,我们需要一组同色系的绿色,在网上(建议 unsplash 或 500px 等专业图片网站)找一张树叶的图片,接着将图片在 Ps 中打开,进入“滤镜—像素化—马赛克”,在打开的窗口里调节单元格大小即可。

万字干货!超全面的色彩与应用指南

同时,建议平时多去收集好看的摄影图片和优秀的配色方案,看的多了就知道什么是好的什么是 Low 的配色,对提升审美也有很大帮助。

万字干货!超全面的色彩与应用指南

△ pinterest画板

3. 自定义色块叠加

该方法稍微复杂一点,示例步骤如下:第一步绘制一个正方形做底板,填充一个颜色#5354F0;第二步分别在正方形的上和下 1/3 处叠加 20%的白色和黑色;第三步分别在正方形中和右 1/3 处叠加 40%、80%的紫红色#DF56FA;最后改变紫红色图层的混合模式为叠加即可得到一组蓝紫色色调的调色板。

万字干货!超全面的色彩与应用指南

4. 色彩系统

Materia design 调色板

Materia design 从生活场景中提炼出 19 个充满活力的色彩,旨在和谐地协同工作,可用于开发品牌调色板。Materia design 提供了一整套调色板,从原色开始,延伸出其他许多色彩,这些色彩和谐相处,可用于产品设计的品牌色。基础色的饱和度是 500,Google 建议以此作为产品应用的主色调,可以再选择一种辅助色,并在主色的基础上进行饱和度,明度变化,构成一套配色方案。

万字干货!超全面的色彩与应用指南

如果上面的色板不能满足你的需求,你可以选择一个主色,Materia design 调色板生成工具会为你生成完整的色板。

万字干货!超全面的色彩与应用指南

主色和强调色

在色彩选取时,需要先明确品牌色在界面中的使用场景及范围。在基础色板中选择主色,建议选择饱和度为 500 的基础色作为主色,根据设计需要在主色的基础上增加 1~3 种不同饱和度、明度的色彩建立层次感,再选择一种强调色突出重要内容或操作,例如 FAB 的背景色。

万字干货!超全面的色彩与应用指南

深/浅背景上的文字

Materia design 通过文本的不透明度建立在不同背景上的深浅对比,对于浅色背景上黑色文字,主文字不透明度 87%,次要文字不透明度 60%,禁用文字不透明度 38%;而黑色背景上的白色文字正好相反;彩色背景上的白色文字不透明度 100%,分割线不透明度 12%。Ant Design 也定义了一套用于界面文字、背景、分割线的中性色,在落地的时候同样也是按照透明度的方式实现的。

万字干货!超全面的色彩与应用指南

背景

为了提高应用之间的一致性和阅读的可读性,背景色根据设计需要选择纯白色或饱和度依次为 50、100、300 的灰色。

万字干货!超全面的色彩与应用指南

5. 配色工具推荐

颜色是一个很难掌握的概念-因为有无限多种可能的颜色组合,对于很多设计师来说还是一件蛮困难的事,为了让设计配色变得容易些,下面推荐几个常用的配色网站,希望能帮助大家在日常工作中节省更多的时间。

Adobe Color

Adobe Color 是一个基于网络的应用程序和创意社区,提供免费的色彩主题,并且在 Adobe 相应的软件中也提供了扩展程序,比如我们常用的 Photoshop 和 Illustrator。

万字干货!超全面的色彩与应用指南

△ https://color.adobe.com/

Adobe Color 通过拖拽色轮或输入自定义色值,可以创造出基于相似、互补、三原色、正方形等不同色彩规则的配色方案。除此之外,还支持 CMYK、RGB、HSV 多种色彩模式的配色调整。用法很简单,点击颜色块上的小三角确定基础色,就会自动生成 5 个基于你所选色彩规则的配色方案,拖动下方的颜色条时相应的也会改变配色方案。如果没有灵感可以通过顶部导航进入“探索”页,这里为我们提供了很多提取好的颜色和图片,有的是摄影作品,有的是设计作品,上方的轮播图提供的一些其他内容,比如潘通流行色、Adobe 社区和手机端的 APP 等等,非常的实用。

Eva Design System

Eva Design System 是一个基于深度学习算法的配色网站。适用于给我们的产品或品牌生成一个系统的配色方案。右上角可以切换浅色模式和深色模式的对比。

万字干货!超全面的色彩与应用指南

△ https://colors.eva.design/

Colorhunt

Color Hunt 是由设计师 Gal Shir 创建的开放调色板集合,每天更新丰富的配色方案。颜色卡片下方可以看到更新的时间和喜欢人数。鼠标悬浮在任一色块上显示颜色值,点击颜色卡进入详情页可下载和分享,惊喜的是还可以添加到 chrome 浏览器,方便随时随地使用。

万字干货!超全面的色彩与应用指南

△ https://colorhunt.co/

Grabient

Grabient 是一个非常漂亮且实用的渐变配色网站,支持 CSS 样式代码复制、360 度渐变旋转、自由增加或删除渐变颜色等功能。设计师可以在色块下方自由添加和调整渐变的色系、以及线性渐变方向。

万字干货!超全面的色彩与应用指南

△ https://www.grabient.com/

当然,以上这些配色工具只是为我们提供方便的,而不是主导我们的,所以在使用配色工具的时候最好是要有一定的理论基础作为支撑,让你的配色有理有据,切忌生搬硬套。

  • 知识点:

对于新手设计师来说,颜色越少越容易把控画面。色彩层级越精简,就越容易达到整体色彩平衡,掌握好色彩的功能划分必然会让你的配色过程保持思路清晰从而提率。

万字干货!超全面的色彩与应用指南

同时,不管是 2C 还是 2B,很多大公司都构建了自己的设计系统。如果你想学习别人是如何进行配色布局的,最快的方式就是研究他们的设计源文件。

6. 关于色彩空间配置(附加内容)

建议设计软件使用 sRGB 作为色彩空间的默认配置,而不要采用未管理( Sketch 中默认是未管理),若团队协作请提前保持色彩空间配置的统一性。如果有需要针对广色域色彩空间做项目,可以单独设置该项目文档的色彩空间为 Display P3 或者 Adobe RGB。

Mac 系统色彩空间配置

建议所有 macOS 用户都在系统偏好设定的显示器颜色设定当中换用 sRGB IEC61966-2.1 这个校色方案,可以极大改善系统显示效能。如果有外接显示器,也建议使用外接的默认选项,默认选项一般可以发挥出该显示器的最大色彩性能。

万字干货!超全面的色彩与应用指南

Sketch 色彩空间配置

Sketch 默认颜色配置是 Unmanaged「非托管」, 我们可以在「偏好设置」中为 Sketch 指定默认的色彩空间配置,如此一来每次新建设计文档将会默认采用我们的设置作为默认的色彩空间,不用每次新建文档都单独设置一次。

设置方法:Sketch → 偏好设置(Preferences) → 通用(General) → 颜色描述文件(Color Profile),修改下拉框选择器的内容为 sRGB IEC61996-2.1。(其他设计软件设置方法类似)

万字干货!超全面的色彩与应用指南

如果要更改已有的文档为 sRGB 色彩配置,可以通过文件——更改颜色配置,在弹出的对话窗里对文件进行色彩空间的更改即可。

写在最后

其实无论是色彩理论还是配色方法,最本质的东西就那些,更多的还是需要设计师在日后的工作中不断的摸索和积累。这篇文章全部写下来耗费了不少时间(小声 BB:其实每篇都是),抱歉内容确实有点多,但其实已经是收着点写了。就像大树一样,有很多分枝不断生长,需要了解很多细分出来的深度知识。这也是写这类文章的乐趣,通过不断的查阅资料,把过去很多模糊的概念摸清楚了。果然学透一个知识点的最好方式就是把它讲出来才能真正为自己所有。关于色彩的知识先分享到这里,希望对大家有所帮助,文中有不严谨或错误的地方,欢迎大家指正,一起学习成长。


文章来源:优设网     作者:印迹



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


移动互联网中被消音的群体和小众社区的“生与死”

资深UI设计者

编辑导读:为了满足不同用户的个性化需求,产品的种类不断丰富。相较于巨头们都热衷的年轻群体和大众化产品,一些小而美的小众产品也在悄悄发展,并且收获了一群稳固的用户群体。本文作者从自身工作经历出发,对此发表了自己的看法,与你分享。

“风口之上,行业之下”应该是很多创业型公司的真实写照。作为创业公司的打工人,在巨头之下讨生活,要比大厂的打工人做着多倍努力的工作已是共识。对外我们习惯称自己的公司“小而美”,对内我们只能在业务之内想尽“奇招”只求不做炮灰活下去!

“风口之上”是指工作大行业是15年的移动医疗和17年的短视频直播,“行业之下”指的是热门行业中的垂类细分领域,在小众人群中谋生存,服务的是肿瘤病患和中老年人群。工作方向倒是始终如一,社区运营从未改变。肿瘤病患社区和中老年短视频社区工作其实都不算成功,某种意义算是失败的工作经历。

在做“肿瘤社区”时,发力点是内容聚合人,人获得内容,此时像做内容圈。中老年的直播则进化为人与人之间的交流,通过直播载体形成群体意识,成为社区圈,下文从两个社区案例的执行层聊聊我“失败”的经验。

一、垂类病种医疗社区

简单说社区形成条件是依托某个属性将大家聚集在一起,彼此产生一定的交互并沉淀优质内容。对于疾病社区的线下映射多见各类病友社团如“**爱心之家”,病友的线上组织则多以Q群垂类论坛形式存在,下文讨论的肿瘤病患社区则依托QQ兴趣部落而建。

首先交代一下背景,公司产品为肿瘤病友社区APP,作为打工人工作职责之一是让目标用户知道并使用产品,在QQ兴趣部落上建“社区”目的就是为了导流。

(部落内嵌在手Q中,并有独立APP,但已被战略放弃,上图为网页端)

回看15年的部落像是社区的1.0版本-贴吧,确定社区调性和方向、做内容、找用户、设规则、做活动并最终达成完成病友社区小生态,形成内容的产生分发并做到产品的导流就是我的工作了。

1. 定调性和方向

社区调性向以玄学著称,大众认可好的社区是有自己的文化如快手的老铁、社区用户有很强的归属感如B站的二次元和有属于站内的故事如知乎的“刚下机……”,但之所以称为玄学是以上并非社区的调性的全部,社区至少是链接内容、消费者和生产者并形成三方间良好粘性的产品形态。

产品定位就是肿瘤病人,那兴趣部落自然也是围绕肿瘤病患做内容的消费和生产,方向也就是肿瘤病患感兴趣的内容方向。

2. 做内容

所谓万事开头难,对于从零做社区填充内容是第一步,运营最苦逼的搬运工作在所难免了,其次利用了信息不对称我也搜寻互联网上已有的内容进行二次编辑整合,尽量简单直白的说明了内容,在这过程中印象最深的是人肉去把中科院肿瘤医院的各科室肿瘤指南变成电子版的经历,作为非医学生的我不要太痛苦。

社区需要优质内容,上述内容虽说干货满满,但此时更像是一个媒体平台。作为刚入行的运营所能参考的就是已有的pc端肿瘤病友论坛贴吧,发现病友自建论坛除“久病成医”的干货贴外,经历贴和求助帖其活跃度是相当高,此时基本可以确定部落对ugc内容的方向-让用户生产经历贴!

因为还处在零起步阶段,没有用户情况下只能继续“运营人”的自嗨并发挥“写作”天赋。由于承担自媒体工作,做故事内容征集写自媒体同时可同步社区作为冷启内容。

到现在还是做基础社区氛围的搭建,在写人物故事时会刻意去寻找真实案例,并有意进行种子用户的挖掘。对于这部分人群尤其年轻的病患,他们需要一个有归属感能够发声证明自己存在的地方,不过难点就是他们对社区的信赖程度,是否愿意发声。此时前面铺垫的内容承担着中立的工具属性,无广告的社区氛围则利于促成用户发声。

在这个过程中主动帮助他们发声,撰文写故事的方式帮助记录生活点滴,降低ugc社区产生内容的智力成本,高度相似的经历提供阅读内容外还可用于用户的二次创作如持续的跟帖互动形成新的消费内容,原型人物会有社区荣誉感,激励持续创作开帖。

相近的内容密度足够高会产生更为细分的内容,带来有效的讨论,有了交流进而有了用户间围绕内容进行互动从而带动整体的社区氛围。

肿瘤社区有个难逃的话题就是死亡,有过同用户的沟通一部分人会乐观面对,但多数人还是恐惧,社区能做的就是客观的记录,社区能做的只是提供精神的寄托,无法替代医学治疗。

3. 找用户

做内容和找用户基本同时进行,好在社区足够垂直,干货内容可以先行一步,另一个好处垂类社区如方向得当用户自然易于发现。

1)QQ群

在15、16年QQ群一直是寻找目标用户的地方,搜索关键词会出现相应的QQ群,虽然微信已经普及仍有部分社群持续这高活跃状态,QQ兴趣部落诞生之初也是同社群结合相当紧密,此时需要做的就是同群主沟通能否接入兴趣部落。

说明兴趣部落同QQ群的关系以及通过填充的内容对应用户存在的需求,但由于人群的特殊性存在部分售卖假药等黑产已经给部分用户带来创伤,对于有公司背景的我和kol沟通还是有一定的难度。

因为社区内有干货内容的存在,作为用户在社群内分享会吸引一部分目标用户通过内容转化关注到社区,另外同群主(kol)沟通中说明社群所不具备且社区所能提供的东西,通过公司已有的公立医院医生资源,为社群提供医生群内答疑等,尽量消除用户的疑虑。

2)微博

对于寻人尤其是大v用户微博应该是最好的渠道了,微博的认证和粉丝关注已经帮你筛选了最精准的用户出来。

通过微博关键词找到了很多精准且在垂类病种中有影响力的医生、病患,除去医生外病患资源是早期社区大V的来源,其抗病经历也可反哺自媒体作为内容传播。在某段时间主要精力就放在同这部分用户沟通上,另外通过微博的前身博客也找到了一个庞大的肿瘤病友组织,他们会定期做线下病友交流分享会,分享治疗心得交换名医资源,甚至出书写传记,其中不乏抗癌明星。

我有幸参与过他们的线下组织并因此结缘抗癌明星,由此也获得其书籍整理电子版并进行传播的权利,这也帮助吸引了很大一部分病患家属,增加了社区的关注。

3)自媒体

在工作时同时兼顾自媒体账号,由于APP功能所限,某些社区功能会以兴趣部落作为承接载体,所以自媒体也会向兴趣部落做引流。

在社区(兴趣部落)做话题征集引导用户生产内容,通过前期铺垫内容让用户从逛社区到融入社区,从参与互动到生产并获得认同和反馈,从社区中选取优质内容在自媒体中进行二次传播。

4)兴趣部落垂类榜单

由于在他人平台上身份等同吧主,除管理社区外就是研究平台规则。社区创建在医疗分类之下,研究兴趣部落医疗垂类贴吧排序规则,争夺曝光资源也是工作之一,QQ的海量用户可通过兴趣部落的排名为其引流关注。

4. 设规则做活动

社区是基于QQ兴趣部落功能,作为创建者(大酋长)只能围绕创建话题、删帖、顶帖等基础的贴吧玩法做拓展。

上述阐述了做肿瘤社区时的一些经验,在运营工作上感悟到内容和氛围的重要,对于垂类社区其价值为细分人群提供率“解决”问题的工具,通过社区的某种行为让目标人群有了反馈甚至产生了社交货币并获得了社交资本。

关于商业模式其实本不该是运营操心的事,但现在回头去看“风口之上,猪也能飞起来”这件事取决于风是否持续的吹,移动医疗行业政策决定生死。再好的交互、再给力的用户体验,为病人提供社区氛围感,聚集无数同属性用户之后能做的也多是医疗之外的帮助,肿瘤疾病可算重症也可看为慢性病,风口过了什么“院外护理、在线诊疗”此类短期难以变现均被资本看作无效弃子。

不过因为各种原因不能同公司继续走一下去,甚至兴趣部落也因其内核趋同贴吧并没有很好的移动化已被鹅厂战略舍弃,现在苹果市场已搜不到其独立APP,QQ上也找不到任何兴趣部落存在过的影子,仿佛从未出现过,唯一证明它存在的地方可能只剩官方建立的Q群,一年未响动的群有了声响,不停@官方询问部落后续……但已无人回复。

二、中老年短视频直播社区

互联网公司中提及中老年多和下沉用户一同出现,少见单独以中老年用户为主要人群的移动互联网产品。相比肿瘤病患为求生刻意寻求带有关键词的产品,对该人群多数不愿承认自己老了且产品下载路径更倾向于社交传播,市场中带有中老年关键词的APP下载量也不尽人意,如果本身不是中老年,除观察长辈手机/家庭群发链接外很难知道他们使用那些产品。

公司始于视频剪辑工具后转型社区,种种原因社区玩家变为中老年人~

或许是2016年千播大战,跟风做了直播,在17年初入职时直播仅支持开播、观看等基础功能,而我的工作就是从社区培养主播、引导社区用户观看直播。

1. “奇特”的产品形态

人有生理、安全、归属和爱的需要,也有被尊重和自我实现的需求,对于中老年人归属和被需要可能格外看重。当中老年人的个人价值不能在社会和家庭得到施展时,很容易陷入精神的空虚,所以也能理解长辈频繁发“养生鸡汤、美文祝福、年画风和游玩照片”之类内容的原因,想必是从中可获得一定的精神满足感。

A产品提供了剪辑功能满足了部分中老年生产“朋友圈素材”的需求,同时在A产品中内容有曝光展示的机会,通过某些策略的制定给予了他们被“重视”的感觉,在理想状态下符合上图“为工具而来,因网络而留下”的认知路径。

2. “友好”的社区氛围

对一款社区产品来说,社区氛围就是产品调性也能说明用户的特质,可以增强用户的归属感,不过另一面就是过于强调调性则造成用户容易抱团,排斥其他用户,产品容易造成天花板,这是产品用户量始终上不来的原因之一。

本文不讨论A产品因社区调性带来的负面情况,重点在社区的进化以及直播如何融入社区。

1)成为提供“社会资本”的工具

“年纪大了就容易怀旧”外出旅行拍照、家庭合影或者日常花草、猫狗等占据着父母的相册存储。父母使用各类工具将照片制作成视频音乐相册时,满足了相册存储功能同时也增加了照片的趣味性而获得了自我满足,分享到社交渠道获得亲友的赞誉甚至请教制作方法,获得了成就感,在自我满足和外部荣誉之下,部分用户获得持续制作内容的动力,工具也就获得了社交传播。

2)成为独特的社区

理想状态下,看到社区中相似的内容聚集时可帮助用户快速融入,相似的内容也可让更多用户有意愿产生相近的内容,从而产生更多的社区内容,社区内容的相似性又帮助找到相似的社区用户如此往复。

但对于UGC短视频产品,绝大部分用户上传的内容对非好友来说都不具备价值,当内容不具优势时,互动或许可带来转机。

不管是用工具心态制成后的站外分享,还是因社区策略制作后的站内“被动”展示,人们都是在寻求最有效的途径来最大化他们的社会资本。平台通过现有用户属性取“最大公约数”来择优选出内容展示,帮助部分用户获得除朋友圈外的额外社会货币,给予社会资本,让其获得满足。

有别于其他群体,产品提供内容曝光、评论展示等基础功能后,由于中老年用户的“人情观-别人给我点赞互动,我要回访”会形成较好的互动行为,上述行为就会产生新的社交货币即除因熟练使用工具、有精美素材制作的视频内容外,良好的社交互动行为也会因此获得他人的关注,这一层“工作证明”降低了社区货币的获得门槛,毕竟多数人创作内容也是寻找“存在感”,内容只是其中的媒介。

虽然内容中的中老年喜爱的视频、游玩影集和年画风音乐MV评论区多见“点赞、真棒、加油期待回访”之类在我们看来不痛不痒的留言,但对他们来说这种公开式的留言方式写出已出于真心而非敷衍,细想线下场景两个不熟的中年人见面不也多是寒暄,而进化为重度社区用户“60后姐妹团爱恨情仇”更像宫斗剧,“出场”方式绝非这么简单,有机会可详聊。

3. “奇特”的直播定位

说回直播,17年市面可参考的直播形态多为肤白貌美的秀场和游戏直播,我的工作是要社区的中老年用户来参与直播,将直播作为用户的内容之一,增加用户对社区的认同感,这也是我开篇说明自己做的是社区运营而非直播运营原因。

1)社区短视频同直播的关系

人的时间有限,使用产品基本就是零和博弈的过程,产品内短视频同直播就是相互依存且相互冲突的关系,短视频本质是认同,是粉丝,直播的本质是注意力,是转化。

对于新用户如果无法快速理解短视频社区的成长路径,即不知道如何制作出符合社区调性的视频作品时,直播或许可以为新用户获得新的社交货币,减少流失并为后续更快的融入社区做铺垫(前提是社区内容同直播内容格调相符)。

对老用户来说,社区原有的视频制作成本高、频次低,无法带动产品高频使用并且部分用户无法通过此类“工作证明”获得满足感,或存在社区的阶级固化,急需新玩法打破现有规则,直播则提供了对社区有粘性但没有找到合适的工作证明的用户。

不管是新老用户对于直播“1.0版本的定位就是让社区用户有更好的归属感,同社区氛围不割裂”

2)直播的成长

有了上述定位就需要考虑下面的问题:

  • 中老年对直播的认知(“直播社区”是什么)
  • A产品做直播的优势(“直播社区”的玩法)
  • A产品的用户为何要参与直播(用户参与“直播社区”的理由)
  • 直播是否能增加用户对产品的认同归属感(用户融入“直播社区”并形成新的文化)

问题1 中老年对直播的认知(“直播社区”是什么)

直播虽已经过千播大战的教育,但目标人群毕竟不同,要从业务层面考虑用户是否对直播有认知,认知程度如何,解决问题最重要,以共情同理心将用户分为一下3种情况:

①社区原有kol:

“富有的,给他更多;没有的,把他仅有的也拿走。”这是《圣经·马太福音》中的一句话,作为社区我们当然不会照单全收,直播冷启我们需要让更多用户知道直播,kol的直播可以让更多用户知道。

这部分用户多有一定的身份标签,根据标签的不同定制直播栏目类似如“名人堂”,在站内做banner宣传、活动推广,给他们直播的理由,将直播打造成他们容易理解的电视栏目,而他们就是上电视的名人。可能内容的趣味性大打折扣,但对渗透有很大的帮助,用户也乐意配合,作为短视频内容的直播延伸。

因为中老用户的学习成本高,他们在社区中已获得足够的成就感并且实际精力不允许拓展太多新玩法,在原有工作证明得以保留的情况下,想要长期持续直播产生内容并非易事,所以注定只能是直播频道的“导流者”。

②社区用户:

这部分用户大概率因kol而看直播,后续做直播活动如歌唱、朗诵比赛等活动脱颖而出。在社区无法获得的满足感但通过直播可获得,由于本身有一定好友,所以直播动力更持续,可将一部分精力放在直播中,该部分为后续社区型直播用户主力军,帮助平台丰富直播内容,拉长直播时长,是直播频道中的主力玩家。

相比图文视频,直播更为立体的展示一个人的性格外貌,通过言谈举止了解这个人的思想,通过环境了解这个人的生活背景,直播丰富了他本人。当我们都爱邓丽君,喜欢她的歌,通过短视频将爱好扩散,通过直播将爱好表演出来,满足了用户多场景互动。

③非社区型用户

直播先是基于内容后是基于人,这句话放在这部分用户中更为直观。没有了社区粉丝基础,这部分用户如能持续直播必懂得一定用户运营技巧,毕竟直播内容由平台把关,定是模仿了部分社区直播内容并加之发扬光大才能得以生存。

说上述话的原因是由于要保证社区调性,对于直播内容、主播年龄都有严格的控制,虽为明确说明,但有意扶持中老年主播如有一定才艺则更是力捧。对于市面常见的秀场类主播尤其年轻貌美、声音浮夸如出现则刻意打压,减少流量,保证中老年主播的“生存环境”,严格把控社区调性。

因为前期对内容的严要求,后续站内原生主播持续生长,出现了很多中老年且实力不凡之人,这部分主播后续成为产品的营收主力军。对比短视频,他们将直播作为新的社交货币并融入到社区之中,与短视频社区也不会存在很大的割裂感。

问题2 A产品做直播的优势(“直播社区”的玩法)

大众认知下如果是中老年直播可能是这样:

优势:

  • 时间充裕,目标群体相比年轻人娱乐时间更多
  • 经济优势,一二线目标用户可消费能力强
  • ③孤独感和被需要感,社会身份的转变需找到新的生活价值
  • ④中老年娱乐内容少,线下受地理位置等因素影响娱乐方式有限,线上专属中老年社交娱乐方式主要集中在微信、k歌和短视频产品中,直播内容较少。

劣势:

  • 学习成本高,主动参与性低
  • 消费理性,区别秀场荷尔蒙消费中老年消费较为理性
  • 常见的秀场类内容及弹幕互动方式对中老年不友好,容易受到忽视从而无法在直播间获得“身份地位”和认同
  • 认知改变难,市面直播多以年轻化内容为主且节奏快,目标用户可能感知”无法参与“甚至抵触心理。

A产品做中老年直播的优劣势:

优势:

  • 有钱:中老年用户集中且”高净值“用户多
  • 想玩:平台无多人及时互动功能,对中老年人线上”群体性“活动的社交需求没得到满足
  • 场景:提供除短视频互动外的社交场景,增加社交货币

劣势:

除中老年直播劣势外,已有社区用户习惯站内功能,任何新功能都会引起短暂的不满,部分占据社交资本用户不愿增加新的社交货币来稀释原有生态。

基于上述优劣势为其添加玩法,优势中针对群体性社交、孤独感和被需要这几点,全民k歌的歌房可获得一定的满足,他们以家族、兴趣爱好为据点,半熟人间邀请制形成独特的社区文化。

但k歌毕竟存在门槛,针对普遍的孤独感,陪伴式和中老年的泛文化类直播内容尚可入手。对目标用户,好的运营方式就是根据特性做活动,前期以邀请制找主播,为主播增加曝光让站内用户都知道开通直播并来围观,通过产品功能让用户参与到直播中。

劣势中的学习成本高那就需要产品的补足,同理心和共情能力之下提出产品策略如上麦互动交互展示方式就需根据目标用户做考虑。

这里说两个值得夸耀的细节,产品虽然迭代了很多营收项功能,但对上麦按钮和麦序数量这两点基本没做过多改变。

上麦按钮:上麦按钮和礼物按钮同级别且优于打字互动和转发,直播业务模式下礼物按钮重要不用过多说明,上麦按钮的突出则出于以下几点考虑:

  • 中老年用户生理机能考虑,语音或视频直接对话效率一定高于打字看弹幕。
  • 对主播来说,主播为社区用户转化且初衷多为打发时间,主播在意的是有人和他说话并且越方便越好,便利的操作有利于用户上麦的互动。
  • 对观众来说,对比其他直播产品上麦并非重点,A产品并没参考主流样式而是根据实际情况为观众提供最便利的上麦互动方式。增加上麦就能增加用户间的互动交流,能弥补内容的不足,甚至从最终付费的心理来看,互动最终让用户间突破主播观众隔阂,让成为朋友变成可能,付费也成为人情的往来。从围观的观众来讲,有内容的互动式聊天肯定要比无主题的单人演讲有趣的多,毕竟在少了颜值的情况下,大家默认关注的是内容,也满足了老年人爱凑热闹的心理,同时上麦的用户也可帮助主播“招呼”直播间观众,调动大家的情绪。
  • 对平台来说,上麦可以增加主播开播时长、观众观看时长、促进用户社交等,对中老年平台在社区内培养直播行为有利而无害,理论上社区化的直播也不希望出现粉丝集中在某一个主播身上,保证每个主播开播都会有一定量的忠粉观看足以。

对于上麦可能有些人会联想歌房或多人窗口直播,但从用户角度则没有了“主播”概念,用户上麦更多是作为主播内容补充,起到参与的目的,而且歌房的出现不利于其他用户开播,会对开播主播数有影响,我们希望的是部分用户通过上麦体验到直播的乐趣,可在合适的机会自行开播并召集好友捧场参与上麦互动,形成新的主播筛选循环。

如果产品参照其他直播将上麦弱化,我相信直播社区化基本等于失败。上述都是因为上麦按钮做的明显带来的好处,坏处有没有?可能的坏处就是上麦观众存在违规行为,虽然这可能会给平台造成负面影响,但毕竟是小概率事件且可以通过技术加人工审核手段及时处理。

麦序数量:这里的麦序数量对比秀场类平台应该少见,多数这个麦序量级直播形态基本已变类歌房小窗口形式。产品没有改变的原因是保证了“主播”身份也满足了中老年爱热闹的心,多人互动有利于形成讨论、互动,帮助直播加速社区化,形成用户好友关系……

问题3 A产品的用户为何要参与直播(用户参与“直播社区”的理由)

上文很大的篇幅都在叙述关于“社交资本、工作证明”的内容,对为何使用直播,简单来说提供了新的社交货币。

短视频是内容,用户之间的交流在于异步的互动,直播则在社区之上更进一步,需要实时面对面的交流互动,这一点其实很考验个人能力,尤其还是在用爱发电的中老年人群里。

也曾寻找过公会,但在成本等考虑之下还是选择了“最笨”但最符合社区化的方式。在做直播内容的时候发现,不管任何年龄层都愿意为“美”消费,用户参与短视频制作是希望追求社交货币,直播能获得满足时他们也乐意尝试。

作为主播他们有了被众星捧月的感觉,我会为这些中老年主播建立粉丝群,引导产生适合的短视频内容帮助分发,为他们吸粉,在直播的过程中作为内容的生产者除精神上的奖励外,还会获得真真切切的收益,参考中老年为各种极速版产品的奖励金而打卡拉新,直播的营收足以带给他们额外的惊喜。

作为观众同样因内容而来,在付费观众中直播打赏可以算是付出网络成本最“少”,网络社交见效最快获得社交资本的方式了,直播间内等级地位较低的人总会突显出小部分付费用户的特殊,当形成足够的社区规模时更是会激励其他人参与到付费买地位的有中(中老年为主的直播社区arppu值约90元+)。

A产品比较有趣的例子是这些付费的中老年用户往往也会开直播,而形成的社交关系此时就会涌入直播间,通过上麦等方式共同为观众打造一个主播没有才艺,但也能持续观看的直播内容,此刻秀场类的才艺内容就无关紧要。开直播,就是交个朋友咯~

问题4 直播是否能增加用户对产品的认同归属感(用户融入“直播社区”并形成新的文化)

说结论,直播对社区归属感的提示有很强的帮助。直播对短视频社区是内容的延伸,主播作为社区的一份子会参与短视频内容的投稿并且粉丝间形成小团体也没有放弃短视频社区,直播录屏、截图等衍生内容作为短视频素材来源之一,运营也会刻意做唱歌等视频活动,帮助直播用户在社区扩大影响力。

3. 直播的困境

短视频可以通过社交渠道不断吸引流量,但直播则是消耗流量的地方,理论上直播是有限时间的生意,主播固定时间表演,观众为这个时间价值买单,短视频社区则起到直播之外用户的消费场景。

传统的秀场直播重头部主播,重付费用户体验,新用户很难在秀场模式下快速融入,平台则努力将未付费转化为付费,付费转化为土豪用户来提升渗透和arpu值。

A产品理论上在用户不断转化直播社区中,通过服务更多的用户就能有更好的营收,但现实问题中老年社区在现有玩法下难变大,他们的审美视角无法同移动互联网用户中的大多数一致,最终结果短视频用户增长缓慢,对于直播这个产品模式如想赚更多钱,必定要逐渐“秀场”化。

在前文提到的三类主播中,中老年社区kol对“人情债”和自己的社交资本看的很重,不会贸然消费自己的社交货币。

社区用户则处在中间层,善于互动的中老年会很快掌握直播要领,获得了社交资本外也看见了实际的收益,但在观众固定的情况下收入也会固定,无法满足企业的利益最大化。

最后一个是新用户或没能掌握短视频社交货币的一群人,他们可能因直播或工具而来,赚钱目的明显,但最大的问题他们没有归属感,他们是主播中最不稳的一群人,但也是直播里唯一能带来新鲜血液的一群人。

今天再看产品信息流的排序基本可推测直播的调性,需要新鲜主播的注入带来新的营收,在盈利和社区化此刻最好的选择可能也是前者……

三、最后聊聊自己

前四年的运营工作给我带来的就是思辨、灵活、快速尝试,认识到运营的执行力的重要,不去尝试所想终究无用。思考社区会想看大家在网络上交流的变化,了解竞品会把已知所有目标用户产品都去体验包括这个行业的优秀产品。工作第五年的自己内心变得迷茫,执行力也变差,处于焦虑之中,希望尽快调整状态,找到合适的工作方式,另外也在努力的系统学习中~


文章来源:人人都是产品经理  作者:马丘

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

日历

链接

个人资料

蓝蓝设计的小编 http://www.lanlanwork.com

存档