首页

2021年平面和视觉流行设计趋势

资深UI设计者

预测来了!2021年平面和视觉流行设计趋势

编者按:2020年已经余额不足了,2021年的平面和视觉设计趋势会是怎样的?今天的文章来自资深设计师 Iveta Pavlova,看看她所总结的12个趋势:

我们迫切地希望2020年尽快过去。

疫情,隔离,线下教育受阻,线上学习成为了主流,网购替代了去超市采购,娱乐和沟通都从面对面改为远程。需求的转变,也带来了新的增长。

无论是人还是企业,都需要比以往更快地适应变化。技术和趋势上也反映出了类似的情况。新的时尚和技术正在推进,你会注意到很多事情和以往有所不同。

快速、直观的导航,更加具有安全性的设计、节能、深色模式,这些趋势和要求开始越来越显著,这些趋势所影响的已经不仅仅是网页,APP,还有大把的公司品牌,LOGO设计、营销策略、 插画设计等等,它们呈现出一种连锁反应式的变化。

今天的这篇文章,我们深入梳理一下 2021 年将会出现的视觉和平面设计领域的流行趋势走向。

1、3D设计

从总体上来说,3D设计这一趋势是在往上走,越来越成熟,也适配地越来越广泛。设计师和品牌也在充分利用的技术来呈现3D效果,在软件层面的支持也相当的完善,从整体视觉到UI元素、交互、体验,3D 近乎无处不在。

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

而在3D设计这个领域当中,写实和超现实一只手最为流行风格方向。从目前已有的很多设计来看,这些 3D 建模渲染出来的角色和场景,大多作为视觉主体来呈现,在页面中占据主导地位。而将图像和文本结合起来的方式也在影响着3D设计,很多更加贴近潮流的设计当中,会将照片和3D元素结合到一起,产生极有调性的视觉风格,加入动画,能够瞬间让设计脱颖而出。

在这些 3D 的设计范例当中,很多令人惊叹的作品并不非出于艺术来这么设计,相反是为了更好地引起用户注意力。在这个注意力匮乏的时代,3D 设计是大杀器。

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

2、Emoji

Emoji 是另外一个流行趋势。表情符号已经突破了「传统」的聊天领域,开始广泛地运用到平面、视觉甚至 UI 当中。它开始充当一种介乎文字和视觉之间的新型语言,它还能传递出情绪,这就很给力了。

于是,各种 Emoji 在平面和视觉设计中,被用来消解严肃,营造氛围,让设计更加轻松。在未来几年中,Emoji 这一元素应该会被应用得更加广泛,并且会以更加富有想象力的方式,呈现在方方面面的设计当中。

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

3、自然有机设计元素

十年前,富有有机感的自然元素随着扁平化设计的兴起而逐步淡出主流趋势,但是如今,它又再次流行起来了。

自然的线条,柔和的光线,泥土和树叶的色调,贴合自然特征的渐变,再一次被主流所拥抱。

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

不过如今的这些自然元素的运用,会更加简约,无论是小元素还是大插图,通常不会用得很满,材质和肌理的运用也会相对克制。

促使自然元素的流行的另外一个原因,是疫情和隔离。长时间没有机会外出会让用户对于自然元素更加青睐,哪怕它们仅仅只是存在于设计当中。

自然元素并不会受限于领域,无论是技术相关还是商业领域,自然元素都适用。

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

4、视差错觉设计

当大脑看到的视觉信号和通常认知不一样的似乎,大脑会下意识注意到它,会让眼睛躲看看,尽量想办法处理好……而这,也就是视差错觉元素在设计当中的独特价值!

对于看不清楚的东西,人就越是想看,上头,上瘾!

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

而从2020年开始,视差错觉开始从小众、古早的设计领域当中走了出来,被时尚和商业所青睐,越来越多的品牌开始借用这种手法来抓住用户注意力,这种视觉奇观的价值在今年得到了体现,在即将到来的 2021 ,可能会更加流行。

不过,这种设计要注意控制好复杂度,太繁复复杂了可能会让人觉得不适,小心使用。

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

5、3D字体设计

字体设计一直在流行。而在 2020 年,3D 的字体设计开始出现在各种地方,有趣的概念和想法层出不穷。

逼真的3D字体,和现实的元素交错,制造出独特的视觉效果,这是 3D 字体在 2021 年最有可能流行的玩法。与此同时,3D 字体的排版效果结合动画、肌理、图案将会是最主要的呈现方式,因为目前最前沿且流行的软件和技术,都可以做到,且非常适合这样来搞事情。

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

6、卡通插画

自定义的手绘插画是创造独特设计的一种常用形式。但是手绘插画风格很多,而卡通插画能够脱颖而出的原因其实很简单:有趣,多变,功能强,效果好。

卡通插画本身是认知度最广的一种形式,可以繁复可以简单,最重要的是,它的趣味性足以让人驻足,表达形式可以非常巧妙,也可以引人发笑,在品牌推广和营销上,有着独特的优势。

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

7、黄金元素

金属效果其实正在越来越流行,而其中能得到最广泛喜爱的始终还是金色。所以,带有黄金质感的元素,或者类似风格的视觉设计,将会在 2021 年得到更加广泛的流行。

当然,除了黄金之外,白银、黄铜、铅类似这样的金属质感同样会随之风靡,金属的光泽、粗粝质感,光影的变换,都是这种视觉元素标志性的特征。

有的设计,会聚焦于黄金质感本身:

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

还有的设计,会江黄金和其他的具有现代特征的材质(比如大理石、玻璃、塑料)结合到一起使用:

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

8、像素艺术

从数字媒体诞生开始到现在,像素艺术其实一直都没有真正过时。

Minecraft 和乐高是让像素艺术「文艺复兴」的重要推手,更加成熟的 3D 技术让三维立体的像素效果得到了大规模的普及。

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

在2021 年,你可能会看到更多更加富有调性的 3D 像素艺术设计作品,它们有趣又复古,但是在技术和效果上,又有着现代的痕迹和独特的趣味。

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

9、单色调和双色调设计

制造简约和富有凝聚力的设计的方式有很多,其中之一是对色彩进行精简。在时间有限并且目标明确的情况下,单色调和双色调的设计其实是很不错的选择。

正是因为此前各种炫酷多彩的设计流行了接近10年,厌倦了信息过载的用户和设计师开始拥抱单色调和双色调的色彩组合,最主要是这样的设计更加易于产出,也易于吸收理解。

单色调和双色调的设计,最突出的优势,其实是让形体更加突出,让视觉更加明确、和谐,对于用户而言, 这样的设计也更加平静、舒适。

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

10、几何图形设计

不要小看最基础的几何图形,实际上在最近2年,设计师们用自己的作品证明了一件事情:即使是最简单的几何元素,同样可以创造出繁复、有趣、富有想象力的设计。

值得注意的是,这种设计趋势的特点在于多个几何元素的拼接组合,这种方式消解了单个几何元素的单调感,反而能够制造出丰富而强大的视觉体验。

想要把握这种趋势,你可以使用 3D 的几何元素来进行拼接:

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

也可以用好朴素但是可以玩出很多花样的平面几何元素,这种设计会更加抽象:

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

11、错落繁复的版式设计

字体和排版设计其实是时代的镜子。流行什么样的元素和风格,反映了当下用户的心态和想法。如今正在流行的排版视觉风格,是混杂了繁复变化的怀旧视觉风格,它们可能会在 2021 年呈现出爆发式的流行。

这种情况可能是源自于疫情隔离所催发的怀旧情绪,而其中对于规则的打破和略显繁乱的风格变化,似乎也源自于类似的情绪。

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

12、无色彩设计

去掉色彩的设计,会显得更加简约,对比明确。同事,采用无色彩的设计,会让设计本身足够特立独行,尤其是在如今这个多彩的世界当中。

经典的黑白色调柔和而迷人,它的魅力是独特的,甚至是不可替代的。无论是阴影、动画、液态效果还是有机元素,它都会更加显得形体化和轮廓化。

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

预测来了!2021年平面和视觉流行设计趋势

结语

预测未来总是一件有趣的事情,而在如今这个阶段,对于未来趋势的预测,也包含了另外一层意义,就是对于未来的期待。想要把握未来,继续前进,那么就需要不断地追索。



文章来源:优设    作者:
Iveta Pavlova


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



IBM研究者教你玩转卡诺模型

资深UI设计者

翻译:Grace Gogh  审校:冠男Ben |   UXRen翻译组 #343译文
作者: cary-anne olsen-landis(前IBM Power Systems的经验研究主管)
原文标题:《Kano Model — Ways to use it and NOT use it》

 

设计团队为产品提出了一系列用户需求。
开发(工程师)团队带着的不一样的功能包来到会议桌前。
管理团队只想留下那些能使公司盈利的功能。
运维团队认为需要优化的功能则完全不同。
产品团队如何知道该朝哪个方向推动项目?

作为设计研究人员,我们借助用户的所言所行来深入阅读并洞察他们的需求。但是,我们中的许多人都在努力寻找新方法来实现需求的可视化管理,以便和上述的跨职能团队达成一致(拉齐认知)。用户当然可以对功能进行投票并对其进行排名,这可以提供很好的方向,但这并不能给到更深层次的需求定义,即哪些功能是必须有的,而哪些功能是在期望之中的。

现在开始认识卡诺模型。

 

1. 卡诺模型(Kano Model)是什么?

图1:狩野纪昭(来源: Mind the Product)

Kano模型是由Noriaki Kano教授在20世纪80年代提出的产品研发和客户满意度理论,将用户偏好分为五类。它通过评估每种功能的2套衡量标准:满意度和情感度,来提供帮助我们了解客户对产品功能的看法。这2种衡量标准的组合形成五类属性:魅力属性、期望属性(线性属性)、无差异属性(次要属性)、必备属性和反向属性。

 

2. 如何使用卡诺模型?

设计一个调查问卷,并独立列出每个功能。最好在可能的情况下通过原型或交互式线框稿来演示每个功能。你不必花太多时间进行原型设计,这只是传递想法的原型。有些人甚至只展示原型的某处细节,可能是因为他们喜欢这个点子,但并不喜欢它的实现方式。

图2:功能用图片展示的例子

 

如果无法使用demo来展现功能,说明性文字也可以很好地发挥作用。

图3:功能用说明性文字表示的例子

专家提示:与其他IBM研究人员讨论时,比较成功的研究人员测试了15–20个功能。那些不太成功的则测试了30-40个功能。 测试20多种功能对于客户和研究人员来说都已经足够多的啦(不建议超过20多个)。

看到每个功能后,用户可以对卡诺问卷的进行选择回答:

  • 如果您拥有(功能),您的感觉如何?
  • 如果您没有(功能),您的感觉如何?

(Daniel Zacarias对于如何清楚地编写这些问题提供了一系列优秀的建议)

针对上述两个问题的标准Kano问卷答复为:

  • 我喜欢它( I like it)
  • 本来就应该有它( I expect it)
  • 无所谓/保持中立( I’m neutral)
  • 我可以忍受它(I can tolerate it)
  • 我不喜欢它(I dislike it)

Daniel Zacarias还为答案集提供了其他一些选择。基本上,如果您要尝试使用卡诺模型,请阅读他的整篇文章。太奇妙了。

Jan Moorman还建议添加第3个问题此功能有多重要?

她建议使用“一点也不重要”至“超级重要”的9级李克特量表。但是,当尝试在李克特量表上阐明重要性的9个点时,这有点棘手。似乎7点的李克特量表阐明起来比较容易。

图4:李克特量表的7级重要性

当你找到答案,Daniel Zacarias会介绍详细的分析过程。 我强烈建议您仔细阅读。

IBM的研究人员发现一个问题:得到这些数据很棒,但是数字本身并没有告诉任何人背后的原因,这是研究人员无法避免会被管理团队挑战的关键症结。 一个团队使用卡诺模型进行了大约15次定性访谈。另一个团队在从40个人中获得问卷样本后,又进行了5次定性访谈。两个团队都强烈建议在此过程中添加定性访谈,因为它有助于补充上下文的定性数据支持。

 

3. 如何“不使用卡诺模型?

IBM的某个团队不愿再使用Kano模型。该团队之前会使用场景描述(Scenarios)来代替功能(features)进行调研问卷的设定,但是,在测试进展中他们明显发现设定的场景并没有真实反映客户实际使用产品的行为,最终导致测试失败。

使用场景来展示功能的想法很好,但是当我们在讨论该方法时必须事先验证。经过确定现状的生成研究后,卡诺+场景组合(kano+Scenarios)将会非常有力。

另一条建议是减少正在测试的功能数量。承担了30-40个功能清单的测试团队表示,如此多的功能测试太密集了。这会导致在测试结束之前,用户不知所措,且疲惫不堪。

 

4. 卡诺模型的优势

卡诺模型非常擅长对功能进行优先级排序。卡诺模型的基础理论是Daniel Zacarias提出的“喜悦的自然衰减”。创新的想法和产品总会从令人兴奋的新颖功能(在Kano图表的顶部:魅力)转变成预期的功能(在底部:最好的必备,被贬损的,最糟糕的)。

利用卡诺模型获得最佳结果(来源:UX Booth和Jan Moorman)

以无线互联网为例*(灵感来源于参考文献中Jared Spool的示例)。

假设时间回到了2001年,你此刻正出差在外,带着一台具有以太网端口和WiFi的笔记本电脑。当你来到了酒店,发现有以太网端口可上网。尽管房费中未包含无线上网,但可以在商务中心使用WiFi。你此刻会很高兴!感觉太奇妙了!这是很棒的选择!

快进到2017年。你正在出差,并携带配备WiFi的基本笔记本电脑。当在酒店中,发现有以太网端口供连接Internet。房费中未包含无线上网,但是可以在商务中心使用WiFi。你真的会生气!这家酒店是什么鬼,需要额外付费才能上网?!还有谁依然在使用以太网端口连接到Internet?

经过了16年的发展,有些功能从最初的一种吸引人的功能(比如房间中的以太网端口,商务中心中的WiFi),变成了不受欢迎的功能。

如果团队不了解客户的需求,他们可能会专注于自己期望的功能,而不是极具吸引力的功能。使用卡诺模型的某IBM研究人员,在自己的团队中指出了这一点:“团队对某些功能感到非常兴奋,然后意识到这些都是桌面上的赌注。”

 

 

5. 卡诺模型隐藏的潜力

在讨论卡诺模型时,我们认为该模型还具有其他一些潜力:

  • 测量痛点的深度
  • 在产品生命周期中建立功能基准,以评估随时间推移喜悦的自然衰减

痛点深度(Depth of pain points)

该模型有助于揭示现有痛点的糟糕程度。卡诺问卷很容易用于研究,以深入了解为什么痛点如此糟糕,以及为什么这些功能对客户如此重要。它可能会揭示一些以前无法确定的需求,并推动进一步的创新。

基准功能(Baselining features)

我们讨论了使用卡诺模型作为功能的定期评估项目,以观察哪些功能降为较低类别。这种具有足够大用户基础的纵向测试可协助分析市场趋势和期望,并有助于随着时间的推移持续证明研究价值。它还可以帮助团队了解他们的产品何时开始趋于平稳,何时需要创新的想法来回到引领潮流的状态。

 

6. 开放性问题

有时,IBM的设计团队会担任某些项目的咨询顾问。IBM的一些设计团队被要求参与到某些项目中,以“梳理可用性”并在产品发布前渗入神奇的用户体验的“灰尘”。其他设计团队则暂时参与到边界更广泛的产品团队中。

在讨论结束前,我们还有一个悬而未决的问题:如果无法影响产品决策,卡诺模型还有用吗?你无法影响产品可能是因为该产品已经在开发中,或是由于管理层的压力,亦或是设计团队只是该产品团队的临时成员等等。使用卡诺模型的努力真的值得吗?

或者,即使不能影响产品,卡诺模型仍然可能有用吗?

你有什么想法吗?

在奥斯汀的IBM,一组设计研究人员会在每个月的某些时间共进午餐以讨论感兴趣的研究主题。之后,在IBM Power Systems的研究人员会收集并记录对话的重点。以上来自IBM Power Systems研究人员的午餐系列文章之一。

参考资料

  • 出色的Daniel Zacarias对如何完全实施和使用卡诺模型进行了完整的解释,他不仅给出了惊人的概述,而且还提供了制表工具
  • Jan Moorman在projekt202上讨论了她对卡诺模型的体验



文章来源:UX Ren    作者:宝珠


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


 

如何产出一个对实际落地更有指导性的的设计分析

资深UI设计者

设计分析是作为交互设计师必备的一项基础能力,一套有效的分析思路可以帮助我们找准设计发力点,更效率的推导出合理的设计方案,它是一种思维能力,也是一种方法工具,但是在我们的实际项目中,常常会遇到这样几种场景:

  • 新手设计师或者第一次做活动的设计师,设计分析不知道要如何入手

  • 花了很多时间做分析,但感觉对实际画稿子并没有什么帮助

  • 分析过程中发散了很多很好的点,但最后大多都落不了地

这些情况常常会导致设计分析流于形式,套用了很多方法、花了很多时间、输出了很长的文档,内容看上去似乎很丰富,但落地的方案却平平无奇,甚至也会自我怀疑设计分析真的有用吗?

总结下来,会出现这些场景的原因有两点:首先是设计分析太泛,没有聚焦到核心问题;其次是时间分配不合理,没有抓到发力重点。那么结合我们目前的项目来看,怎样做一个更有用的设计分析呢?

活动中常见的项目类型

根据活动产品化设计思路,可以把我们的日常项目分为两类:迭代型项目以及探索型项目。

迭代型项目是指过往已有过积累的成熟项目,例如大促主会场、我的专属会场、榜单会场、攻略等等,通常是一些已经比较固化的经典业务,或基础的功能类业务;探索型项目则是一些全新的业务方向,例如下沉会场、直播会场等等,刚处于进入期或成长初期。

undefined

如何完成一个有效的设计分析

1. 迭代型项目

迭代型项目容易陷入的一个误区是时间分配不合理,没有抓到发力重点,尤其是对于很多新手设计师来说,往往大部分的精力花在重复之前已经做过的内容,比如花了很多时间重新去分析用户、分析方向、分析行业趋势等等,但是对于已经比较稳定的迭代型项目来说,这部分背景内容相对来说已经比较固化(除非有明显的变化),这就可能会导致重复分析出来的结论跟之前的差别并不大,也很难带来实际业务提升。

undefined

既然迭代型项目过往已有过经验和策略的沉淀,也经历过多轮的数据迭代,核心思路应该是先定义要解决什么问题、然后才是如何解决,这样才能找准关键发力点。

要解决什么问题

首先要思考是不是真的有问题,没有问题的项目也可以不用再花时间做分析,效率做即可,例如像全部会场,本身的业务模式就比较简单,过往的效果也相对比较稳定,如果不考虑进行突破性的创新,通常是可以效率复用的,这种时候则不需要再去做分析,毕竟也要考虑投入产出比。

那么怎么定义要解决什么问题呢?有三个常用的思路:看数据、看用户反馈、看运营策略。

第一,从数据分析中找到关键问题,例如根据618的项目数据复盘,我们发现预售会场、品牌会场的页面跳失率较高,那么双11核心可以围绕“如何降低跌失率?”“如何提升流量利益效率?”去进行分析,从而推导出更有针对性的设计策略。

undefined

第二,根据用户反馈来找到关建问题,例如过往的主会场,用户调研一直都会反馈主推楼层太长而找不到感兴趣的内容,那么可以围绕“如何更好的进行需求匹配?”“如何提升屏效?”来思考和分析,解决实际存在的问题,才更有可能提升体验和数据。

undefined

第三,结合运营策略,很多业务虽然已经相对稳定,但随着每次大促战略的变化,运营策略上也会有一些新的需求,那么就根据这些差异化的诉求去找到发力点。例如针对我的专属会场,在原会场定位不变的情况下,在近两次大促中运营侧都提出需要由这个会场来承载平台服务内容曝光的诉求,那么服务内容如何匹配“专属”会场的用户心智,则是这个会场可以重点解决的问题。

undefined

如何判断真正有效的解决方案

在定义清楚核心要解决的问题后,就可以按照常用的设计方法进行方案的推导,在发散解决方案的过程中,如何判断方案的合理有效,确保最后的可落地性,是让我们设计分析有价值的关键,因此总结了两个常用的技巧。

首先要理解业务逻辑,减少无用的策略发散,很多时候我们的方案很难推动落地的原因,是没有考虑到业务的诉求,越能够深入的了解业务,才能更好的解决业务侧的顾虑,保证方案的可落地性。

其次是要跳出来从整体来看优先级,我们在进入自己的思维逻辑中时,会比较容易陷入细节,有时候自己觉得很棒的想法花很大力气去推却很难获得其他人的重视,并不是因为我们的方案不够好,而是没有关注到整体优先级,因此要学会看全局,通过多沟通多评估的方式来让自己的判断更加准确。

2. 探索型项目

探索型的项目没有过往的参考依据,相当于需要从零开始去探索如何做,对于设计分析的能力要求会更高,那么常常容易陷入两种极端相反的误区,要不就是容易被方法论套路,设计分析过泛但得不出实际有价值的结论,要不就是完全没有头绪,属于想一步做一步的类型,分析的内容之间缺乏逻辑。

undefined

因此,探索型项目的核心思路是要先有分析框架、再做纵向深挖,就像画交互稿的过程一样,需要先定义交互框架,纵再进行交互细节的打磨,才能够保证设计效率及效果。

确定分析框架

确定分析框架的过程主要分为两步,一是先想清楚要分析哪些内容,包括哪些环节是必要的,哪些是重点的,时间要怎么分配。例如当我们第一次做宠物品类活动时,需要对这个品类有深入的理解,因此我们在前期需要去分析养宠人群的特征、宠物行业的发展现状、京东宠物货品的优势等内容,而如果我们做的是一次大促的综合会场,其主要用户群体如果跟常规站内主流群体并无差异时,则不需要再花费大量的时间单独去分析用户画像,因此,需要结合项目情况先想清楚需要分析的内容、以及这些内容的必要性和优先级。

undefined

第二步是梳理清楚内容之间的逻辑关系,常见的逻辑结构有两种,一是递进式的推导(A→B→C),分析维度之间是先后关联的,通过严谨的逻辑步步推导而来,例如先梳理用户画像、才能进行用户行为痛点的分析、进而推导解决方案;另一种逻辑结构是进行综合归纳(A+B→C),即通过几个不同的维度综合推导,例如经典的五导家分析方法,结合用户目标以及业务目标综合推导出设计目标。

undefined

在很多设计分析中,我们也会参考一些方法论,其实方法论提供的就是分析框架,在理解了这一步之后,相信也能更灵活的应用。以下是根据我们日常项目梳理的一些常用分析框架。

undefined

纵向深挖如何得到有价值的策略

有了分析框架后,接下来就可以进入每个模块的具体分析了,如果要得到有价值的策略,同样有两个小技巧。

首先,策略要足够具体、有差异化,尽量避免提出过于笼统的结论。例如针对如何提升流量利用率比较泛的策略就是要进行流量精细化运营,这个大的方向没有错,但如果只到这一步是很难指导具体内容落地的,所以需要细化到流量的渠道有哪些、这些渠道有什么样的特征、针对不同的渠道用户可以用怎样的内容吸引他们,才能够更准确的判断是否会存什么问题。

其次,策略最好能够关联验证指标,可以参考UGD数据增长思路,在推导策略时要能预判它能带来哪些数据指标的提升,以保证设计分析的结论是有理有据的。


文章来源:站酷    作者:大葱设计


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

B端产品增长设计通用模式

资深UI设计者

导语

「增长(Growth)」概念的火热源自几年前畅销书《增长黑客》,目前已经成为互联网公司的重要课题之一。

增长设计,顾名思义,即通过设计来促进增长。对于 C 类产品的增长,方法和渠道较为多样,设计师能够发挥的空间和价值也比较大,我们看到的增长设计案例通常也都是以 2C 产品的为主。而 B 类产品的增长设计则受限较多。即便如此,如果 B 类产品的设计师能抓住机会、拓宽思路、不断尝试,也能够创造出独特的增长价值。

本文以增长漏斗 RARRA 模型为线索,按 Retention(留存)、Activation(激活)、Referral(传播)、Revenue(变现)、Acquisition(获客)的顺序,分享 B 类产品增长设计的通用模式和行业案例。考虑到数据安全原因,部分具体数据暂不展示。

Retention:留存策略

1. 迭代:分析-优化-测试

通过小成本、小范围测试,找到撬动的增长点快速迭代、持续优化,将效果提升到最高。整个测试流程:发现问题一数据分析一产生假设一展开测试一衡量结果,然后不断循环。随着产品的发展,必然会有新功能的加入和旧页面的调整,为了防止贸然上线新版本而带来不良影响,小范围测试就是一个很好的方式。

行业案例:软件开发与办公协作领域的头牌公司 Atlassian 的设计师曾经通过测试和优化迭代循环的方式来找出合适的设计方案。下图展示了他们测试新旧模态弹窗用户辨识度的数据,结果显示,新版的图文结合的方式反而容易让用户感到困惑。

近万字干货!B端产品增长设计通用模式(附超多案例)

经过测试结果分析,设计师们认为可能是弹窗底部大块的文字让用户难以快速抓住核心信息,因此他们对排版方式进行了改进,将底部的一部分文字移动到顶部,并进行了新一轮的测试,结果显示的版本效果最佳。

近万字干货!B端产品增长设计通用模式(附超多案例)

2. 特定的细分客户群

产品发展早期,很难迅速赢得广泛的关注。因此众多 B 类产品选择首先专注于一个组织中的一个部门,将产品传播给特定的人群,然后再逐步影响组织中的其他部门。具体可以采用以下步骤:

  • 为特定市场的早期用户群提供研讨会和线上线下会议;
  • 与目标市场中的早期客户讨论产品解决了哪些具体问题,并确保营销方案反映了这些痛点和解决方案;
  • 当你开始构建新功能时,在扩展到其它细分市场之前,确保它们与你的目标市场保持强相关。

行业案例:成立于 2002 年的 Atlassian 在发展早期,首先在开发团队中扎根,然后以开发团队为切入点,逐步扩展到企业组织中的其他团队。因为开发团队喜欢使用 Jira(Atlassian 公司的项目协同管理工具)并且不想转换,所以带动了其他团队也开始使用 Atlassian 的系列产品。目前 Atlassian 在全球有超过 6w 家客户。Salesforce 在销售市场也做了同样的事情。该公司的产品一开始只是一个客户关系管理(CRM)工具,并锁定了销售团队为目标客户。但而以此为据点,现在他们正扩展到企业业务的几乎所有市场。

近万字干货!B端产品增长设计通用模式(附超多案例)

3. 优化产品性能

产品性能优化应该一开始就纳入考量范围,建立良好的框架结构。虽然因为近年来移动端设备和网络环境的大幅度提升,流量少、内存小、加载缓慢等因素对大部分用户已经不再是制约因素了,但是依旧要注意产品的交互性能。

行业案例:阿里巴巴研发效能业务的体验团队通过自主研发的数据工具,实时监控各产品的性能,并通过 6 个维度评分的方式给出好、中、差三个等级的奖牌增加业务方的体感,督促产品性能的优化。例如其中内部研发工具 Aone 的开发人员参考该数据,针对首页等核心页面的加载时长问题做了专项治理,取得了显著效果,也将奖牌等级提升了一级。

近万字干货!B端产品增长设计通用模式(附超多案例)

Activation:激活策略

1. 让用户体验到惊喜时刻

惊喜时刻(Aha Moment)是指能够让用户眼前一亮的产品核心功能点。 如果你能让用户体验到产品的惊喜时刻,那么这个用户很有可能成为你产品的留存户。惊喜时刻的公式:
(谁)在(多长时间内)完成(多少次)(什么行为)

惊喜时刻能帮助我们了解哪些行为导致了用户的留存,帮助团队找到清晰的聚焦点。「Aha Moment」往往可以浓缩成某个「Magic Number(神奇数字)」。对于 Twitter 这个数字是 30,即关注了 30 个其他用户的人更有可能留存下来; Facebook 的是 10,如果一个新用户在一周内添加了 10 个及以上的好友,那么 ta 很可能在 Facebook 上长期保持活跃。

行业案例:对于号称「历史上增长最快的 SaaS 公司」 Slack 来说,这个惊喜时刻的「神奇数字」是 2000,即累计发送了 2000 条消息的客户更有可能继续使用并最终为服务付费,该公司是这样解释这个数字的:

如果一个团队在 Slack 上累计交流了 2000 条信息,这证明他们确实充分尝试使用了 Slack——真的试过了。对于一个50人左右的团队来说,这意味着大约10小时的信息量。对于一个10人的团队来说,这可能相当于一周的信息量。我们发现,不管其它因素如何,在收发了 2000 条信息后,93% 的客户至今仍在使用 Slack。

近万字干货!B端产品增长设计通用模式(附超多案例)

2. 消除摩擦

用户的欲望 – 摩擦 = 转化

摩擦是指阻碍人们完成他们想要完成的行动的障碍。摩擦无处不在,它可能是要你对一个刚开始用的 APP 进行打分的弹框、没有反馈的操作、填写不必要的信息、漫长的使用路径等等。

行业案例:以简单易用著称的项目管理工具 Basecamp 为新注册的用户提供了完整的项目样例,包括虚拟的人员、公告板、to-do list、时间规划表等等,一应俱全、简单易懂,还有可爱卡通形象来随时给与帮助,让用户放松心情、减少学习成本、顺滑地从新手过渡到熟练用户。

近万字干货!B端产品增长设计通用模式(附超多案例)

近万字干货!B端产品增长设计通用模式(附超多案例)

行业案例 1:蚂蚁集团区块链业务「蚂蚁链」包含的产品双链通,是帮助 B 类商家解决供应链金融问题的创新性平台。对应商家用户来说,该业务逻辑的理解门槛较高;入驻程序也较为复杂,特别是电子版身份证的验证,提交之后需要经过一段时间的等待,且通过率较低,客户也经常不知道为什么没有通过。这些原因导致用户一次激活率较低,往往需要尝试多次。

针对这些问题,设计师专门走访了上海、成都等地的多家客户进行现场观察,然后对入驻流程和相关页面进行了优化。优化后,用户激活一次性整体成功率显著提高;用户产品认知方面,选择「非常清楚」的用户比例翻倍,「不太清楚」和「不清楚」也明显降低。

行业案例 2:阿里妈妈是隶属于阿里巴巴集团的大数据营销平台。其营销推广产品直通车是全国营销收入领先的业内知名产品,但专业门槛非常高、推广价格也高,专职的用户需要 2~3 个月的时间才能完全掌握使用技巧,而对于精力和经费都有限的中小卖家来说,是否注册加入已成为一个纠结的问题。为了消除用户顾虑、减少认知成本带来的摩擦、提升注册率,设计团队将注册界面进行了优化:通过可视化的方式向用户直观地展现直通车的推广操作原理、核心推广位,鼓励商家点击注册。优化后商家的月均注册率显著提升。

近万字干货!B端产品增长设计通用模式(附超多案例)

3. A/B 测试寻找最优方案

增长的核心方法就是测试。测试可以免除设计师、产品经理、老板的主观看法和各持己见的争论,通过数据的反馈判断方案的效果。A/B则试,就是设计两种不同的方案,且两个方案之间只存在一个变量,以排除其它干扰元素。因为 A/B 则试只能存在一个变量,为了提率,我们可以同时进行多组 A/B 测试。

行业案例:为了提升从商家服务市场页面给营销推广产品的引流的效果,阿里妈妈的设计师先设计了两个版本的视觉方案同时上线,通过工具分流测试每个创意的点击率、转化率、跳出率,选出最优方案后继续通过 A/B 测试迭代优化,找出更好的创意方案。

近万字干货!B端产品增长设计通用模式(附超多案例)

4. 运营活动

利用人趋利的心理,运营活动和各种促销优惠是吸引用户屡试不爽的一个策略。 妥善运用不仅能影响用户的单次决策,还可以逐渐引导和改变用户习惯。电商的各种造节(双11、双12、 618)就是通过运营活动逐渐改变用户的购物习惯的典型案例。

常见的形式有满减优惠、满赠优惠、现金补贴、红包补贴、限时优惠、返利等等,不要以为这些「小恩小惠」只对 C 类用户有吸引力,B 类客户的老板们也很喜欢这种优惠和补贴哦~ 在蚂蚁链市场部举办的行业会议上,现场抽奖的奖品是几千到几万元的「代金券」(客户购买蚂蚁链服务时可抵扣),现场获奖的公司、银行的领导们都很开心。双十一也不只是淘宝天猫这些 C 类消费平台的节日,阿里云这样的 B 类技术平台一样有「五折」、「满减」活动。

近万字干货!B端产品增长设计通用模式(附超多案例)

行业案例:阿里巴巴的云技术业务阿里云,去年双 11 在云产品平台上展开了拼团购活动。玩法是这样的,用户通过开团建立熟人拉新关系群,被邀请者通过购买超低价折扣云产品获取参团资格,邀请者从中获取现金奖励及补贴返现,最终根据团内新用户数排名瓜分百万现金。此次拼团活动的一个特征是门槛较高,参团用户需购买 5 折云产品才可参团,这一限制将大量羊毛党拒之门外。除了新用户可享受的商品折扣外,额外增加了拉新后折上折返现、拉新现金红包奖励以及拉新现金返利。零头小利很难吸引 B 类云产品用户群为之付出成本参与任务,但综合收益可以满足用户预期。

近万字干货!B端产品增长设计通用模式(附超多案例)

5. 消息推送

消息推送是一种实时、精准、有效的提醒方式,形式包括 APP 的消息 push、邮件、短信等。 它的主要功能是用来激活用户,提升用户活跃度和留存率。 消息推送的核心指标主要为消息的到达率、点击率、转化率,可以通过测试和数据分析,建立起质量评估体系。下图为阿里云的推送邮件「您有一份创业助力金礼包待领取,免费领取!」:

近万字干货!B端产品增长设计通用模式(附超多案例)

6. 游戏化机制

「游戏化」就是在非游戏情境中,使用游戏的设计思想和机制。游戏化的最终目标不仅仅是为了让用户觉得好玩,它是一种桥梁和手段,用游戏元素和游戏式的设定创造出乐趣和粘性,从而驱动和引导受众,让商业目的更容易、更快速的实现。常用的游戏化元素包括等级、点数、徽章、排行榜、虚拟形象、通关解锁等等,如下图钉钉的捐步数排行榜。

近万字干货!B端产品增长设计通用模式(附超多案例)

行业案例:千牛作为淘系商家的一站式工作台,是双十一商家移动端的主阵地,提供了丰富的活动报名、规则解读、资讯直播等功能。但对于那些无法参加大促的中小卖家而言,这些功能无法吸引他们。针对这个问题,去年双十一,千牛首次尝试了互动玩法,并通过节日氛围的营造,向商家传播快乐双十一,提高非会场商家的参与感。在游戏的角色和内容设计上,将多角色子账号的创建和千牛品牌形象进行融合,加强商家对千牛多角色帐号的学习和了解,提升品牌及形象的认知度。此次互动游戏有大量商家积极参与,人均互动次数、互动率、首次尝试三项核心数据,均达到了预期效果。

近万字干货!B端产品增长设计通用模式(附超多案例)

7. 社区氛围运营

营造良好的社区氛围有利于用户之间建立良好友善的氛围。产品早期的社区氛围可以通过团队自身的运营来带动。

行业案例:语雀是蚂蚁集团内部孵化出的在线文档编辑与办公协同工具,同时面向 B 类企业客户和 C 类个人用户。为了营造知识传播分享的学习氛围,突破工具产品的定位局限,运营团队打造了「发现」板块,主要面向互联网行业的年轻从业者,并通过前端大牛的入驻吸引了很多同行业的用户来编写技术文档、分享技术文章。

近万字干货!B端产品增长设计通用模式(附超多案例)

Referral:传播策略

1. 广告传播

广告包括线上和线下传播,线下大至户外广告牌、地铁广告,小至易拉宝、传单、杂志广告等,线上形式就比较丰富,各种渠道的广告投放、H5营销、新媒体营销等。线下广告因为难以监测影响效果和转化率,现在多为线上线下联动。

行业案例 1:之前钉钉「开工节」的线下广告因为社畜气息太浓重而饱受争议,虽然引起了上班族们的不满,但话题热度也相当高。2020 年的广告与新版表情包和疫情期间在线办公/上学的场景结合,成功引起了大家的共鸣。

近万字干货!B端产品增长设计通用模式(附超多案例)

近万字干货!B端产品增长设计通用模式(附超多案例)

行业案例 2:Slack 在发现网站关键页面的流量增长放缓之后,考虑到这意味着新用户增长动力不足。面对这种状况,Slack在展示广告获客方面进行了新的尝试,就是在投放渠道方面,在Google Display Network 的投放逐渐减少,同时增加在 Carbon Ads 上的投放。Google Display Network 是非常宽泛的流量平台,主要靠量取胜,并没有特定的人群属性。但 Carbon Ads 的受众人群则全部是程序员和设计师。这说明,除了原本典型的开发者用户,Slack 试图吸引新的设计师用户群体。

近万字干货!B端产品增长设计通用模式(附超多案例)

2. 借势营销

借势营销通常是借助节日、事件等,为自己的产品助力,扩大品牌曝光和品牌认知。借势营销的大佬杜蕾斯当仁不让,常常会引起大众的讨论和传播。

行业案例:阿里巴巴「素材中心」是面向全集团的素材采购、分享平台,素材种类包含素材图片、视频、字体等。平台上线初期,为了低成本地提升素材量、打开知名度,项目组与集团负责公益的社会责任部、摄影兴趣派、负责版权的法务合作发起营销活动,号召集团员工上传自己的摄影作品作为免费素材,每分享的作品被成功下载一次,平台即为免费午餐公益活动捐一笔 0.1 元的款,分享者可以申报公益时。

因为公司一向重视公益,鼓励每个员工每年累计公益时,且公司内摄影爱好者的规模庞大,所以这次活动得到了集团公益团队的大力支持,不但为平台带来了几千张原创免费素材,更大大增加了平台的知名度和用户群(PV、UV 翻倍)。

近万字干货!B端产品增长设计通用模式(附超多案例)

3. 社交裂变

社交裂变传播,人人都是节点,传播的效果可以几何式倍增。裂变是目前市场上最有效的推广方法之一。裂变常见于微博、微信等社交平台,激发传播,带来水 波式的反馈效果。

行业案例 1:腾讯云的「十年筑梦,伴你同行」 H5 互动,回顾十年发展历程,展现品牌实力,邀请用户继续使用,吸引用户参与领取十周年礼包的活动。内容策划和交互方式上,在标题界面下滑屏幕,浏览十年历程总结,包括 2010 年技术沉淀,2013 年拥有姓名,2013 至 2017 拓展数据中心、云产品上线,2018 年深入行业发力技术升级、构建基础设施平台,2019 年在品牌合作等四个方面的「100万」成绩,2020 年科技向善,最后是总结语和邀请链接。

近万字干货!B端产品增长设计通用模式(附超多案例)

行业案例 2:2019 年底,为面向 B 类客户推广蚂蚁链,同时向普罗大众科普区块链的落地场景,负责蚂蚁链业务的设计小组与市场部同事合作,结合市场部举办的「蚂蚁区块链金融开放峰会」等行业活动推出 H5 互动,通过线下会议和线上公众号同时传播,鼓励大家通过微信、钉钉分享。

近万字干货!B端产品增长设计通用模式(附超多案例)

近万字干货!B端产品增长设计通用模式(附超多案例)

4. 邀请拉新

因为线上流量红利的枯竭、获客成本越来越高,邀请拉新因其低成本、率的特点,已经成为各大产品常用的拉新工具。对被邀请的新用户和邀请的老用户,活动通常对双方都提供奖励。设计上要注意淡化广告的特质,营造分享优惠、提供帮助的感觉。邀请拉新最经典的案例,就是 Dropbox 的拉人涨空间的活动,据说当年让这个网盘产品在短短 15 个月内,增长了 3900% 的注册用户。

近万字干货!B端产品增长设计通用模式(附超多案例)

这种拉新方式已经成为 C 端产品中的常见套路,在 B 类业务中比较少见,但对于形成社群的中小企业和微型企业的企业主来说,也可以尝试使用。

Revenue:变现策略

1. 收费模式

基础功能免费,增值功能付费:通过免费服务吸引客户,再通过提供增值服务,将一部分免费客户转化为付费客户。

行业案例:Teambition 虽然允许企业用户免费使用,但限制项目人数和项目数量(具体限制信息在官网上都无法直接找到),只要团队达到一定规模就必须转换为付费,而且是按每人每年的收费模式。

近万字干货!B端产品增长设计通用模式(附超多案例)

免费试用/限时优惠:免费试用通过「免费试用 30 天」、「限时免费公测」等方式吸引客户开始尝试使用,到期后如果已经产生粘性则有转化成付费客户的可能。限时优惠包括「首单优惠」、「首年优惠」等等。

近万字干货!B端产品增长设计通用模式(附超多案例)

行业案例:语雀商业化的第一年时,对企业和个人客户均采用首年优惠(企业空间正常价格 5999 元/年,优惠价 2999 元/年;个人空间正常 99 元/年,优惠价 69 元/年);第二年则对企业客户采用首单优惠方式,而个人客户不再有首年优惠。

近万字干货!B端产品增长设计通用模式(附超多案例)

专注服务付费客户:免费模式的基础是海量用户来分摊边际成本。这样即使转化率很低,在庞大总量的基础上也能得到不错的付费用户数;但是如果产品本身体量很小,免费用户带来的运营成本就会让企业难以负荷。

行业案例:Bidsketch(网站提案模板平台)发现随着免费用户量的攀升,付费用户比例缩 减到 1%,为了刺激用户付费,团队进行了一系列尝试:各种付费的优惠活动、15 天付费功能体验、消息推送等等,但是收效甚微…… 于是他们做了一个测试,从页面上删除了免费的选项,结果一周后,付费转化率提升了 8 倍。因此他们取消了免费账户的选项,专心向付费用户提供服务。目前 Bidsketc 的策略是:免费试用 14 天,然后就需要转为付费用户,付费有 solo\team\business 三种收费标准。

2. 用户细分

就像留存阶段那样,将用户分为群组,此时要重点关注每个群组带来的收益,可以根据用户的消费额、年龄性别地点、获客渠道、购买次数等等对用户分组。

行业案例:语雀作为从 2019 年起刚刚开始尝试商业化的办公类工具产品,用户增长是核心目标之一。考虑到阿里巴巴的电商基因,在商业化初期,语雀针对电商企业用户群进行针对性的增长实践。设计师通过用户调研和客户走访,首先验证了这个群体对于文档工具和知识库产品的需求;然后针对定量、定性调研结果,定制专门针对电商企业的文档模板、知识库模板、空间模板;接着设计了面向商家用户的落地页,并通过商家后台进行引流。最终效果显著,电商模板一度成为用户使用率最高的模板之一。

近万字干货!B端产品增长设计通用模式(附超多案例)

Acquisition:获客策略

1. 优秀的官网和落地页

我们不能强调各种各样特殊策略的过程中,忽略最「传统」、但往往也是最关键的官网、落地页本身的设计。优秀的官网和落地页要能快速而准确地向目标用户传达出产品的核心价值,并吸引他们马上开始注册和使用。

行业案例:设计平台 Canva 为用户提供了创建社交媒体图形、演示文稿、海报、文档等各种设计模板和工具,该公司的愿景是「无摩擦地帮助每个人创造出美丽的设计」,目标用户是「渴望用更好的方法来创造美丽的设计的人」。基于这样的愿景,它的官网和落地页为这些目标人群充分展示出了他们需要的东西。

近万字干货!B端产品增长设计通用模式(附超多案例)

Canva 的主页风格非常简洁,直观的展现了产品的信息,并没有过多的解释产品,而是引导用户快速注册和使用。为了鼓励产品的使用,在注册登录的入口下面展示了一系列最常用的设计模板类型:

近万字干货!B端产品增长设计通用模式(附超多案例)

页面上提供的关于产品的信息不多,只有「世界上最容易使用的设计工具」、「1000万人在Canva上设计」和「设计任何东西,在任何地方发布」这样有很强说服力的宣传语。如果想进一步了解产品,最好的方式是立即注册或登录,直接感受产品本身的魅力,也可以比较免费版、企业版、商用版的异同。

2. 筛选优质种子用户

这个步骤通常是在产品的冷启动阶段,也就是从0开始导入第一批用户和制造内容的过程。早期种子用户的质量会决定产品初期的氛围和走向,影响产品的发展和运营策略。筛选种子用户的前提是要确保产品达到 PMF 状态,也就是产品和市场匹配状态(Product/market fit)。

行业案例:strikingly(一款快速制作网站的在线工具)在上线之初,并没有大范围展开推广,而是专注于找到 100 个“超级粉丝”。为此 stikingly 寻访了公司周围所有的学校社团和创业公司,邀请他们使用自己的产品。创始人 David Chen 在 facebook上添加了 2000 多名用户,每天和他们聊天,听取他们的反馈,有时候还会邀请用户出来喝茶聊天。这些种子用户不但在产品初期贡献了很多宝贵意见,还主动把产品推荐给其他人,甚至解答新用户的提问和困扰。

近万字干货!B端产品增长设计通用模式(附超多案例)

3. 外接资源引流

外接资源引流就是利用其它产品或平台为自己的产品进行用户导流。C 端产品通常利用拥有大量用户的社交平台,通过引流促进用户的快速增长,比如拼多多利用微信的社交关系,通过亲朋好友低价拼团快速吸引了大量的早期用户。而 B 类产品的引流通常是同领域、或使用场景相关联的产品进行互通,拥有同类用户群的产品之间的彼此导流。

行业案例:文档工具腾讯文档与项目管理工具 Tower 彼此打通,即为彼此的用户带来使用上的方便,又可以增加产品曝光度、相互引流。

近万字干货!B端产品增长设计通用模式(附超多案例)

4. 举办比赛

举办与产品相关的比赛或征集活动,参赛者需要上传作品来获得评比的机会。这样不仅提高知名度、带来新用户,还能激励用户去了解产品、使用相关功能,提高激活和留存量。需要注意几点:

  • 参赛门槛高低要根据目标受众合理设置,比赛流程体验要顺畅;
  • 评审机制透明、具有一定权威性,奖品需要有足够吸引力来吸引参赛者;
  • 比赛本身也是一种营销活动,要通过有效的渠道触达目标受众。

近万字干货!B端产品增长设计通用模式(附超多案例)

行业案例:蚂蚁金融科技于 2019 年举办了「链创·未来」蚂蚁区块链创新大赛,一方面可以挖掘和助力区块链创业公司和团队,一方面可以推广蚂蚁链的 BaaS(Blockchain as a Service)产品。为期 9 个月的比赛累计收到 400 个报名参赛项目,参与人数近万;答疑群入群人数达到 2500 人,全国 60 多家媒体投放,媒体阅读量超 20 万+,同时举办了近十场线上培训以及多场线下活动,取得了一定推广宣传效果。

近万字干货!B端产品增长设计通用模式(附超多案例)

5. 搜索引擎和应用商店优化

网站利用搜索引擎的排序规则,采用 SEO(关键词优化、页面结构、文章标题、 内容长度、外链等等)和 SEM(竞价排名)的方法,影响搜索权重,提升网站曝光。 但是移动时代信息更加分散,相比其他获客方式,搜索引擎优化对于APP的获客转化效果不够直接有效了。

应用商店优化即 ASO,主要有 iOS 的 App Store 和安卓的应用宝、各大手机商的应用商店等,主要为应用标题、关键词、产品描述、缩略图和评论优化。

行业案例:Ant Deign 是蚂蚁体验技术部推出的开源设计体系,在业内有较高的影响力。为了推广 Ant Deign 的 Sketch 插件 Kitchen,设计团队的相关负责人通过搜索优化,使得搜索「Kitchen」、「Kitchen Sketch」等关键词的整体排名明显提升,通过百度、Google 搜索引擎渠道的访问量提升 40% 以上。

近万字干货!B端产品增长设计通用模式(附超多案例)

6. 地推

除了线上的宣传渠道之外,也会有线下的地面推广,常见的有发宣传单、路演、设置摊位做拉新活动等。地推要注意的是要根据产品定位,选择匹配的区域和用户人群。

行业案例:虽然不是设计师出身,但创业公司 Teambition 的 90 后帅哥老板齐俊元对于体验设计有着自己独到的见解和经验,他常年活跃在设计大会 IxDC中,会议期间除了演讲分享,还可以看到该公司的展台、宣传品。

近万字干货!B端产品增长设计通用模式(附超多案例)

结语

以上就是笔者收集的 B 类业务增长设计的方法和策略、行业典型案例,以及自己实践和见证的项目。欢迎交流切磋,更希望听听你的故事~~

B 类业务的增长设计实践,机会和挑战相对有限,且设计工作往往和产品设计、市场营销、运营推广工作交叉,需要设计师们擦亮眼睛、抓住机遇、敢于面对风险和质疑、勇于挑战。加油~~

文章来源:优设    作者:木木叶


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

设计师如何构建认知体系

资深UI设计者

文章来源:站酷    作者:兔子大吉


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

辞典精译 | 在UX中正确使用动画的终极指南

资深UI设计者

如今,很难用界面动画给人留下深刻的印象甚至惊喜。它显示了屏幕之间的交互,解释了如何使用该应用程序,或者只是引起用户的注意力。在浏览有关动画的文章时,我发现几乎所有的文章都只是描述了关于动画的特定的用例或一般事实,并没有遇到任何关于界面动画通用规则的文章。在本文中我收集了界面动画的主要原则和规则,以便给想要设计动画界面的设计人员提供一些帮助。


01 动画的持续时间和速度

当元素改变它们的状态或位置时,动画的持续时间应足够慢,以使用户可以注意到变化,但同时也要足够快,以免引起等待。

在动画中使用适当的持续时间,不要太快,更不要让用户过长等待


大量研究发现,界面动画的最佳速度在200-500毫秒之间。这些数据是基于人类大脑的特殊性得出的。任何小于100毫秒的动画都是瞬时的,根本不会被识别。而超过1秒的动画时长会传达延迟感,因此对用户来说很无聊。

最好在界面中保留动画的持续时间


在移动设备上,《材料设计指南》还建议将动画的持续时间限制在200-300毫秒之间。至于Web端,持续时间应延长30%,大约为400-450毫秒。原因在于:屏幕尺寸越大,物体在改变位置时可以克服的路径更长。因此,在可穿戴设备上,持续时间应缩短30%,大约为150-200ms,因为在较小的屏幕上,移动距离更短。

移动设备的大小会影响动画的持续时间


Web动画的处理方式有所不同,由于我们已经习惯了在浏览器中即时打开网页,所以我们希望也能在不同状态之间快速转换。因此,Web转换的持续时间应比移动设备短约2倍,150-200毫秒之间。在其他情况下,用户将不可避免地认为计算机死机或网络连接出现问题。


但是,如果你要在网站上创建装饰性动画或试图吸引用户对某些元素的关注,则无需考虑这些规则。在这些情况下,动画可以更长一些。

大屏幕电脑=慢动画?决不是!


需要记住的是,无论平台如何,动画的持续时间不仅取决于移动距离,还取决于对象的大小。更小的元素或带有小变化的的动画应该移动得更快。因此,大而复杂元素的动画在持续时间稍长的时候看起来更好。


在相同大小的移动物体中,停下来的是经过最短距离的物体。与大物体相比,小物体移动得更慢,因为它们的偏移量更大。

动画的持续时间取决于对象的大小和移动距离


当物体碰撞时,根据物理定律,碰撞的能量必须均匀分布在物体之间。因此,最好排除反弹效应,只在特殊情况下使用它才有意义。

避免使用弹跳效果,因为它会分散注意力


物体的运动应该是清晰和锐利的,所以不要使用运动模糊。即使在现代移动设备上也很难再现这种效果,并且根本不用于界面动画中。

不要在动画中使用模糊效果


列表项(新闻卡片、电子邮件列表等)在其出现之间应该有一个很短的延迟时间,每次出现的新元素应该持续20-25毫秒。元素出现较慢的话可能会惹恼用户。

列表项的动画应持续在20–25毫秒


02 缓和

缓和有助于使物体的运动更加自然,这是动画的基本原则之一。这一点在《迪士尼动画原则》(The Illusion of Life: Disney Animation)一书中得到了充分的描述,这本书是由两位重要的迪士尼动画师——奥利·约翰斯顿和弗兰克·托马斯所写。


为了使动画看起来不显得机械和人造,物体应以一定的加速或减速的方式移动,就像物理世界中的所有活动对象一样。

与线性动画相比,具有缓动效果的动画看起来更自然(这里提示下:注意看每段竖格的间距)


2/1 直线运动

不受任何物理力影响的物体直线运动,换句话说就是匀速运动。正因为如此,它们看起来非常不自然,对人眼来说是人为的。


所有动画应用程序都使用动画曲线,我将尝试解释如何阅读它们以及它们的含义。曲线显示了物体的位置( y axis=position )在相同的时间间隔内物体的位置如何变化(x axis=time)。在当前情况下,运动是线性的,因此物体在同一时间行进相同的距离。 

直线运动曲线


例如,直线运动只能在物体改变颜色或透明度时使用。一般来说,我们可以用它来表示物体不改变其位置的状态。


2/2 缓入或加速曲线

我们可以在曲线上看到,在开始时物体的位置变化缓慢,而速度则逐渐增加,这意味着物体正在以一定的加速度移动。

加速度曲线


当物体以全速飞出屏幕消失时,应使用此曲线,比如说系统通知或者是界面卡片。但请记住,只有当对象永远离开屏幕且我们无法调用或返回它们时,才应使用这种类型的曲线。

将卡片滑出屏幕的加速曲线


动画曲线有助于表达正确的情绪。在下面的示例中,我们可以看到所有物体的移动持续时间和距离是相同的,但是即使曲线上的微小变化也可以影响动画的气氛。当然,通过改变曲线,你可以使物体尽可能地接近于真实世界。

持续时间和距离相同,但却是不同的氛围


2/3 缓动或减速曲线

它与缓入曲线相反,因此物体会快速覆盖很长一段距离,然后缓慢的降低速度,直到最终停止。

减速曲线


当元素出现在屏幕上时应使用这种类型的曲线——它以全速向上飞入屏幕中,然后逐渐减速直到完全停止,这也可以应用于从屏幕外部出现的其他卡片或对象。

减速曲线,使动画更好地呈现


2/4 缓入缓出或标准曲线

该曲线使物体在开始时获得速度,然后慢慢地将速度降回零。这种类型的移动是界面动画中最常用的。当你犹豫在动画中使用哪种类型的运动时,可以使用标准曲线。

标准曲线


根据《材料设计指南》,最好使用非对称曲线,使移动看起来更加自然和真实。曲线的末端必须比它的开始更加突出,以使加速的持续时间短于减速的持续时间。在这种情况下,用户将更加关注元素的最终移动,从而关注元素的新状态。

查看对称和非对称标准曲线之间的区别


当对象从屏幕的一部分移至另一部分时,使用缓入缓出功能。在这种情况下,动画避免了引人注目的戏剧效果。

卡片在屏幕上的移动以及相应的不对称曲线


当元素从屏幕上消失时,应该使用相同的移动类型,但用户可以在任何时候将其返回到先前的位置。它涉及抽屉式导航等。

抽屉式导航从屏幕上隐藏了标准曲线


从这些例子中可以看出,许多初学者忽略了一个基本的规律——开始动画并不等于结束动画。与抽屉式导航一样,它以减速度曲线出现,而以标准曲线消失。另外,根据谷歌的材料设计语言,物体出现的时间应该更长,以吸引更多的关注。

侧面菜单的出现和消失,分别通过减速度和标准曲线实现


使用函数cubic-bezier()来描述曲线。之所以称为立方,是因为它基于四个点。在图上已经定义了具有坐标的第一个点0;0(左下)和具有坐标的最后一个点1;1(右上)。 


基于此,我们仅需描述图形上的两个点,这些点由函数的四个参数给出cubic-bezier():前两个是坐标x和y第一个点,后两个是坐标x和y第二个点。 


为了简化曲线的工作,建议使用easings.net和cubic-bezier.com网站。第一个包含最常用曲线的列表,你可以将其参数复制到原型工具中。第二个来源使你可以使用曲线的不同参数,并立即查看到物体将是如何移动的。

函数三次贝塞尔曲线的不同类型的曲线及其参数


03 界面动画中的编排

就像在芭蕾舞蹈设计中一样,主要思想是在从一种状态转换为另一种状态的过程中,引导用户注意一个流动的方向上。舞蹈编排有两种类型——平等交互和从属交互。


3/1 平等交互

平等交互意味着所有对象的外观都遵循一个特定的规则。在这种情况下,所有卡片的外观都被视为一种流程,可以引导用户的注意力集中在一个方向上,即从上到下。如果我们不按照顺序,那么用户的注意力将会分散。所有元素同时出现看起来也会很糟糕。

用户的注意力应引导在一个流动的方向上


对于表格视图,它有点复杂。在这里,用户的焦点应指向对角线,所以逐个地显示元素是一个很糟糕的主意。单个展示元素会使动画过长,并且用户的注意力会呈锯齿状,这是错误的。

卡片形式的对角线外观


3/2 从属交互

从属交互意味着我们要有一个吸引用户注意力的中心对象,而所有其他元素都从属于它。这种类型的动画给人一种有序的感觉,从而引起用户对主要内容的更多关注。


在其他情况下,用户将很难知道该关注哪个对象,因此他的注意力将被分散。所以,如果有多个要设置动画的元素,则需要明确它们的运动顺序,并尽可能将动画设置为最小的对象。

只有一个中心对象的动画很有必要,其余元素应是被引导的。否则,用户将不知道关注什么对象


根据材料设计语言,当移动的物体尺寸发生不均衡变化时,它们应沿着弧线而不是直线移动。这有助于使动作更自然。“不成比例”是指物体的高度和宽度的增加/减少是不对称的,即以不同的速度进行(例如,一个正方形的卡片变成了一个长方形)。

当移动的物体不按原有比例变化时,应沿着弧线运动


当物体按比例改变其大小时,使用沿直线的移动。由于这种移动的实现比较容易,因此通常会忽略不成比例的圆弧移动的规则。看看实际应用的例子,你会看到线性运动的主导地位。

尺寸的比例变化是沿着直线上运动的


曲线上的运动可以通过两种方式实现:第一种称为垂直向外——物体开始水平移动并以垂直移动结束;第二种是水平向外——物体开始垂直移动并以水平运动结束。


物体沿曲线的移动路径必须与滚动界面的主轴线重合。例如,在下一张图片上,我们可以上下滚动界面,相应的卡片以“垂直输出”的方式展开-首先从右到下,然后向下。反向移动以相反的方式进行-即卡片首先垂直上升,最后水平移动。

卡片的展开/折叠方向应与界面的轴线一致


如果移动物体的路径彼此相交,则它们将无法彼此移动。这些物体应通过减慢或加快自身的速度,为另一个物体的移动留下足够的空间。另一种选择-他们只是推开其他物体。为什么?因为我们假设界面中的所有物体都位于一个平面中。

在移动过程中,物体之间不应相互穿过,而应为另一个物体的移动留下空间


另一种情况,移动物体可以高于其他物体。但也不能通过其他物体消失或移动。为什么?因为我们相信界面元素的行为符合物理定律,现实世界中没有任何固体物体能够做到这一点。

物体可以超越其他物体,然后移动


结论

从以上总结的规则和原则能明白,UX界面动画是反映物理世界中存在的运动,如摩擦、加速等,模仿现实世界存在的行为。我们可以创建一个序列,让用户能够理解期望从界面得到什么。如果动画是正确构建的,那么它不会太引人注目,并且不会分散用户的目标,动画不应该影响用户使用或完成任务。


但是不要忘记动画更多的是一种艺术而不是科学,所以最好的方法是在用户身上试验和测试你的决定。


文章来源:站酷    作者:UX辞典


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

数据可视化 - 图表

资深UI设计者

图表是数据可视化的常用表现形式,是对数据的二次加工,可以帮助我们理解数据、洞悉数据背后的真相,让我们更好地适应这个数据驱动的世界。无论在工作汇报、产品设计、后台设计以及数据大屏中都能看到它的身影。然而,在实际工作中我发现很多初入行的设计师对于图表设计并不是很了解,同时市面上对于这方面的资料相对零散,不成体系。所以我结合了平时工作中的理解,梳理了这篇文章,希望能帮助到大家。


一、图表的组成


1. 图表的构成


当我们把图表的结构进行拆解后,就会发现一个图表是由很多个细小构件组成的,这些构件有自己的名字和用途,分别是标题、轴、图形、图例、标签、提示信息在平常使用的过程中,会根据场景去修饰删减一些构件元素,以此来减少冗余信息,用最适量的数据墨水比(Data-ink Ratio),帮助用户快速达成目标,在最少的时间内获取更多的信息。


  • 标题 - 描述图表的主题(包含主标题和副标题)

  • 标签 - 对当前这一组数据进行的内容标注

  • 轴 - 用来定义坐标系中数据在方向和值的映射关系

  • 图例 - 对图形本身的概括

  • 提示信息 - 当tap或者hover的时候,以交互提示信息的形式展示该点的数据详情

  • 图形 - 统计图表的视觉通道在形状上映射的视觉展现

接下来,我会一点一点地为大家讲解它们,方便大家合理的使用它们。但在此之前,我们先来了解一个知识点 - 数据墨水比,以便更好的理解接下来的内容。


2. 数据墨水比


数据墨水比——"data-ink ratio",是1983年视觉大师爱德华·塔夫特(Edward Tufte)在《The Visual Display of Quantitative Information》中提出的一个概念:一幅图表的绝大部分笔墨应该用于展示数据信息,数据变化则笔墨也变化。他将数据油墨比定义为图表中用于数据的墨水量除以总油墨量。其中数据墨水指的是图表中不可删除的核心内容。比如,我可以删除图例、删除坐标轴、删除网格线,这可能不会影响你从图表中读取相关的信息。但如果我删除柱形图、饼图这些图表的主体元素,那么图表就失去所要表达的内容了。


我个人更喜欢用“信噪比”= 信号/(信号+噪音) 这个概念去理解,因为通过可视化传达的信息不仅仅是数据,还有业务洞察,像观点、结论性的信息往往需要用文字来呈现的也是至关重要。不过无论使用哪个词,最终的目的都是突出传达“信息”部分,去除那些干扰的“噪音”。


因此,图表中的数据墨水占比越多,那么该图表的冗余信息就越少,信息传递效果就越好。所以,在创建图表和图形时,我们的目标应该是在合理范围内最大化数据墨水比


二、图表元素详解


1.标题


一个明确、相符的标题可以迅速让读者理解图表要表达的内容。通常图表的标题是根据图表所需要表达的内容决定的,大多数小伙伴可能认为命名没有太多问题。但当这个图表的结论是单一且唯一的时候,建议在概括图表内容的标题中加入结论性的信息点。这样能减少读者误解你的意图的可能,而且能够确保他们将注意力集中于你想着重强调的数据上 。


2. 轴(坐标轴)


2.1 定义


轴是能够使每个数组在维度空间内找到映射关系的定位系统,更偏向数学/物理概念。换句话说,轴的功能像是把可视化对象置于共同的基准上,再以标尺进行数值量测。在数据可视化中,一般存在于笛卡尔坐标系(直角坐标系)和极坐标系中。对轴进行「原子」要素的拆分,我们可以得到以下几种元素,分别为:轴线、轴刻度线、轴标签、轴标题(单位)以及网格线。


2.2 分类


根据对应变量是连续数据还是离散数据,轴可以分为:分类轴,时间轴,连续轴。


2.3 使用建议


2.3.1 轴线


轴线一般只考虑是否显示,结合上面所讲的数据墨水比,在有网格线的情况下,柱状图/折线图会隐藏 y 轴线,条形图则是隐藏 x 轴线,以达到信息降噪,突出视觉重点的目的。


2.3.2 轴刻度线


轴刻度线是轴线上的小线段, 可以提供数值标签在坐标轴上的明确位置。轴刻度线有3种类型,分别为:置内、置中(即交叉方式)、置外。但刻度应置于数值坐标轴外侧, 不建议刻度采用置中或置内方式显示。

轴刻度线的使用就是加强映射关系,快速的对应到数据点。分类轴较多出现在柱状、条形中,对于映射有天然的对应关系,故在分类轴中习惯隐藏轴上的刻度线。


2.3.3 网格线


网格线是用来辅助图表优化映射关系的。使用网格线可以增加数据的可阅读性,网格线提供了两种功能:一是延伸数值刻度至可视化对象中,以便观察数据值之大小;二是增加可视化对象之间的比较基础 ,利于比较。


网格线一般跟随值域轴的位置单向显示,柱状图采用水平网格,条形图采用垂直网格。在使用网格线时,应该注意遵从主次原则,以轴线为主,网格线为辅,样式上可采用实线或者虚线。避免颜色过重,不要使用纯黑或者纯白,在视觉层级上不能抢了图表中的信息



2.3.4 轴标题 



轴标题(单位)主要用于说明定义域轴、值域轴的数据含义。当可视化图表的其他部分内容(标题、图例、轴标签等)已经能充分表达数据含义,根据奥卡姆剃刀定律,可以略去轴标题,近一步增大数据油墨比,精简画面元素。


2.3.5 轴标签 


轴标签的设计较为复杂,涉及到的细节点比较多。这里将围绕直角坐标系的X轴和Y轴这两个方向进行讨论。


X轴标签


x 轴标签的设计重点在显示规则上,在可视化图表设计中,我们常常会碰到轴标签内容过长的情况,当空间有限时,轴标签会重叠在一起。如何处理此类问题,这里根据轴的不同类型给了对应的解决方案 。


A. 连续/时间轴标签


在连续轴和时间轴中,我们可以利用抽样显示的手段来优化轴标签重叠的问题。这里不推荐使用旋转来缩减宽度。一方面从美观度上,旋转可能会破坏界面整体协调。另一方面,连续/时间轴并不需要显示所有的轴标签,参考格式塔中的[连续性原理],尽管轴标签未能完全展示,但用户会在脑海中把缺失的部分补齐,轴标签仍然会像连续着的一样。


B. 分类轴标签


在分类轴中,由于标签与标签之间并没有紧密的逻辑关联关系。若采用抽样规则,隐藏了一些标签,则加大了用户对图表信息的提取难度,这是我们不想看到的。对于分类轴,这里建议通过标签旋转或转换成其他图表(条形图)来缩减宽度。


Y轴标签


y 轴标签的设计重点在标签数量、取值范围和数据格式上。标签显示区域一般根据最长标签宽度自适应缩放。如果数组是固定的,就写成固定宽度,节省图表计算量,提高渲染速度。


A. 轴标签的数量


轴标签的数量不建议过多,太多的标签必定导致横向网格线变多,造成元素冗余,干扰图形信息表达。根据 7±2 法则,Y轴标签数量应尽量控制在这个范围内。


B. 轴标签的取值范围


一般来说,y 轴标签的取值应从 0 基线开始,以恰当反映数值。展示被截断的数据可能会误导用户做出错误的判断。比如数据本身没有那么起伏变化,处理上下限的颗粒度,把刻度拉长,一样能显得“长势喜人”。

从上面就能明白,在看图表的时候千万不要被表面给欺骗,仅仅观看柱状图的高低趋势往往不能得出正确结论,需要注意坐标轴起始位置有没有被人做过虚假处理。


但存在是有根源的,对于此类的取值方式不做过多评价。这里主要想讲一下我常用的取值方式:对于Y轴的上限即最大值根据实际数据进行动态计算。比如一排数字中最大的为1190,那么轴标签最高位为1200;一排数字中最大的是1210,那么轴标签最高位为1400。其中的1400和2100是根据轴上的分段数决定的。

但有些人对Y轴标签的取值给出了如下建议:在折线图中,取值一般保证图形约占绘图区域的2/3,或者将柱状的高度控制在图表高度的85%左右。

但我认为这种方式太刻意了,并且规则定制的比较细。但是得承认这样子确认会显的好看,做案例可以,做真实数据不行。因为考虑到实际数据有的时候会出现极限情况,比如有些特别大有些特别小,为了保证用户能从图表中准确地获取信息,不应该为了美感而破坏了它的真实性。因此并不推荐用这种方式来取值。


C. 轴标签的数据格式

关于Y轴标签的数据格式,这里重点讲一些比较容易忽视的设计细节。第一,标签保留的小数位数保持统一,不要因为某些轴标签是整数值,就略去小数点。

第二,正负向的 y 轴标签,由于负值带“-”符号,整个 y 轴看起来会有视觉偏差,特别是双轴图的右 y 轴更明显。这里建议正负向 y 轴给正值标签带上“+”,以达到视觉平衡的效果。


3. 图例


3.1 定义


图例是对图形本身的概括,在图表元素中属于辅助内容。它提供读者以对照的方式来理解可视化对象的项目归类。由映射图形形状和文本组成。


3.2 类型


根据数据类型不同,分为连续型图例和分类型图例;根据状态不同,图例可以被设置为静态或可交互态。


3.3 使用建议


3.3.1 数字文本取整


正如,伦斯勒理工学院的行为经济学家高拉夫杰恩(Gaurav Jain)所说:“数字有一种语言的力量,能给予人一种特殊的感觉。当我们使用具体的整数数字时,人的衡量会减少。这种行为没有明显的原因。”


当人们的大脑在处理不以零结尾的不规则数字时,需要更多的脑力来处理,加大了获取信息的难度。因此在使用数字时,应该考虑这种偏好,倾向于一些取整的数字。同样的,这不仅仅适用于图例中的数字,同样适用于坐标轴上下限的数字。


3.3.2水平图例和垂直图例


带有连续性的倾向于使用水平图例,因为更符合人们的阅读习惯;带有分类属性的倾向于使用竖直图例,图例的右边可放置更长的文本。


3.3.3 图例的位置


默认把图例放在左上角去做一个通用的方案看起来没毛病。但考虑到人的视觉动线是从上至下,从左到右。这里有一个更好的做法:缩短用户对照图例看图形的本能路径,可以提升对信息的获取效率。如下图所示:


3.3.4 多折线图采用跟随图例


当我们在制作多折线图时,经常会出现个数据系列之间相互交错的情形,并使得各种数据标记与之前的出现顺序不一致,即与图例排列顺序不同。因此用户的眼睛必须在图例与折线之间进行连连看,最佳的做法是采用跟随图例形式,去标识出折线所属于的维值信息,这样会更直观有效。


4. 标签


4.1 定义


在图表中,标签是对当前的一组数据进行的内容标注。包括数据点、拉线、文本数值等元素,根据不同的图表类型选择使用。


4.2 使用建议


4.2.1 标签的显示策略


在绘制的图表的时候,我们倾向将标签直接打在图形外,但在「堆叠类」图表中,标签会显示在图形内。这样做会有个后果,标签的文本和图形经常需要交叠展示,所以可读性需要足够良好,所以通过对 HS 值的判断,决定文字的颜色是否需要反思。这样对比度就在可控范围内,不会出现可读性的问题。有时,还需要增加描边,让标签更清晰。

当数据特别多并且密的时候会造成全部标签挤在一起的情况。在标签重叠时,采用动态计算的抽样显示方式,自动隐藏其中一个,同时当 Hover 图表时,显示被隐藏的对应的数据。这样保证了图表的清晰度,也保证了信息的完整性。


5. 提示信息


5.1 定义


提示信息一般是tap或者hover的时候,图表以交互的方式吐出该位置的数据,帮助用户更深入的了解数据。一般由视觉标记图形,文本标签,数值标记这3中元素构成。


5.2 类型


提示信息的展现形式由4种。按不同的图表类型,分为悬浮、固定位置、固定在轴上、固定在图形上。


6. 图形


6.1 定义


人类从图形中获取信息的效率远高于文本,可以说如今人类早已进入了读图时代。图形是统计图表的视觉通道在形状上映射的视觉展现,是图表的必备元素,承载着数据背后蕴含的信息。按照组件原子化的思路来定义现在千奇百怪的图表,大致可以分为六种基础样式:折线,面积,散点,气泡,饼/环,柱形,条形。


6.2 使用建议


这里主要想重点讲一下,如何通过设计来强化图表信息的表达,以便简化用户获取信息的成本。关于具体某个图表的制作规范和运用场景,会在之后的文章中提及。

6.2.1  改变颜色 - 明暗/深浅/色彩对比


通过明暗对比、颜色对比以及色彩对比等手段可以有效的区分信息,在视觉层级上也是明显的处理了视觉噪音,便于用户区分信息。


6.2.2 添加标注


通过添加标注,人为去干预信息的表达,多用于一前一后的标识,便于用户识别信息。


三、选择合适的图表


我们做数据分析的有句话叫“一图胜千言”,图表是展现数据的一种重要展现形式,选对了图表就能帮助我们更加快速、直观的传达数据信息。


那如何挑选合适的图表呢?在我看来大致分为三步:

1. 确定核心内容:明确要用图表传达的核心信息;

2.判断比较关系:判断数据之间的比较类型(如占比、数量、趋势等);

3.选择图表类型:选择对应含义的图表(如饼图、柱状图、折线图等)。

很多朋友在判定和选择图表类型时会不知所措,但其实你只需要记住一句话:决定图表形式的不是数据,而是你要传达的信息。


1. 确定核心内容


同一组数据用不同的角度看,有不同的主题,比如下面这组数据:

从另一个角度看同样是5月份的数据,你还可能会将侧重点放在每个产品占销售额的百分比上。那你的图表主题应该是“5月份,产品 A 占公司产品总销售额的比例位居首位”。


综上所述,选择合适图表的关键,最初也是最重要的,就是明确要用图表传达的核心信息。


2. 判断比较关系


在实际工作中需要用图表反映数据的场景五花八门,但按数据关系分类无非以下几种情况,给大家简单举几个例子:

  • “预计在今后 10 年多的时间里,销售额将增长 ”对应的关系为时间趋势;

  • “雇员的最高工资额在 30000 到 35000 美元之间 ”对应的关系为频率分布;

  • “汽油并不是牌子越响价格越高其性能就越好”对应的关系为相关性;

  • “9 月份里,6 个区域的营业额大致相同”对应的关系为排名对比;

  • “销售部经理在他的领域内只花费了他 15% 的时间”对应的关系为占比。


3. 选择图表类型


国外专家Andrew Abela曾整理了一份图表类型选择指南图示,但其实结合我自己的经验,考虑到日常企业的数据分析场景,图中有些图表使用频率是非常低的。


所以我在此基础上结合自己多年的经验,总结出了常用商务图表的选择指南,总体我认为这是会更适合商务图表展示,而且会更接地气,适合大家参考使用。


四、常见的可视化图表


1. 折线图


1.1 定义


折线图是通过线条的波动(上升或下降)来显示连续数据随时间或有序类别变化的图表,常用于反映数据随着时间推移而产生的变化趋势。


2.2 适用场景


横轴为连续类别(如时间)且注重变化趋势、预测,适用于折线图。


举个例子:比如想看2020年上半年商品的营业额情况,并对走势做一个分析。由于每个月份的商品营业额相关的,它们代表一种数据在不同时间下的数据值,因此我们可以用折线图将它们连接起来。


但如果想看2020年上半年北京、上海、广州、深圳四个省份的营业额情况,由于每个省份的营业额是不相关的,所以我们不能随便用折线图来替代柱状图。


2.3 使用建议


2.3.1 使用合适的时间间隔,使锯齿状的线条平滑


如果折线图上下浮动过于剧烈,那么可以尝试拉长时间间隔,比如不每天采样而以周为单位来采样。用户不太原因去阅读锯齿状的线条,或者说他们不会喜欢这样的图表。


但是如果有强需求说是一定要在某个范围,这条略过。


2.3.2  善用数据点标记、特殊标记


当有些特定的数值特别重要时,我们可以在线条上标注出他们,但全部标清数据点在大多数情况下标记出来的意义不大,从视觉上来看会显得非常琐碎。


2.3.3 分清主次关系,加强数据感知


若对比数据较多,为了避免信息繁杂。可采用实线的强弱和色彩的对比来区分主次内容,让用户更关注在主折线,获取主数据的波动感知。


知识扩展:折线图与曲线图的区别


折线图:更关注于点的数据,相对短的一段时间数据随时间变化的趋势;

曲线图:更关注点构成的线点数据,一段时间内整体数据随时间变化的趋势。

曲线图是折线图中的一种,当图表数据点过于密集时,使用曲线图更能表达数据随时间变化的趋势、周期性。


2. 面积图


2.1 定义


面积图又叫区域图,是一种随有序变量的变化,反映数值变化的统计图表,原理与折线图相似。它在折线图的基础上多了一个面积概念,填充的区域可以表示“累积”的含义(当X轴为连续的数值时)。


2.2 适用场景


当注重随时间的趋势变化和累计的值时,适用于面积图。


例如:想要查看今年10月和去年10月每日的商品营业额走势,并对整月营业额进行比较,这时就可以采用面积图。但当自变量不是顺序性的变量,则不适合用面积图。


2.3 使用建议


2.3.1 使用透明填充色



透明度可以很好的帮助使用者观察不同序列之间的重叠关系,没有透明度的面积会导致不同序列之间相互遮盖减少可以被观察到的信息。


2.3.2 当X轴数据较少,考虑其他图表


当数据值相距很远时,区域是模糊不清的,此时不太适合使用面积图展示。


如下方示例虽然仔细分析能确定只展示了两个类别,乍一看,很可能会误以为图表上显示三种不同的颜色,但使用分组柱状图就可以很好解决这个问题。



2.3.3 不要超过4个数据系列


面积图只适合展现少量的数据,最多建议不要超过四个类别,否则就会导致非常难以识别。因此在多个类别下,要尽量避免使用面积图,采用相似图表来表示,比如折线图。


3.堆叠面积图


3.1 定义


堆叠面积图与面积图类似,都是在折线图的基础上,将折线与自变量坐标轴之间区域填充起来的统计图表。


唯一的区别是堆叠面积图有多个数据系列,它们一层层的堆叠起来,每个数据系列的起始点是上一个数据系列的结束点。


3.2 适用场景



适用于观察多变量随时间的变化情况,且既能看到整体趋势又能看到各变量的构成情况。


3.3 使用建议


3.3.1 尽量不要对Y轴进行裁切


为了保证数据传递的准确性,在适用堆叠面积图时,尽量不要对Y轴进行裁剪。


3.3.2 不要超过7个数据系列


当数据系列过多时,往往造成难以观察,所以建议使用堆叠面积图时数据系列最好不要超过7个。


3.3.3 变化量大的数据置于上方


建议堆叠面积图中把变化量较大的数据放在上方,变化量较小的数据放在下方会获得更加的展示效果。

3.3.4 不适合带有负值的数据系列


堆积面积图要展示部分和整体之间的关系,所以不能用于包含负值的数据的展示。


4.柱状图


4.1 定义


柱状图,是一种使用矩形条,对不同类别进行数值比较的统计图表。使用垂直或水平的柱子的长短对比数值大小,其中一个轴表示需要对比的分类维度;另一个轴代表相应的数值。


在柱状图上,分类变量的每个实体都被表示为一个矩形(通俗讲即为“柱子”),而数值则决定了柱子的高度。纵向柱状图的柱是垂直方向的,如图:

undefined

横向柱状图的柱是水平方向的,又称条形图,如图:


4.2 适用场景


柱状图最适合对分类的数据进行比较,尤其是当数值比较接近时,由于人眼对于高度的感知优于其他视觉元素(如面积、角度等),因此使用柱状图更加合适。


如下图所示,5组数据的数值很接近,若采用饼图,这无法直观的进行比较,右边的柱状图则能更好地传递图表信息。


4.3 使用建议


4.3.1 使用合适的宽度去适配柱条的宽度



当柱子太窄时,用户的视觉可能会集中在两个柱中间的负空间,而这里是不承载任何数据的。宽度推荐使用在1/2 柱宽到 1 柱宽之间,但也要视情况而定。


4.3.2 不推荐采用全圆角


保证柱形图有的圆角,以确保柱形顶部测量柱形的长度;全圆角则有可能歪曲可视化图表的表达。


4.3.3 避免适用过多的颜色


柱形图一般比较一组分类数据,柱子的高低已经传递了相关信息,不必通过颜色来区分,所以建议使用相同的颜色或同一颜色的不同色调,过多的颜色会增加理解成本。


如果需要强调某个数据时,可以使用对比色或者变化色调来突出显示有意义的数据点。


4.3.4 采用有序排列,轴标签右对齐


对多个数据系列排序时,如果不涉及到日期等特定数据,最好能符合一定的逻辑用直观的方式引导用户更好的查看数据。


可以通过升序或降序排布,例如按照数量从多到少来对数据进行排序,也可以按照字母顺序等来排布。总之,按照逻辑排序可以一定程度上引导人们更好地阅读数据。


4.3.5 标签直接显示在柱体上


条形图还可以通过省略横轴和纵轴,并直接在柱子上表明数值,来降低数据墨水比,进一步提高信息的获取效率。


5.堆叠柱状图


5.1 定义


堆叠柱状图(Stacked Column Chart),又称堆叠柱形图,是一种用来分解整体、比较各部分的图表。


它是柱状图的扩展,不同的是,柱状图的数据值为并行排列,堆叠柱图则是一个个叠加起来的。它可以展示每一个分类的总量,以及该分类包含的每个小分类的大小及占比,并且这些子类别一般用不同的颜色来指代。


5.2 适用场景


对比不同类别数据的数值大小,同时对比每一类别数据中,子类别的构成及大小。


例如下图显示的是每种化妆品在各个产品的销售情况,通过堆叠柱状图,我们可以很清晰低对比同一种化妆品到底在哪个城市销量更好。


5.3 使用建议


5.3.1 纵向堆叠柱状图 – 最多不要超过6个数据



堆叠柱状图最好的展示效果是每个组只包含两到三个类别,最多不要超过6个,因为太多的数据系列会很容易让人眼花缭乱, 如下图:


5.3.2 数值标签居中对齐


堆叠条状图的数值建议在图形之间,居中对齐,在图形左侧容易产生误解。


5.3.3 避免用堆叠柱状图展示包含负数的数据


由于要分析部分数据在整体中的占比,避免用堆叠柱状图展示包含负数的数据。因为柱子的高度必须为正数,有负数则无法直观显示在图上。


5.3.4 数据标签特别长时,采用水平堆叠柱状图


大多数的堆叠柱状图都是垂直绘制的,但是如果你的数据标签特别长时,考虑更好地展示效果,可以选择使用水平堆叠的方式。


6. 分组柱状图


6.1 定义


分组柱状图,又叫聚集柱状图。跟柱状图类似,使用柱子的长短来映射和对比数据值。每个分组中的柱子使用不同的颜色或者相同颜色不同透明的方式区别各个分类,各个分组之间需要保持间隔。


6.2 适用场景


对比不同分组内相同分类的大小,对比相同分组内不同分类的大小。其中,分组个数不要超过 12 个,每个分组下的分类不要超过 6 个。


6.3 使用建议



6.3.1 数据的数值差异大,建议使用双轴


分组柱状图适合比较多组数值差异不大的数据,比如,对于要同时查看一个数值和百分比的时间趋势,双轴图就派上大用场了。


为了浏览起来更直观,建议用柱图来表示数值类数据,用线图来表示百分比。


6.3.2 组之间的间距 > 柱子之间的间距


分组柱状图强调组的概念,组是一个个重复单元。按照格式塔原理,每两个分组之间的间距要大于组内不同系列之间的间距,以免造成视觉上错误的归类和区分。


7. 双向柱状图


7.1 定义


双向柱状图是使用正向和反向的柱子显示类别之间的数值比较,其中分类轴表示需要对比的分类维度,连续轴代表相应的数值,分为两种情况,一种是正向刻度值与反向刻度值完全对称;另一种是正向刻度值与反向刻度值反向对称,即互为相反数。


同样的,可分为垂直方和水平两个方向,其中水平双向柱状图又叫正负条形图。


7.2 适用场景


双向柱状图一般用于正负两份相反数据的对比,例如一周内个人收入和支出的统计,其中收入为正数,支出为负数。


使用双向柱状图可以很明确的对收入和支出做出对比,并能从单个系列中分析收入和支出的数值及波动。

undefined


7.3 使用建议


7.3.1 不适合不含相反含义的数据


双向柱状图多用于展示含相反含义的数据,因此要避免不具有正负含义的数据使用而造成的误解。


如下图人口统计图表中使用双向柱状图一边绘制男性一边绘制女性,只是单纯的两类不同数据的对比,并不存在负数。这种情况将两个数据序列绘制成一个分组柱状图是更合适的。


7.3.2 采用色彩差异较大的颜色


向柱状图正向和负向的数据具有对比性,因此一般选用差值较大的具有对比性的颜色,保证的获取有效的信息。


8. 饼图


8.1 定义


饼图,或称饼状图,是一个划分为几个扇形的圆形统计图表。在饼图中,每个扇形的弧长(以及圆心角和面积)大小,表示该种类占总体的比例,且这些扇形合在一起刚好是一个完全的圆形。


8.2 适用场景


饼图主要用于展现不同类别数值相对于总数的占比情况,尤其是想要突出表示某个部分在整体中所占比例,且该部分所占比例达到总体的25%或50%时,很适合用饼图。


8.3 使用建议


8.3.1 分块数量尽量控制在5个以内,最多不要超过9个


饼图不适用于多分类的数据,因为随着分类的增多,每个切片的面积变小,视觉区分度随之降低。


当数据类别较多时,我们可以把较小或不重要的数据合并成第五个模块命名为”其它”。如果一定要保证数据的完整性和准确性,此时选择柱状图或堆积柱状图或许更合适。


8.3.2 切片大小相似时,建议采用柱状图或南丁格尔玫瑰图


由于人类对“角度”的感知力并不如“长度”,在需要准确的表达数值(尤其是当数值接近、或数值很多)时,饼图常常不能胜任,因此当各类别数据占比较接近时(如下左图),我们很难对比出每个类别占比的大小。


此时建议选用柱状图或南丁格尔玫瑰图(如下右图)来获取更好的展示效果。


8.3.3 正确放置切片位置,提高图表可读性


大多数人视觉习惯是按照顺时针和自上而下的顺序去观察。因此在绘制饼图时,建议从12点钟开始沿顺时针右边第一个分块绘制饼图最大的数据分块,有效的强调其重要性。


其余的数据分块有两种建议:一种是按照数据大小依次顺时针排列;另一种在12点钟的左边绘制第二大的分块,其余的分块按照逆时针排列,最小的分块放在底部。


让用户的视线焦点集中在上半部分,增强获取信息的速度。


9. 环形图


9.1 定义


环形图,又叫做甜甜圈图,是由两个及两个以上大小不一的饼图叠在一起,挖去中间的部分所构成的图形。


9.2 适用场景


适用于展示分类的占比情况,与饼图用法相似,但环图相对于饼图空间的利用率更高,比如我们可以使用它的空心区域显示文本信息,比如标题等。

undefined


9.3 使用建议


9.3.1 不适用于分类过多的场景


关于环图不适用分类过多的场景,否则阅读会将很差(如下图)。


可行的办法:一是将一些不重要的变量合并为“其他”,避免扇区超过5个;二是改用条形图或者表格。尤其是,如果你想让读者清楚的阅读到每一条数据,选用表格会更加直截了当。


9.3.2 不适用于分类占比差别不明显的场景


下图中游戏公司的不同种类的游戏的销售量相近,所以不太适合使用环图,此时可以使用柱状图。


10. 南丁格尔玫瑰图


10.1 定义


南丁格尔玫瑰图又名鸡冠花图、极坐标区域图,尽管外形很像饼图,但它是用半径来反映数值大小的(而饼图是以扇形的弧度来表示数据的)。


10.2 适用场景


对比不同分类的大小,且各分类值差异不是太大时。由于半径和面积之间是平方的关系,视觉上,南丁格尔玫瑰图会将数据的比例夸大。


10.3 使用建议


10.3.1 分类过少的场景,直接用饼图或者环图来表示


如下图展示一个班级男女同学的个数,这种场景下,使用饼图或者环形图比用南丁格尔玫瑰图更合适。


10.3.2 希望的比较数值大小时,推荐使用柱状图


南丁格尔玫瑰图是将数值映射到半径上,而扇形的面积和半径是平方关系,因此视觉上看,数值的差异会被扩大。

因此,当数值差异较大、或者希望的比较数值大小时,推荐使用柱状图。


下面使用南丁格尔玫瑰图展示各个省份的人口数据,这种场景下使用玫瑰图不合适,原因是在玫瑰图中数值过小的分类会非常难以观察,推荐使用条形图(横向柱状图)。


11. 散点图


11.1 定义


散点图,又名点图、散布图、X-Y图,它是将所有的数据以点的形式展现在平面直角坐标系上的统计图表。它至少需要两个不同变量,一个沿x轴绘制,另一个沿y轴绘制,每个点在X、Y轴上都有一个确定的位置。


11.2 适用场景


散点图适用于分析变量之间是否存在某种关系或相关性。其中,相关性包含正相关(两个变量值同时增加)、负相关(一个变量值增加另一个变量值下降)、不相关、线性相关、指数相关、U形相关等。


11.3 使用建议


11.3.1 尽量为散点图添加趋势线


在观察两个变量之间的关系时,趋势线是非常有用的,趋势线的形状走向解释了两个变量之间的关系类型,还可以用来预测未来的值。但需要注意的是趋势线最可只能使用两条,以免干扰正常的数据的阅读。


11.3.2 数据量过少时,不推荐使用散点图


散点图只有有足够多的数据点,并且数据之间有相关性时才能呈现很好的结果。如果一份数据只有极少的信息或者数据间没有相关性,那么绘制一个很空的散点图和不相关的散点图都是没有意义的。


11.3.3 用颜色、形状来区分不同的数据类别


如果数据包含不同系列,可以给不同系列使用不同的颜色,例如蓝色代表男性,红色代表女性,并增加图例标注出蓝色代表的含义。


帮助用户快速获取相关信息。但要注意,要避免数据分类过多的情况,过多的数据分类,会导致无法快速识别,失去可视化的意义和价值。


12. 气泡图


12.1 定义


气泡图是显示变量之间相关性的一种图表,由笛卡尔坐标系(直角坐标系)和大小不一的圆组成,可以看作是散点图的变形。


与散点图不同的是,气泡图是一个多变量图,它增加了第三个数值即气泡大小的变量,在气泡图中,较大的气泡表示较大的值。可以通过气泡的位置分布和大小比例,来分析数据的规律。


12.2 适用场景


一般而言,气泡图需要3个变量,其中2个决定了气泡在笛卡尔坐标系中的位置(即x,y轴上的值),另外一个则通过气泡的大小来表示。


当然,气泡图也可以容纳更多维的数据,例如用第4个变量决定气泡的颜色、透明度等。


特殊地,气泡图也可以用于二维数据,即y轴和气泡大小使用同一维度的数据(y轴和气泡大小的双视觉编码)。


这种情况下,相比于柱状图它能达到更美观的目的。例如,下图表示了2014年每个季度的销售额。x轴代表时间,y轴和气泡大小代表了销售业绩。


12.3 使用建议



12.3.1 气泡的大小应体现为面积,而非半径


绘制气泡图时,需注意气泡的大小是映射到面积而不是半径或者直径绘制的。


以下图为例,如果两个数值是1:2的关系,如果按照半径1:2来绘制,那么实际的圆面积,将会是1:4的比例,这就夸大了数据之间的差异。


13. 雷达图


13.1 定义


雷达又叫戴布拉图、蜘蛛网图。它是一种显示多变量数据的图形方法。通常从同一中心点开始等角度间隔地射出三个以上的轴,每个轴代表一个定量变量,各轴上的点依次连接成线或几何图形。


每个变量都有一个从中心向外发射的轴线,所有的轴之间的夹角相等,同时每个轴有相同的刻度,将轴到轴的刻度用网格线链接作为辅助元素,连接每个变量在其各自的轴线的数据点成一条多边形。


13.2 适用场景


雷达图对于查看哪些变量具有相似的值、变量之间是否有异常值都很有用。雷达图表也可用于查看哪些变量在数据集内得分较高或较低,因此非常适合显示性能(见下图)。


同样,雷达图也常用于排名、评估、评论等数据的展示。


13.3 使用建议


13.3.1 多边形数量控制在五个左右


一个雷达图包含的多边形数量是有限的,如果有五个以上要评估的事物,无论是轮廓还是填充区域,都会产生覆盖和混乱,使得数据难以阅读。


13.3.2 控制变量的数量


如果变量过多,也会造成可读性下降,因为一个变量对应一个坐标轴,这样会使坐标轴过于密集,使图表给人感觉很复杂,所以最佳实践就是尽可能控制变量的数量使雷达图保持简单清晰。


14. 漏斗图



14.1 定义


漏斗图,形如“漏斗”,在开始和结束之间由N个流程环节组成。


漏斗图总是起始于100%的数量,并在各个环节依次减少,每个环节用一个梯形来表示,整体形如漏斗。与饼图一样,漏斗图呈现的也不是具体的数据,而是该数据相对于总数的占比、漏斗图不需要使用任何数据轴。


14.2 适用场景


漏斗图适用于业务流程比较规范、周期长、环节多的单流程单向分析,通过漏斗各环节业务数据的比较能够直观地发现和说明问题所在的环节,进而做出决策。


其中,数据是要有序的,彼此之间有逻辑上的顺序关系,阶段最好大于3个。


14.3 使用建议


14.3.1 数据要逻辑上的顺序关系


漏斗图不适合没有逻辑关系的数据,换句话说,如果数据不构成“流程”,那么不能使用漏斗图。例如,想要展示不同游戏类型的销量对比,用漏斗图就是不合适的。


14.3.2 梯形的高度、面积都是有意义的,不应想当然的篡改


漏斗图作为一种统计图表,漏斗图的“长相”,本质上是由数据决定的。在传达数据时,漏斗图是通过“面积”表示的,对于人眼来说,面积的识别本来就不太容易。


如果我们在制作漏斗图时,再人为的改变漏斗中每一个梯形的高度,那么识别起来就十分困难。以下图为例,抹掉数字后,你几乎不可能知道第一层是第二层的三倍。


五、后记


以上就是本篇文章的全部内容,关于可视化相关的知识还有很多没有涉及到,例如可视化图表的配色、商务仪表盘、以及其他的图表运用场景等等都还未讲到。以后有时间慢慢整理分享给大家,谢谢阅读!


文章来源:站酷    作者:Hi_Nick


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

工具型产品可用性测试怎么做?

资深UI设计者

本文将针对酷家乐旗下云端建模工具——酷大师所做的可用性测试,说明工具型产品如何去做可用性测试。

打造一款产品的过程中,我们需要时刻保持警惕:功能是否满足用户核心需求?交互流程能否做到简单流畅?是否还有未知领域可以由用户带来启发?进行一次准备充分的可用性测试,无疑是解答上述问题快捷有效的方式。

下面我将结合本次针对酷家乐旗下云端建模工具——酷大师所做的可用性测试,说明工具型产品如何去做可用性测试。

准备阶段

第一步:明确测试目的

测试目的不同,安排的测试任务就不同,进而就会影响最终得到的结果。所以测试之初需要考虑清楚测试目的。国际标准化组织在人体工程学设计的人机交互部分( ISO9241) 把b2可用性c 规定为 3 个指标:

  • 有效性:用户使用该系统完成任务的精度和完整性;
  • 效率:用户使用该系统完成任务需要耗费的资源;
  • 用户满意度:用户对该系统的舒适度和认可接受程度。

工具型产品可用性测试怎么做?来看酷家乐的实战经验!

结合这3个指标,我将本次测试目的设定为:

  • 了解用户对酷大师现有主流程的使用现状;
  • 了解用户对酷大师的体验满意度及需求满足情况。

第二步:确定测试时间和环境

测试时间:

  • 测试准备时间:建议为期2天。准备相关文档、设备、场地、任务等。
  • 用户测试时间:建议为期3-5天。可短时间内容集中进行用户测试,或在工作日穿插进行测试。
  • 结果整理时间:建议为期5天。用于整理测试信息、落实产品迭代任务、撰写总结报告等。

测试环境:

  • 线下环境:邀约用户到公司办公室现场测试;
  • 线上环境:考虑到用户路程及时间等限制性因素,也可在线上进行测试。
第三步:安排测试设备
  • 操作设备:取决于目标用户群体主要使用的设备,假如用户都使用ipad,就要将ipad列为主要操作设备。
  • 录音设备:测试结束后需要进行详细的信息整理,录音资料可以帮助回忆沟通内容。可使用手机自带录音功能或专业录音笔。录音前必须告知用户,在征得许可后方能进行录音。
  • 录屏设备:工具型产品的操作过程中涉及很多细节,录屏资料可以帮助工作人员进行问题定位。可使用电脑自带录屏功能,或录屏工具。
  • 远程设备:由于部分用户需在线上测试,可使用在线工具进行远程协作,比如:zoom、腾讯会议等。
  • 记录本和笔:测试过程中进行表格填写时需要使用。
  • 文档资料:主要包括测试过程中需要填写的表格。建议打印n+2套,n是测试样本数量,另外2套备用。
  • 场地准备:提前预约会议室,给用户独立的操作环境。
  • 测试酬劳:具体可根据公司政策进行准备。
第四步.邀约测试样本

Nielsen在理论中认为5-8位用户可以测试出85%的可用性问题,实践下来确实如此,样本数量建议控制在这个范围。

工具型产品可用性测试怎么做?来看酷家乐的实战经验!

在同一个产品的用户中,新手用户、永久的的中间用户、专家用户这三类角色通常是共存的。我们需要让新手用户快速和无痛苦地成为中间用户;避免为那些想成为专家的用户设置障碍;最为重要的是,让永久的中间用户感到愉快,因为他们的技能将稳定地处于中间层。

本次测试中,我尽量使样本中包含这3类用户,比例为2:3:3。测试之后,就可以大概知道对于不同类型用户来说,产品可用性和

易用性情况,也可以得到多维度差异化的反馈。

第五步:设计测试文档

测试中需要使用一些管理用户信息或记录用户反馈的表格,在准备阶段就要做好表格设计和打印工作。下面是具体的表格,可根据具体需求做相应调整。

《用户信息&排期表》

工具型产品可用性测试怎么做?来看酷家乐的实战经验!

在这张表中管理测试用户信息b2姓名、职业c 、测试安排「时间、地点」、测试工作人员「主持人、观察员」。一场测试尽量安排一位主持人和一位观察员作为工作人员相互配合。

主持人负责与用户沟通互动,推进测试进程;观察员负责设备和资料保障,以及测试过程中的行为观察和记录。一个人独自承担主持人+观察员角色的话,在用户反馈密集而现场又出现临时状况时就会手忙脚乱,所以建议两个角色分工协作。

《用户基本信息问卷》

工具型产品可用性测试怎么做?来看酷家乐的实战经验!

在这张问卷中可以设计与产品相关的用户基本信息问题,问卷设计原则为:

  • 关联性:与需要测试的内容相关;
  • 层级性:问题层级依次递进,使用户回答问题时能够思维连贯,由浅入深;
  • 隐私性:尽量避免涉及用户敏感信息,必须涉及时需解释原因,尊重用户意愿。比如有些用户不愿透露年龄、收入等信息。

这张问卷使用在线工具呈现,比如腾讯问卷;也可现场打印纸质问卷进行询问填写。大多数用户比较喜欢现场填写。

《单任务满意度问卷》

工具型产品可用性测试怎么做?来看酷家乐的实战经验!

测试过程中,我们需要让用户完成一个完整任务,该任务需要拆解成若干单任务。在每个单任务结束后,立刻对用户进行该单任务的满意度询问。

《SUS系统可用性量表》

工具型产品可用性测试怎么做?来看酷家乐的实战经验!

用户结束完整任务后,填写该量表。该量表由10个题目组成,包括奇数项的正面陈述和偶数项的反面陈述。在结果整理阶段,我们再对该量表进行分值计算。

第六步:规划测试脚本

从开始到结束,需要主持人将整场测试的各个环节串联起来,引导用户操作,推动测试进程向前发展。为防止意外状况出现,可以预设测试脚本,规划情境和话术,并在预测试环节验证及优化该话术。

比如可以这样开场:“首先非常感谢您今天能来参加我们的可用性测试,我是主持人XXX,这位是观察员XXX。我们这次是对酷大师建模工具进行可用性测试,想了解您使用时的体验和感受。

在这里需要强调的是:我们测试的对象是工具,而不是您,所以您不必感到紧张……当您使用工具时,我们会观察和记录。今天的测试大概需要一个小时,测试过程中会有休息时间。测试过程中,请您将手机保持静音状态……“

比如可以这样进行两个单任务环节串场:“好的,我们已经完成了第一个单任务。现在有一份简单的问卷,填完后可以稍微休息一下。

「出示问卷,并作简要填写说明」「问卷完成后进行简单访谈,用户也稍稍休息后继续」现在,我们开始进行第二个单任务「要清晰且大声地说出这句话,以“鼓励”测试参加者和提示记录人员」……”

具体话术依据需要测试的内容和情境展开,尽量做到专业、友好。

第七步:设计测试任务

可用性测试往往带有一定目的性,而这些目的能不能达成,取决于任务与目的的关联性以及用户是否能够给到对应反馈。通常,测试用户是愿意给予反馈的,那么测试任务的设计就成为整个准备阶段最重要的环节。

做好测试任务的设计和拆解:需要具备从全局高度理解产品的能力;需要知道产品全链路的过去起源、现状细节、未来走向;需要把控重点,拎出骨架;需要去繁就简,以较少的任务成本测出最有价值的信息。

本次测试中,我设计的主流程是:模型创建——材质铺贴——模型渲染——模型发布——模型分享,并且我还希望测到拉伸、阵列、组编辑、移动、旋转这样的主功能。所以我将这两块有机结合,给到用户创建一个「楼梯踏步模型」的任务。

我将任务按照主流程拆解为5个单任务,主功能分布到其中几个单任务中,且尽量做到两个单任务中不重复使用同一个主功能。

工具型产品可用性测试怎么做?来看酷家乐的实战经验!

预测试阶段

大多数产品都存在一些限制因素导致的尚未解决的已知问题。这些问题在测试中出现的话,会转移用户注意力,削弱本次测试的价值,偏移本次测试的目的。

另外,我们准备阶段进行的种种规划也需要得到验证。结合这两个原因,正式测试之前建议进行内部的用户预测试。找出并修复测试环节中的漏洞,准备好各类突发状况下的planB,以及修复影响正式测试的已知问题,提高正式测试的执行效率。

正式测试阶段

第一步.测试开场,填写《用户基本信息问卷》

本次测试是在工作日穿插进行8场一对一用户测试。这样可以放缓测试节奏,在两场测试间隙有充足时间简单整理上一场收集的信息,与下一场用户确认测试安排,以及对突发状况及时处理。

正式开始前半小时,观察员需确认设备都已调试妥当,资料都已打印完成。主持人可与用户进行联系,带领用户进入测试场所。主持人可以通过填写《用户基本信息问卷》了解用户基本信息,帮助用户消除在陌生环境下的沟通障碍。也可以使用户以放松状态完成测试任务,以开放心态为后续拓展性话题的展开做好准备。

无论是填写《用户基本信息问卷》还是后续的问卷,建议采用主持人提问、用户回答的方式收集信息。用户的注意力集中于思考和沟通,就能够提供更多有价值的信息,而不是忙于撰写问卷。

第二步.完成单任务,填写《单任务满意度问卷》

主持人按照顺序分步解说单任务。单任务测试过程中,工作人员不要去打扰用户,也不要给用户任何提示,所有的问题都等到测试结束再进行解答。

观察员需仔细观察用户操作,记录用户是否很容易判断出如何操作,完成某个重要功能点时是否顺畅;需随时关注用户表情,记录下明显表情相关联的流程或功能点等等细节。

一个单任务完成后,提示用户稍事休息,然后提问《单任务满意度问卷》中的问题。此时可以回答用户操作过程中的疑问,也可以藉由操作中的细节做延展发散,询问用户操作感受。通常可以获得很多针对该单任务的意见和建议。这些意见和建议后续就需要记录整理,作为优化任务帮助提升产品可用性和易用性。

第三步.填写《SUS系统可用性量表》,了解整体评估

整个任务完成后,可以藉由填写《SUS系统可用性量表》,了解用户对整体的评估。由于量表的10个题目中,包括奇数项的正面陈述和偶数项的反面陈述,所以在提问过程中一定要陈述清楚题目。如果用户认为有些问题无法回答,则视为其选择中间值。在后续的结果整理阶段,再对量表总分进行计算。

在问题询问过程中,可以有针对性地询问原因。比如针对第2个问题“我认为酷大师建模工具的操作较为复杂,其实没必要这么复杂”。

如果用户认为不复杂,则可以询问哪些点非常简单易用;如果用户觉得复杂,则可以询问哪些点觉得复杂。用户告知原因的同时,常常会说出他认为比较简单的解决方案。这些解决方案或者来自于竞品,或者来自于实践,或者来自于创新,常常可以帮助我们开拓思路,走出认知盲区。

第四步.拓展性访谈,测试收尾

在这个环节可以不必拘泥于原定的测试任务。建议预留一定时间,大到行业发展,小到产品细节,与用户进行一番深度探讨。这些来自于一线的用户常常会带来一些新鲜的灵感,为产品未来的拓展提供一些线索,解决产品当下的一些困惑。

由于我们一开始就对测试样本进行了分类,所以也可以结合前面几个环节的信息,对各分类下的用户诉求和行为习惯进一步验证、区分、归纳。

结果整理阶段

第一步.SUS量表分值计算

首先,我们需要计算SUS量表总分。奇数项计分采用“原始得分-1”,偶数项计分采用“5-原始得分”。由于是5点量表,每个题目的得分范围记为0~4(最大值为40),而SUS的范围在0~100,故需要把所有项的转换分相加,最终再乘以2.5,即可获得SUS分数。

其次,我们可以获得分量表得分。SUS量表中,第4和第10项构成的子量表为“易学性”(Learnability),其他8项构成的子量表为“可用性”(Usability)。

为了使易学性和可用性分数能够与整体SUS分数兼容,范围也是0~100,需要对原始分数进行转换:易学性量表转换分数的总和乘以12.5,可用性量表乘以3.125。

最后,我们可以将SUS量表分数换算成百分等级来解释,找到对应评级。百分等级的意思是指测量的产品或系统相对于总数据库里其他产品或系统的可用性程度。比如SUS得分是73分,其百分等级大约为67,意味着比大约66%的产品可用性更好。

工具型产品可用性测试怎么做?来看酷家乐的实战经验!

第二步.整理问题列表,推进迭代优化

做完所有用户的测试之后,我们一定会收集到很多涉及具体功能点的反馈。对于正向反馈,我们可以谦虚地接受,并且思考这些打动用户的点如何复用;对于非正向反馈,我们应该冷静地思考,它们将是本次可用性测试中最直接而有效的收获!

对这些反馈可以进行分类归纳,将其中能够立即应用于产品的内容整理出来,按照优先级,放入产品迭代优化任务中。这些任务将提高产品可用性,在数据层面能够帮助提升留存率。我们这次可用性测试中总共获取97个有效反馈,其中62个整理进产品迭代任务,并且取得了用户使用数据上的相应提升。

第三步.撰写测试报告

整个测试环节通常只有2-3位工作人员,如果希望能和团队一起分享测试的收获,建议整理一份总结报告。可以使用word或者ppt形式,说明测试背景、测试用户信息、主要结论、发现的问题、以及解决问题的行动项。

总结升级

经过几场颇具收获的工具型产品的可用性测试之后,我做了一些总结,希望能够形成适应于工具型产品的可用性测试体系:

1. 目的性

工具型产品的可用性测试目的比较统一:帮助团队优化体验路径;帮助团队明确用户使用产品时的体验感受;帮助设计师验证设计指标。

2. 专业性

完整的可用性测试全程都需要专业支撑,从筹备到进行,从任务到结果,每一个细节都需要考虑到位。在这过程中我们要尽量保证:流程规划清晰;文档整理完整;分工明确到位。

3. 参与性

大多数可用性测试是用户体验相关岗位人员发起,但是用户对于产品的反馈与团队每位成员息息相关,所以建议团队共同参与。比如在这次可用性测试中,就邀请了产品经理和研发人员担当观察员或主持人;邀请用研人员给予专业指导培训;在对测试反馈的问题进行优化过程中,也是团队通力合作,推进迭代快速进行。

4. 周期性

可用性测试不是进行一次就结束的一场表演。而是结合产品进展情况,可持续实施的一种有效的快速验证方式。

可以在新产品上线后进行,可以在重要功能上线前进行,也可以在迭代优化后进行。建议周期性进行可用性测试,取得一些结果后立即应用于产品,隔段时间再次验证,形成良性循环。亦趋近于精益用户体验中倡导的基本MVP理念。

当然,每次可用性测试都需要工作人员投入大量时间和精力,所以专业赋能可以成为很好的解决方案。即团队成员可以学习使用该方法,轮流进行周期性操作。

工具型产品可用性测试怎么做?来看酷家乐的实战经验!

写在最后

我们日常其实接触并积累了大量专业方法,可用性测试只是其中一种。在不断实践的过程中才能真正体会到这些方法的魅力之处,在不断落地的过程中才能打磨自身的方法论体系,形成属于自己的一套打法,给产品设计带来新颖的专业思路。

文章来源:优设    作者:酷家乐UED 


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

解读地图设计

资深UI设计者

通过阅读“地图基础知识及通用设计原则”,相信大家已经对地图及其设计有了一定认知,本篇我们来了解下如何实践。


Part 1. 上篇要点回顾


- 核心设计原则

  • 符合制图学和公众认知

  • 保证识别度

  • 清晰有层次

  • 细分地图模式

  • 具有品牌特性



- 元素分类

  • 点元素:地名、POI等

  • 线元素:道路、地铁线、水系线、铁路线、航线、边界线等

  • 面元素:陆地、草地、湖泊海洋、AOI等

*名词解释:POI, Point of Information的缩写,即“信息点”。一个POI可以是一栋房子、一个商铺

*名词解释:AOI, Area of Interest的缩写,即“信息面”。指的是区域状的地理实体,如医院、小区等


Part 2. 设计背景


为了实现“让出行更美好”的使命,今年乘客端新增了自驾导航。地图贯穿了该产品的全流程,且首页、路线规划页、导航中等场景用户需求都不相同。然而已有的模式,从配色到信息展现,都不符合首页地图的场景需求,于是需要重新设计。


以下详解设计过程。


Part 3. 设计落地


- 设计关键词推导


根据自驾导航的目标,拆解出了首页地图的设计目标:

  • 构建适合自驾场景的浏览地图

  • 提升地图体验与设计品质,提高用户满意度和好感度

  • 打造具有滴滴品牌调性的地图


用户需求及习惯表明:在首页主要是明确自身定位、查看其他位置信息,且视距基本是手持距离。那么“构建适合自驾场景的浏览地图”关键点就在于识别度,更好的展示重点信息,保证用户读图效率。


“提升地图体验与设计品质,打造具有滴滴品牌调性的地图”的目标,可以通过视觉手段实现。在浏览场景,用户使用地图的时间不固定,为避免长时间浏览产生疲惫感,地图配色需要更舒适,对比度也要适中。这点也与自驾导航整体的设计关键词“轻量”不谋而合,于是推导出了关键词轻量化、品牌感


- 设计地图方案


明确设计关键词后,开始着手设计。关键词中的轻量化、品牌感基本上决定了这款地图的调性,识别度则重点影响信息展现。上篇提到,设计时可以把地图元素拆分成点、线、面三类,按照由大到小的顺序设计,即先确定配色,再设计文字图标等信息,以免元素过多互相干扰。


1、设计整体配色


轻量化传达轻量化的感受需要控制取色范围,于是我们制定了颜色使用规则(下图)。


  • 色相:以冷色为主,医院(红色系)等具有公众认知的颜色可除外;颜色从品牌色系中选取

  • 明度:限定颜色的明度范围,选取中间-略高的部分,平衡颜色对比度

  • 饱和度:避免使用高饱和度的颜色,保证配色的舒适感


通过分析颜色,我们对传达轻量化的感受有了大致的把握。那么品牌感如何体现呢?


品牌感具有品牌调性的地图能更好的融入产品设计风格,也能够区别于竞品,这在滴滴全流程的设计中都十分重要。在地图上我们主要用颜色及图标绘制表达品牌调性。


  • 颜色:结合轻量化的用色规则,从品牌色系中选取,使地图配色与其他组件更加融合

  • 图标绘制:沿用滴滴设计规范中的图标绘制语言,如圆角、简单形状等,拉齐视觉感受




最终根据“轻量化”和“品牌感”这两个关键词,设计出了地图配色的效果图。



2、设计地图信息


配色确定后,即可开启POI图标+文字、AOI文字、道路文字、以及各类行政区划文字的设计。


识别度设计地图信息时,保证基本识别度的方式,可通过文字颜色、字号大小、图标绘制等实现。但是要做到清晰有重点,就要关注信息间的层次感


以POI信息为例。回顾下此时的用户需求:了解自身定位、查看其他位置信息。从这点可以锁定第一展示优先级应为POI——地图上定位最精准的信息种类。而已有的图标识别度较弱,无法满足需求,于是我们进行了重绘。通过用色表达图标类型、首选有公众认知的载体作为表意、增强颜色饱和度及对比度,搭配文字颜色,从视觉上把POI信息提升至第一顺位。


用同样的方法,根据重要程度,通过设计拉开了信息的视觉层级:POI>道路名称>AOI名称>行政区划信息



3、整体调整


在完成了配色和信息设计后,我们需要整合所有元素统一调整。此时,通常会出现元素互相干扰的问题,我们可以回归到场景需求中解决此类问题,按照信息的重要程度调整,最终形成完整方案。



Part 4. 设计验证


地图方案落地后,我们会关注设计品质的验证。由于地图的工具属性,验证其设计品质及用户满意度一直是行业内较困难的事情。地图既是一种图形语言,又承载了大量的信息,且需符合场景需求,要验证的内容非常多。因此我们建立了地图评测模型,从美观度、识别度、读图效率等多维度进行评测,量化地图设计品质。


通过对自驾导航首页地图的两轮调研,我们回收了大量有效结论,如用户对道路等级的关注程度、如何使用AOI信息等等。新版地图在美观度、识别度等方面均得到了用户的认可。


了解用户的声音,能更好的帮助我们深耕地图设计领域、全力推动地图体验优化。



Part 5. 未来形态畅想


当前科技发展迅速,近些年出现的HUD、AR等导航,用现实世界的画面代替了地图,不需要转换思维、记忆地图语言,让人与世界的连接更轻松便捷。我们不妨顺着这个趋势大胆的畅想一番,在未来的某天,世界的数据会植入我们脑中,不再有陌生的地方,现有的地图形态也许会消失,因为它就在我们脚下。


文章来源:站酷    作者:CDX创意设计中心


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

如何建立招聘平台的用户标签体系?

资深UI设计者

目前基于用户画像的标签体系在各行各业开始得到应用,对于涉及范围广,专业知识深的互联网招聘领域来说,建立标签体系的难点是什么呢?应该如何建立标签体系?怎么验证标签体系的准确性?文章对这三个问题展开了分析探讨,与大家分享。

一、招聘领域建立标签体系的难点

电商行业客观来说属于比较简单的toC领域,知识网络是比较容易理解的通用知识,可通过用户的购买习惯、偏好、商品品类等建立标签体系。医疗行业属于专业性强的领域,建立标签体系必须要懂医疗技术的专家团队才可以,但是易于操作的是,只需要医疗一个领域专家就可以完成专业的标签体系建设。

但对于招聘行业来说,行业、职位涉及范围广,且专业性强,因为各行各业的公司和求职者都会通过招聘平台建立联系,而且有很多高精专的职位和候选人,怎么评估B/C端之间专业技能、工种、行业之间的匹配度,确是一大难点,而且理论上来说需要集齐各个行业、各种职位的专家人员才能建立起招聘行业的标签体系,但这在现实中要怎么操作呢?

那么机器是否可以自动完成招聘领域的标签体系建设呢?用NLP抽取职位JD中的描述并将其聚类,比如抽取Java、spring、Unix、Visio、Excel等工具技能,原型设计、交互设计、需求分析等工作内容技能,用户运营、产品运营、数据运营等工作方向技能,这是互联网从业者最熟悉的开发、产品、运营的工作内容和技能,如果机器可以识别这些类别标签就很完美了。

但现实却是看似的完美与和谐,万一Java是出现在了招聘专员的职位描述中呢?用户写的是“负责招聘Java工程师”,假如Visio出现在Java工程师的描述中呢?假如Excel出现在运营专员的职位描述中呢?这些技能还是不是这个岗位的核心能力?

首先,Java出现在招聘专员出其实是可以用硬规则过滤掉的,比如限制职位和技能的关系,也就是说不是所有技能都满足所有职位,有的技能只适用于某些职位,在其他职位内就是无效信息。

其次,需求分析是不是产品经理的技能标签呢?有的人说肯定是了,这个回答可以说对也可以说不对,对是因为需求分析确实是产品的必备能力和工作内容,不对是因为所有的产品经理都需要需求分析,那这个能力还是该产品经理区别于其他产品经理的能力吗?

最后Excel会出现在运营专员内、也会出现在招聘专员内,也会出现在统计专员内,那么它还是个核心的技能标签吗?

通过以上分析可得到以下归纳性的总结:

  1. 不是所有技能都适用于所有的职位,应该定义每个职位的核心技能标签体系,因为非核心的技能有时候不仅无效还会起到反作用;
  2. 不是所有该职位需要的技能或者做的工作内容都是该职位的技能标签,因为它是该岗位的通用能力没有区别度,技能标签应该是该职位工种的核心技能且是可以区别不同职位或简历的。

所以通过以上分析可知,纯NLP机器识别的方式不能完成招聘领域的标签体系建设,因为机器没办法在一个岗位的众多技能中筛选出哪些是重要的知识技能,哪些是不重要的知识技能。

二、如何建立招聘领域的标签体系

1. 基于静态信息的通用标准化标签

招聘领域的标签大家首先可以想到的就是学历、工作年限、薪资范围等比较通用的职位/简历端匹配维度,当然这些显性通用的标签早已被各招聘平台做成了结构化的筛选项。

其次还有一些比较小众的维度要求,比如有的职位要求海外经历、党员、国企工作经历、籍贯、年龄等,有些平台也把其中的某些维度做成了平台上的结构化标签。

不过这些不是我们研究的重点,我们主要研究的是每个职位专业的知识方向的技能。

2. 基于静态信息的专业知识精细化标签

建立专业知识标签体系的重点就是建立专业的岗位研究专家团队,想要做某个岗位的专业知识标签研究,肯定需要熟悉该岗位的人员,是选择从事该岗位工作的人员呢,还是对这类岗位有所了解的HR人员呢?

因此就这两类人员进行了调研与分析,最终发现从事该岗位的人虽然对所从事的岗位了解比较深入,但对其他相关的岗位未必了解,也不太了解招聘过程中用户的感知与思维;

HR人员虽然在专业深度上对岗位的了解不是很深入,但所了解的岗位范围广,只要从事过某个行业的HR工作,基本都熟悉该行业所有的岗位与关注的重点技能,且HR经常使用招聘平台,有用户感知,对用户行为与逻辑都非常了解,所以HR更适合做岗位专业知识研究,而且该专家团队最好是来自各个不同行业的HR人员。

团队建好了,大概的研究思路也有了,接下来就可以好好研究标签体系具体的生产流程与规则了,对此进行了如下图的总结:

体系建立的目的肯定是运用在算法的推荐与搜索中,初期可以通过离线的漏斗数据转化对比(命中标签与未命中标签的转化对比)来验证该标签体系的离线匹配效果,再者可通过灰度实验,小流量上线实验来验证实际线上的匹配效果。

专业知识标签关注的只是匹配度的准,最终线上使用肯定还要考虑用户是否活跃,B端HR是否着急要人,C端求职者是否在找工作,如何平衡专业知识的准与用户行为的活之间的权重也一大难点,要找到那个准与活平衡的比例区间,在这个区间内线上能实现最大的用户达成,这方面在此不多做分析,需要算法同学多次调整模型才能达成。

3. 基于动态信息的用户行为标签

基于用户行为的用户画像标签体系在电商领域中运用广泛,在招聘领域此类标签体系同样适用,只不过电商领域中的“查看-联系卖家-购买”行为在招聘领域变成了“查看-开聊-达成约面”行为。

电商平台中的协同过滤理论在招聘平台也同样适用,只是变成了基于相似职位的过滤和基于相似候选人的过滤。有的企业以往达成的多数是名校候选人,那么我们就知道该企业偏好有名校教育经历的;有的企业招聘销售岗更倾向于在专业知识体系中的有软件销售经验的候选人,那么我们就知道该企业偏好软件行业的销售候选人。

通过用户画像体系我们可以评估用户的偏好,以期在该用户以后的推荐中使用其偏好,达到更好的效果。

三、招聘领域静动态标签体系的综合运用

静态通用标签是所有职类共用的标签特征,属于大批量标准化的生产与运营,通用标签生产完善了,可以实现粗矿式大步快跑节奏的匹配达成;

而专业知识标签是每类职位专业的标签特征,是小批量精细化的生产与运营,在前面大步快跑达到一定匹配度之后,再结合精细化的小步快跑方式,逐步将每个职类的颗粒度划分为更精细化的颗粒度,达到更高匹配程度;

在前面标准化、精细化两轮分类之后数据已经被分成了一个个小类,但却没有衡量单个用户偏好的特征标签,而动态的用户行为标签就是单个用户个性化的偏好特征标签,用户的偏好有可能是通用的学历、年限特征,也可能是专业知识中某个技术框架、某种产品品类特征。

最终,静态标准化通用标签、专业知识精细化标签、动态行为个性化偏好标签,三者相互作用、相辅相成,提升招聘领域线上效果的匹配准确度。

文章来源:人人都是产品经理    作者:艳杰


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


日历

链接

个人资料

蓝蓝设计的小编 http://www.lanlanwork.com

存档