首页

张小龙:“简单”和“连接”,两个词描述微信十年

涛涛

微信已经十岁了,如今很多人会用微信作为人与人之间的联系方式,“加个微信”也成了一种社交方式;微信这十年不断地创新,开发出越来越多的功能,从社交聊天工具到现在的视频号以及直播;本文是2021年微信公开课中张小龙的演讲内容,我们一起来了解一下。

2021年微信公开课,如约而至。

今年有些特别,他在视频号上开了直播,和更多人线上见——“我觉得直播特别简单,我都做了好几场。”

微信十年了。张小龙回顾了当初做微信的初心——“出发点很简单,想做一款产品给自己用。”

他也感谢了微信平台上的每一位创作者,因为有他们,微信才能有今天的活力。

张小龙在视频号里,讲了视频号。当初为什么想做视频号,视频号的意义是什么,视频号的推荐机制是怎么考量的,视频号有哪些新的可能等等。

除了视频号,他还强忍着想剧透的心,提前透露了即将到来的微信新版本。微信表情的新玩法、可以更新你的微信状态变成你个人“活”的名片、下拉有更多惊喜……

究竟有哪些惊喜,欢迎往下拉:

各位朋友,晚上好!

谢谢来到公开课现场的朋友们,让我感受到这是一个面对面的交流,而不是一个人面对屏幕的直播。

2020,对很多人来说都是很不容易的一年,包括我们的公开课,也改为线上进行了;虽然在几年前的一次公开课上,我说公开课应该线上开就好了,效率最高,但没有想到今天是因为疫情的原因被迫做到了。

去年这个时候我们也没有想到,这次我们已经通过视频号来进行直播了。

张小龙:“简单”和“连接”,两个词描述微信十年(附万字全文)

因为疫情,很多公司的年会都改线上了,所以这个时候,我的同事们正在努力给视频号直播加一个能力,就是只有白名单的人才能进入直播间的企业内直播,希望能给需要线上开年会的企业一些帮助吧。

回头看十年前,当时的想法只是,希望有一个适合自己的通讯工具来用。

于是就开始了微信的第一版。但当时绝对没有想到,十年后的微信会是现在这个样子;对此,我自己感觉特别幸运,我想我一定是那个被上帝选中的人,因为光靠个人努力是做不到这一点的。

我分享一组数据吧,到今天,每天——

  • 有10.9亿用户打开微信,3.3亿用户进行了视频通话;
  • 有7.8亿用户进入朋友圈,1.2亿用户发表朋友圈,其中照片6.7亿张,短视频1亿条;
  • 有3.6亿用户读公众号文章,4亿用户使用小程序;
  • 还有很多,包括微信支付,企业微信,微信读书,搜索等,就不一一说了。

如微信支付,它就像你以前的钱包一样,已经变成了生活常用品;而微信,也真的成为了“一个生活方式”。

今天是公开课,应该有很多的创作者参与,所以,也在这里感谢微信平台的每一个创作者,公众号的、小程序的、视频号的创作者;因为你们的创作,让微信的生态充满活力。

大家知道视频号今年的变化特别大。这里也想分享一下视频号的一些想法。

一、视频号的起源

可能在2017年吧,我跟公众号的团队说,我们现在公众号只适合少数人写长文章,但是大部分人写不了文章;我们应该在朋友圈下面加一个“非朋友圈”,只能发短文或者照片视频。

但后来就不了了之了,确实是很大的工程,因为帐号体系可能都完全不同了,就完全是个新的比公众号还复杂的系统。

随着时间的推移,视频化表达其实越来越成为普通人的习惯。

来看几个数据,最近5年,用户每天发送的视频消息数量上升33倍,朋友圈视频发表数上升10倍;这时候,我们再思考短内容的时候,就会想,不应该基于短文字来做,而是应该基于视频化内容来做了。

视频化表达应该是下一个十年的内容领域的一个主题,虽然我们并不清楚,文字还是视频才代表了人类文明的进步,但从个人表达,以及消费程度来说,时代正在往视频化表达方向发展。

于是在2019年,我们组织了一个特别小的小团队,开始了视频号的开发;我们也没有问公司要什么资源专门去做,甚至没有在公司开会立项,就自己悄悄做了;我觉得这很微信风格啊,基本上微信做东西,都是成立小团队开始做起,而不是大规模的兵团作战。

并且我说,我们要做,就一定要做成、做大。

这并不是公司给的任务,因为完成任务是枯燥无味的,并且会因此动作变形,应该说是我们要给自己一些挑战性的目标,不然工作会显得很无聊。

二、视频号是什么?

视频号是一个人人都可创作的短内容平台。

所以它是公开领域的内容平台,就不能基于微信号来创作了。

因此遇到的第一个问题是,需要有一种新的ID(身份)。

长期以来,微信的最大价值是每个人的微信ID,比如微信支付能很顺畅,因为钱包跟着个人ID走,这是非常自然的,就像你现在只拿身份证也能取钱一样;但这个ID是通讯和社交领域的,因此是私密的。

因此,微信的用户并不能公开对非好友说话,即便评论了,别人也无法联系你,这对于社交领域当然没有问题;但对于公开领域,需要新的身份;而在一个产品里,承担两个身份,其实是很有挑战的。

而这个新的ID,还必须特别方便,不至于在各个场景里遇到身份的冲突,所以处理得不好,双ID会让系统变得非常复杂;比如你评论,就需要选择用哪个ID来评论。

但是这个ID的意义又特别大,一旦走出这一步,意味着微信不再局限于社交领域,而是进入到公开信息领域。

因此视频号的意义,与其说是视频,不如说是“号”,因为有了一个公开的号,意味着每个人都有了一个公开发声的身份。

比如,直播,在视频号里做得很顺利;在视频号之前,我们是没法做直播的,最多做到群内直播,那还是属于群通信的范畴;但有了视频号这个ID,每个人可以迅速开通自己的直播。这里,ID才是基石,它可以承载视频内容,可以承载直播,可以承载小程序等。

我记得当时有个方案是,每个进视频号的人要创建一个视频号ID,用这个ID来浏览和评论内容。我说不对,浏览者应该是微信身份,而不应该强迫每个人开一个新的身份才能看和评论。

幸好当时选择了这样一条路径,不然就没有后来的社交推荐体系了。其实产品的迭代是由无数这样的选择组成的。

ID还有一个重要的意义是针对机构的。

大家知道PC时代每个机构都有一个官方网站,其实微信一直在寻找PC时代的“官方网站”的替代物;做公众号的时候,我们希望公众号就是一个机构比如企业的官网。做小程序的时候,我们希望小程序就是官网。

现在,我们希望视频号是每个机构的官网。这是合理的,官网是需要进化的。所以未来视频号会承接一个机构的很多服务内容,并不局限于视频;比如一个企业的服务,可以通过小程序的方式,展示在视频号下面。

所以我开玩笑说,如果有一天我们在每一个广告牌下面,都能看到广告主的视频号的二维码,那就说明视频号做成了想要的官网了。

第一个版本其实只是搭建了这样一个ID体系。和公众号的很类似,但是比公众号的门槛低很多,普通微信用户可以立即开通它。

内容表现上,只是一个简单的信息流,混合了关注的,朋友匿名点赞的,和系统推荐的内容在里面。

但这样的效果并不好。因为是灰度,量不大,因此也吸引不到大量的创作者来贡献内容,因此推荐的内容也一般般。

但即使如此,我们还是希望推荐的质量能够好起来。我们组建了三个做推荐算法的团队,每个团队十几个工程师。希望各自用不同方法去找到推荐的最优解。

应该说我们在算法领域沉淀应该还是很深的,搜一搜背后是个几百工程师的搜索技术团队,同时我们自己研发的语音识别和机器翻译,都是国内的一流水准。

对了,外界一直有人说我们的语音识别用的是第三方的技术,其实我们从未用过第三方的,一直都是我们自己研发的。现在微信里面的语音识别每天翻译的语音条目在五亿条以上。

虽然搜索团队有很强的算法技术人员,但是,我还是把他们从搜索团队抽调出来进入到视频号团队来工作。因为闭环的小团队才能迅速迭代。

推荐团队很努力,但头几个月的滚动特别困难,似乎陷入了死结,就是内容不好看就没有浏览量,就导致没有人贡献内容,所以推荐系统也推不出好内容,然后继续没有好的内容看。

5月份的时候,我们做了视频号最重大的一个改变。

因为经过几个月的灰度,表明在现有的内容下,基于机器推荐是走不通的。对比朋友点赞的内容,虽然当时朋友点赞还是匿名的,和机器推荐的内容来对比,我发现,机器推荐的远不如人工(或者说朋友)推荐的精彩。既然这样,就应该以实名点赞的社交推荐为主,机器推荐为辅。

当时我给的理由是,我们所看的书,大部分是因为周围有人推荐而去看,而不是网上书店推荐的书。你少看几个机器推荐的内容不会觉得可惜,但错过了朋友们都在看的内容会觉得可惜。这是视频号能借助社交推荐起来的理由。

于是五月份开始了变更最频繁的两周,几乎每两天就要更新一个版本。然后发布了基于朋友点赞的新的灰度版本,终于看到了上扬的数据,用户的留存非常高。

所以6月视频号的用户到了一个量级。数字其实不重要,但对于一个内容形态的产品来说,一定量级的用户意味着解决了生死问题,即流量的循环起来了。

这是一种典型的微信style的产品方法,即通过产品而非运营的方法,找到事情的撬动点,通过产品能力让事情运转起来。

有这个用户基数说明生存下来了,这时候就可以开始做基础功能的完善了,比如直播能力等。没有过生死线的话,做再多功能也是白搭。

在这里,是社交推荐发挥了作用,当时机器推荐的占比非常小,留存也非常低,我们也差点就放弃了机器推荐。但是,并不是说机器推荐没有用,而是要在内容丰富的情况下才能发挥作用。

插一个小故事,6月份的时候,那时社交推荐的新版还在开发吧,我在黑板上写下一个断言:未来有一天,视频的播放量,关注,好友推荐,机器推荐的消耗比例,应该是1:2:10。即,一个人应该平均看10个关注的视频,20个朋友赞的视频,100个系统推荐的视频这样的比例。

当时是这么解释的:

内容分两种,一种是你需要花脑力去理解的知识性信息,是学习;一种是不需要花脑力的思维舒适区的消费类的信息,是娱乐。

朋友赞是朋友强迫你去获取你未必感兴趣的知识性信息,属于学习类的;机器推荐,是系统投其所好而让你很舒服的浏览你喜欢的消费性信息,属于娱乐类的。关注里面两种信息都有。

因为关注的东西你已经知道大概会是什么了,反而不会太有吸引力,因此是1。朋友赞虽然看起来累,但是不能错过,所以是2。而系统推荐,符合懒人原则,是大多数人都更容易消费且获得舒适感的信息,所以是10。但是我们现在的大盘数据,并不是这个比例。现在朋友赞产生的整体vv,是机器推荐的2倍。

于是我让数据同事统计了一下,只拿有关注的用户来看。有关注的用户目前极少,属于活跃用户,所以代表了未来活跃用户的行为。

前几天的数据是,有关注的用户,人均在三个tab产生的vv,差不多是1:2:9。

拿到这个结果时我非常吃惊。它只是一种粗略的估计,并不是说预测特别准确,而是说我们做东西的习惯是,如果这样做,应该先推理出来一个结果,然后用数据去验证,才能检验方向是不是对的。

我估计未来这个9还会变得更大。因为这是和内容丰富度相关的。

说到这里,可能会有人说当机器推荐这个9变得越来越大,不是不符合用完即走吗。用完即走跟时间长短无关,跟效率有关。

我们从来不会关注用户在微信里停留的时长,那不是我们的目标。当用户想要看内容的时候,不管是文章还是视频,如果他花了很多时间看,只能说明微信里面有很多值得看的内容,而不是要刻意去消耗他的时间。

三、什么是视频?

过程中还解决了另一个问题,即究竟什么是视频的问题。

说到视频,大家会想到手机相册里面的视频文件。就像朋友圈,只能上传相册的视频。我们也确实是通过这个方式,来希望朋友圈里的视频更多的是用户自己拍摄的视频。

但视频文件其实是会消失的。

从Windows转到苹果手机的用户,都会遇到一个问题,以前的文件和文件夹去哪里了。在iOS里,没有了文件的概念。文件被各个应用自己定义了。这是把文件应用化了,即文件不能脱离应用而存在,一旦脱离了,就是没有意义无法解释的数据。

这是一种很好的观念。

原始视频只是数据,它没法关联到其他信息,如创作者,观众数,评论等。它还需要存在本地,数据丢了就丢了。

因此未来的视频应该是一种结构化数据。它存在云端,有所有的创作者信息,有观众的互动信息,能够很方便的分享。

文字和视频等内容,存在的价值在于有人看到,也就是分享。而分享,如果还需要copy整个原始数据,是很落后的。分享应该只是一个链接的传递。

这会让我反思,朋友圈里面上传视频,以后会一直用这种原始方式吗?

所以在6月的时候,我们需要把视频号内容分享到朋友圈来,遇到一个问题,它应该长得像一个链接呢,还是像一个本地视频呢?其实是归类,它应该归类到文章链接,还是一个视频文件。

我的答案是,云端化的结构化的视频,才是视频,本地的视频文件,反而是裸数据,是应该被淘汰的。所以你看到的朋友圈里的视频号的视频,和现在的本地视频的展现没什么区别。

在这里,视频号是结构化的视频内容的载体。我相信以后微信里面流通的视频,越来越多的会以视频号视频的形式存在,而不是视频文件的方式。这种变化,其实在公众号体系里体现过一次。公众号是一个文章的载体。

它让文章因为分享而变得有价值。并且,公众号定义了文章的展现形式,是所有的用户在阅读不同的文章时,能以一种相对一致的体验来阅读和互动。在我看来,这是对网页时代阅读体验的一次大的体验提升。

不管是文章还是视频,他们存在的价值在于被人看到,或者说被分享。显然,文章和视频需要一个载体来传播。

如果你能理解公众号对于文章分享的价值,那么,可以用同样的思路去理解视频号对于视频分享的价值。

载体的含义还体现在,我们自己不做内容,也不会去买内容。我们不关注具体的内容是什么。我们只做内容的承载和传递。

四、长视频和短视频

我们也遇到了超过一分钟视频的问题。自然而然地,大家会认为长视频和短视频是两种东西,因此应该设计成两种不同的内容对象。

中间有个版本确实是视频号有专门的长视频这一栏的,甚至长视频和短视频的评论点赞还是分开的。

但如果仔细思考,在微信号体系里,是不应该做这种区分的。长短视频的区别只是消费的场景不一样。短视频适合碎片时间的连续消费,而长视频适合有一大段时间来看。

对视频号来说,简化这个问题的方法,是把一分钟以内的视频是为短视频,一分钟以上的视频的开头一分钟视为这个视频的摘要或简介。我把它称为封面。这样的话,视频号不区分长视频短视频,但是又能兼容短视频的体验。

关于长视频,我希望视频号逐渐积累越来越多的长视频,成为长视频的云端仓库。

将来有一天,也许我们会提供一个检索或推荐入口,这样用户可以找到丰富的长视频内容。

这个其实也是未来非常有想象力的。

五、视频号和个人的关系

视频号的初衷是让人人都能很容易通过视频化的方式去公开表达内容。但做产品的人都知道,让用户去发表内容去表达是最困难的。

现阶段我们也并没有做到让很多人在视频号去发表自己的日常。但我们有个举措,让我们能看到希望。

我们上线了将自己的视频号内容关联到自己的微信名片的功能。我们发现结果比预料的要好很多,到现在已经有非常多人在名片展示了自己的视频号内容,并且还在持续增长。这是个很好的趋势。

这里有一个很有意思的话题,有的时候大家会觉得微信做东西特别保守。其实并不是保守,而是说很多东西是不对或不应该做的。

举个例子,我们可以把视频号的内容挂在名片上,我们以前为什么不做一个类似这样的展示自己的一些精选的照片和视频的功能?

我们内部讨论过好多次,因为很多人朋友圈设置了三天可见,越来越多了,我们打开名片有的时候几乎看不到东西。为什么不给他们提供一个可以把一些照片精选放在那里的功能,这样朋友进来至少可以看到一些。

之前我们不愿意做这个功能是因为,一旦这样做了,你可能只是把你历史上最好的照片放到那里,永远就不去修改它了。

这次我们愿意这样做是因为,如果你关联到你的视频号的内容,那它就是活的,因为你会不停地更新你的视频号内容,而不是说我选几个历史上最好的照片作为精美的装饰就永远不变了。

毕竟,视频号希望的是人人都能表达,而不是只有网红和大v的表演。

六、信息展现的方式

信息展现形式一直是互联网产品里的最基础部分,也是争议最大的。这里说的是指对信息列表的展现形式。

常见比如有瀑布流,通俗称呼的信息流,以及全屏。他们的区别是一屏里放多少条内容合适。全屏就是一屏只放一条内容。

以我自己的经验来说,我把这些式样的选择总结为一个粗略的规律,就是——

一屏里的内容条数,应当跟命中率成反比。

命中率是指用户可能感兴趣的内容条数的比例。比如10个邮件,只有一个是我想要看的,命中率是10%。

以朋友圈举例,因为你并不是要看每一个朋友发的内容的,所以命中率并不高,如果改为全屏,就是灾难。同时,如果你添加的好友越来越多,命中率还会降低,因此就更不能增加每条内容的显示面积。

如果我们要增大显示面积,就必须提高命中率。但朋友圈的命中率是很难提高的,因为朋友圈的命中率取决于朋友跟你的关系,而非他发的内容,而我们很难知道你对哪个朋友更感兴趣。

而往往关注内容越多的人,命中率就越低。所以公众号改版的时候,其实是一屏里的内容条数变少了,虽然带来了点击次数的减少,但关注多的人还是会抱怨,因为选择的难度增大了。但对于关注少的人,阅读量是上升了,因为只关注了几个号的话,命中率本来就高。后来我们在订阅号的顶部增加了常读号的展示,其实是提升了命中率。

视频号的上半年,平台的内容丰富度不够,命中率是很低的。所以当时半屏式的信息流是合适的,一屏显示超过一项内容,用户有选择的余地。那时候如果直接上全屏,可能死的很快。

到下半年,内容开始丰富了,命中率开始提高了。并且全屏对于单个视频的展现效果当然也会比半屏要好,我们开始灰度的切换到全屏模式。

这里说个有意思的数据。我们把关注和机器推荐灰度切换到全屏,并且和没有灰度全屏的用户来对比观察。发现全屏后,关注tab的人均vv(video view,视频播放量)下降了,推荐tab的上升了。这应该可以推导出来,关注tab的命中率不够高,以至于全屏后带来了轻微的选择困难。

我们在公众号里在给关注的号的内容做排序,以及在视频号里,也会通过算法对关注的内容做排序,也是为了提高命中率。

特别是全屏之后,因为用户的选择余地是零了,更需要算法来做排序。

七、直播

互联网历史上,个人在公开领域的表达方式一直在演变。

最早的时候,需要你会写HTML来做网页。后来有了博客,博客之后是微博这样的短文字。现在是图片和短视频。

演变的方向是往更能被普通人生产和消费的方向去走的。所以会体现为更短更碎片化。

所以我在想,还有什么内容形态是比短视频更能被更多人接受的。

我觉得直播有这个机会。直播比短视频的生产更容易,是因为拍一段短视频是需要有内容准备的。

而直播,是不需要准备内容的,它就是日常聊天。这是一个非常巨大的差别,直接降低了直播的门槛。这是一种轻松的表达,普通人也能够去生产出来,朋友也更愿意去消费。

虽然直播已经发展了很多年,大家对直播的认知还是带货的领域,这是作为内容形态的方式来思考,就是个人表达的形态方面来思考的。

所以,直播在未来有可能会成为一种很多人在用的个人表达方式。

做一个未来的设想,很久以后,每个人的微信名片应该是活的,意思是,我打开你的名片,如果你刚好戴了一个可以直播的眼镜正在直播,那我就能直接看到你看到的东西。这可能是个人直播的终极形态。

前不久有一场流星雨的直播,有超过100万人观看了,有点超出我们的意料了。因为,我们并没有做任何中心化的流量分发去推它,它自然就吸引了100万人。

在这里,是社交推荐在发生作用,通过朋友圈,群聊等进行了人群的扩散。当然,在视频号和直播的入口里面,我们还是会用机器推荐来给用户推荐适合的直播。

当直播多了以后,除了你的朋友,我们也希望系统能告诉你哪个直播值得你看一下,这是我们的机器推荐有更大的考验。但社交推荐,仍然会是非常重要的传播途径。

其实我们现在还没有直播的入口,下一个版本可能就有了。我们现在有一个附近的直播和人,把它调一下,可能叫直播和附近。

我们也在丰富直播电商的能力,包括直播里可以挂接到第三方的小程序。

春节快到了,我们都习惯了在群里发红包抢红包来拜年了。但其实线下传统的拜年是走家串户面对面的行为。

直播其实更能模拟出线下拜年这种传统方式。

所以我们今年在直播这里也做了一点小小的东西,我们希望今年的春节能够有一些人通过直播的方式来拜年,那就特别好。

八、关于创作者

很多人会关心平台会给创作者什么样的支持。

如上面提到的,我们更希望做视频的载体,并且让视频号成为个人和机构的官网。平台在这里的角色是连接,而不是做内容。

但和以前的官网不一样的地方在于,微信体系里的官网,内容是能自己流通的。因此你不用太担心做了官网也没有人访问。

我刚刚说到微信里集合了很多产品可能没法尝试的东西,比如说对于信息访问,我们可能会有关注关系可以获得,有搜索,有推荐,有系统推荐和社交传递这样一些方式,所以不用太担心自己的内容在这里没有人会看。

刚开始我们去邀请一些明星进来,明星会说有没有签约费。我们的回答是,我们希望你进来,因为你应该经营自己的粉丝,最终你会实现盈利,但不会平台出面来购买内容。

所以视频号这里,我们没有花一分钱去购买内容。将来也不想这么做。倒不是为了省钱,而是,当我们不花钱买内容的时候,创作者还愿意进来,才说明创作者能靠自己的努力获得回报,才说明我们建立了一个能自行运转起来的生态。

同时,我相信普通人的创作力是巨大的,相反,购买的内容反而不一定能打动人。

微信的历史上,我们一直不强调强运营,也是这个原因。

系统和规则会比运营的效率高太多了。就像我们现在看到微信支付,其实已经覆盖面非常大,但是我们微信支付的人数并不算多,对于支付这样一个需要跟线下接触的行业来说,我们每个行业微信支付里可能就一两个人在负责整个行业。

公众号的那一个slogan照样可以用在视频号上,再小的个体,也有自己的品牌。

其实你现在放在视频号上也是很适用的。

九、一些有趣的实验性项目

我们也有一些有趣好玩的实验性项目在进行中。

前面提到,做产品其实是个验证想法的过程。

如果你脑袋里突然冒出一个想法,可能很不靠谱,但又似乎有意思。然后继续往深里去想,如果能经过很多次选择,最终能变为实现,就会体会到做产品的乐趣。

我就经常会有一些异想天开的想法。

比如,如果你能拍一下一个人的头像会怎么样,如果你能朝跟你聊天的朋友扔一个炸弹在屏幕上炸开吓他一跳会怎么样,如果你在听一首歌的时候能看到其他听歌的人眼前的画面会怎么样,如果你失眠的时候也能看到其他的失眠的人然后大家一起数羊会怎么样。

甚至,如果给一个画布,每个人上去画一个点,如果有一千万人轮流去每人依次画一个点,到最后会不会形成一个图案?如果在没有组织的情况下,一千万人居然画出来一个图案,那又意味着什么?

所有这些都是很有趣的事情。所以做产品绝不是枯燥无味的。虽然大多数想法都会是行不通的,但有少数的能行得通,就非常好了。

这里,我就简单描述下微信新版本会有的几个功能。

所有的功能在被用户实际验证之前,都不能说一定会受欢迎,但是只要思路的方向没有问题,就可以不断改进。有些功能也会经历灰度,完善了才放出来。所以不要抱以太高的期望。这里分享下这些好玩的功能的思考点。

一个是表情。

表情是表达方式中的一个基本元素。

说到表达方式的基本元素,这让我想起拍一拍。

很多人会不喜欢被拍,还有很多人因为误触而拍错了人很尴尬。但仍然有1.2亿人设置了拍一拍的尾巴,每天几千万人在用拍一拍。

拍一拍也是表达的一种基本元素,并且不同于其他所有方式,它是模拟人类的现实生活中的行为动作,用最简单的一个身体动作来完成了一次信息传递。

有次内部开会我开玩笑说,未来人们的生活会越来越线上化,人们会怀念这种古老的人和人之间的交互方式的。

说回到表情。

人们的表情反映出情绪越来越强烈了。以至于必须经常“裂开”了。

我的想法可能比裂开更暴力。有一天我跟开发同学说,帮我做一个功能,我扔出一个炸弹,对方的屏幕就裂开来。当然,是动画效果的裂开,但要求很逼真。

实现是可以的,但是真的当作一个表情功能的时候,还是会遇到很多坎。

我说寻找基本元素,即这种表情必须是底层基础的,而不是一种特殊的。最终我们做到了。

一个是状态。

现在大家打开一个朋友的微信名片,往往除了名字头像,什么也看不到。朋友圈也很多人设置了时效。

但事情不应该是这样的,每个名片,应该是活生生的才对。名片就是我们线上化生活的自己,它应该反映自己真实的状态。

我们之前尝试用视频动态表达一个人的状态,但视频化表达在这个地方其实挺困难的,因为确实拍个视频让所有的好友看到,这个压力还是挺大的,所以视频动态不算成功,每天大概有100多万的人在发视频动态,我们也会把它升级一下。

升级以后的话,我们希望走到视频的另外一面。

以前我说以前每个人发文字是很困难的,其实有一个前提,发一段让很多人都看的文字是很困难的,其实自己随便说一句话其实并不困难,状态就是随便说一句话这样一个东西。

所以我们会走到视频的另外一面,通过你随便说一句话,随便写几个字来表达自己的状态。

并且,在某一时刻,一定还有其他的人跟你处在同一种状态里,你会希望看到他们。看到在打同一个游戏的人,同一个咖啡吧的人,同一个景点旅游的人等,甚至是,同一种心情的人。

我一直认为,社交的本质是找到同类。

状态,是用来给人看到的,最好还是给同类的人看到。

所以这一次,我们基于简单的文字来组织状态这样一个功能。

我不知道结果会怎么样。对于社交产品,因为它是群体互动来导致结果的,所以很难预料社交功能交给用户群体后的反应。

但是,这样的尝试是应该的。

因为,个人的状态表达的需求没有被满足。哪怕是简单的一句“我今天很郁闷”,你不会发朋友圈,也不会跟朋友专门去说,那么,总需要一个地方可以说的。

十、歌曲

还有一个新的尝试是关于听歌的,在座有一位听众跟我聊过怎样看见一首歌,歌不是用来听的,是用来看的。

自从有了网络、移动互联网以后,我感觉是很多人听歌变得少了,只有在开车的时候才会听歌,因为在任何其他时候,你会宁愿去看视频了。

微信其实是一个包含信息种类特别多的一个东西,但我一直不太满意的一点是在微信里面听歌的体验不太好,比如说我其实特别不理解为什么所有播放器都是一个电唱机在那里转,因为电唱机在我读中学的时候,我家里有一个,我还自己去买唱片,但是我想应该大部分用户不会经历过那个时代,那为什么他们要看不认识的物品,一个唱盘在那里转。

我们在听歌的时候应该看见什么?

很多人说我们在听歌的时候不应该看见什么,而是应该听就好了,但我希望听歌的时候能够看到一点东西,因为听歌的时候有一点想象力,我们之所以希望在开车的时候听,是因为你的眼睛能看到很多的东西,让你的想象比平时更活跃了。

如果这些东西,听同一首歌的人往往有很多人,举个例子,你可以想象你在这里听这首歌,另外一个人在另外的场景,还有很多类似的人,如果把他们听歌的眼前画面都连起来的话,总有一些人的画面跟你是非常类似的,他能够打动你的,所以从这个点上出发,我们就把听歌的体验做了一个视觉化的展现。

但这个难度其实特别大,因为技术还没有到那一步,我们的眼球都有一个摄像头实时传到云端,未来迟早会到那一步。

所以目前只能通过别的产品方式才能做到这一步,就是说有一些热心的用户可能会愿意说,我能够把某一首歌变成一个制作得很精美的,类似MV这样一个东西,可以分享给更多的人看到。

十一、浮窗

我其实一直很不喜欢浮窗,因为它就像狗皮膏药,这也是PC时代大部分网页浏览的体验都不好的一个原因。

为了解决一篇文章要很久才看完,而中途要不断处理微信消息的需要,我们有了浮窗功能。但它并不完美。

很多时候,一篇文章,一个长视频,是要分很多次才看完的,如果每次都要先拖到浮窗,也是很繁琐的。

现在,微信提供了一个尚未看完的内容的列表,方便可以随时找回这些内容继续看完。

尤其是对于长视频,更加需要随时可以切走,然后又能快速找到。

直播也一样需要。

十二、输入法

还有一个可以提一下的新的研发中的产品,是团队正在研发的输入法。

我们会经常收到投诉,说刚刚在微信里聊到什么,就在其他app里看到这个东西的广告,是不是微信在出卖我的聊天记录给广告主。其实并不会。

我们从来不会去分析用户的聊天记录,即便因此损失了很多广告收入。

所以当我们的技术团队,就是机器语义理解的团队,说我们自己做输入法可能会做的更好的时候,我当然很赞成。

因为至少,在安全性方面,我们可以做的足够好。

我们的目标不是一下子获取多少用户。

因为输入法是文字表达的入口,并且输入法必然越来越智能,可能出现新的输入形态,所以还是值得投入去做的。

十三、团队

很多人说视频号迭代速度特别快,事实上在微信的头两年,我们都是这个速度,后来有时快有时慢,其实我认为做产品就是应该快的。

我经常说的一句话是,如果一个问题,三天没有想出答案的话,那么三个月也想不出来,因此要么三天内找到解决方法,要么放弃,去寻找新的路径,而不是耗在那里。

孙子兵法说到,行军打仗应该要“其徐如林,其疾如风”,做产品也是这样,要么没有想清楚,那不如什么都不做;如果要做,就要非常快速的迭代。

视频号团队到目前为止也就一两百人,其中还包括了三个算法团队,前后台开发,产品运营等。

这很微信风格。

互联网产品是关于创造力的,而不是拼人数。

如果一个一百人的团队做不出来一个产品,给一千人也照样做不出来,甚至做的更差,因为一千人的内耗太大了。

十四、关于产品

微信十年,如果非要用两个词来描述微信,我想,一个是连接,一个是简单。

连接是很美的。

因为世界的运行就是靠万事万物的连接而进行的。对产品来说,做连接,意味着做服务的底层设施,因为基于连接可以演变出来的结果是最丰富的。

很多的社交产品可能也做连接,但它止步于人,微信的连接范畴更大,公众号、小程序目标都是连接,连接人和内容、人和服务,包括微信支付也可以认为是一种货币的连接,视频号的目标也是连接。

重心不是在做内容,而是在做底层的连接,这很重要。这也是为什么我们会提“去中心化“,因为连接和中心化是有些排斥的。

再说简单。

我用简单来作为美观,实用,合理,优雅的代名词。

简单是很美的。从一个物理公式到一个日常用品,往往是简单的是更好的。实现同样一个目标,有一千种方法,但只有最简单的方法是最美的。正是因为有一千种方法存在,所以要真正做到简单是很难的。

以前在饭否,看到很多产品越做越复杂,我吐槽说,“一个产品,要加多少功能,才能成为一个垃圾产品啊!” 不是说加功能会让产品不好,而是加了不必要的功能,或者加功能的方式不对。

十年来,微信加了很多功能。

我很庆幸的是,现在的微信,还几乎和十年前的微信一样简单;虽然比十年前多了非常多功能,但这些功能,都已经是用的最简单的办法了,所以增加的复杂度会小。

简单才会好用,特别是一个产品有十亿人在用的时候。

有时候也会想,很多用户其实并不一定很在意产品是否简单,粗制滥造的产品,也可能照样会有很多人用的;但是我们还是会追求简单,因为总有部分人,会认同这种简单背后的美感。

微信虽然是这么大用户量的产品了,并且经历了10年之久了;但我还是希望,它能一直保持自己的风格,一直像一个小而美的产品一样,有自己的灵魂,有自己的审美,有自己的创意,有自己的观念。

而不仅仅是数字的奴隶,这样的话,我和团队,才会为我们的工作而感到骄傲,并且觉得有意义,这是我对微信十年在今天的最后一个总结。


文章来源:人人都是产品经理  作者:纸盒小卡车

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


B端产品弹窗以及设计方法

涛涛

弹窗作为应用的辅助窗口之一,在B端产品中占据重要作用,很多产品甚至大部分功能都需要在弹窗中完成。有些弹窗会被用来承担复杂的设置、有些弹窗会被频繁调用、有些弹窗需要提供更详细和更结构化的信息,如何处理好弹窗在整个任务流中的交互对UI来说非常重要,因此本文主要探讨B端产品中的弹窗设计和规范。文末会提供可供调研学习的B端网站。


如果你想了解B端系统图标的设计方法,可以浏览上一篇《小白适用:如何快速掌握系统图标的设计方法》,欢迎讨论指正。


一、弹窗、对话框、窗口,你分清了吗?


1、弹窗(popup)


不知道你们有没有思考过“对话框”和“弹窗”的区别,我们平常所称呼的“弹窗”主要着眼于动作,意思就是弹出来的窗口,是泛指,在GUI(Graphical User Interface)屏幕中几乎所有弹出来的对象都可以称之为“弹窗”。


在常用的两个前端网页开发组件Ant Design和ElementUI中,没有单独命名为“弹窗”的组件,都是细分在各个功能分类中。比如Ant Design中相关的细分就有警告提示、全局提示、对话框、通知提醒框、气泡确认框等,而ElementUI中则又是不一样的细分法,除了分类方法和命名不一样,归根结底达到的目的是一样的,以上我们都可称之为“弹窗”,当然在工作中用细分的称呼会更专业更明确。


2、窗口(window)


这里的“窗口”对标“对话框”和“弹窗”的概念,窗口是承载应用程序的区域,应用程序的窗口被打开,则表示该应用程序正在运行中。窗口可以移动、可以放大缩小,主要有二种姿态,一种是“独占式”,一种是“暂时式”。顾名思义,“独占式”就是需要占据大部分屏幕的应用,ps、ai的窗口就是“独占式”窗口,而“暂时式”则大部分时间在后台运行,比如音乐播放器、杀毒软件等,只需在必要时打开即可。



一个应用通常由一个主窗口和若干辅助窗口构成,弹窗就是典型的辅助窗口之一。


3、对话框(dialog)


对话框强调了用户与计算机进行对话的过程,是叠加在应用主窗口上的弹出框,一般在对话中它会给出消息或要求输入。当对话完成后,即可关闭对话框。说人话就是,对话框一般需要用户进行操作,当用户输入或者点击“确认”、“取消”等按钮时,计算机会根据指令进行工作,这是一个人机“对话”的过程,因此称之为“对话框”。



无论在现实中还是界面交互中,我们都不希望对话被打断,所以对话框通常是模态的(下文会解释模态和非模态的定义)。


梳理完三个容易混淆的概念之后,接下来主要从弹窗的二个角度展开讨论:弹窗的分类和应用场景;弹窗的设计细节和技巧。


二、弹窗的分类和应用场景


1、弹窗的分类


弹窗可分为两大类型:“模态弹窗”和“非模态弹窗”。


模态弹窗:用户必须给予弹窗反馈,除非点击关闭或者操作完成,否则弹窗会一直在。形式上来说就是给当前页面添加蒙层,使用户将注意力集中在弹窗上。上文提到,无论在现实中还是界面交互中,我们都不希望对话被打断,模态弹窗不会轻易被打断,所以对话框通常也都是模态弹窗。



模态弹窗的常见场景:你打开了一个应用的模态弹窗后没有管它,然后切换到其他应用程序中去,等你忙完回到原来的应用时,那个当初的模态弹窗仍旧在那儿等你。这就是模态弹窗,虽然看起来僵硬死板,但是它的目的和使用范围通常是非常清晰的。


非模态弹窗:不需要给出反馈,不影响用户的其他操作,主要有属性配置弹窗、Tooltips、消息通知、气泡框等类型。


下图红框中就是典型的非模态弹窗,它们可以同时开启且互不影响,不会影响主程序的进程。



非模态弹窗的另一个特点就是:实时生效。点开非模态弹窗的同时仍然可以看见主界面,主界面会根据你的操作实时变化,你可以随心所欲地不断选择、改变、选择、改变,而模态弹窗则无法在你点击其中一个表单的当下立即做出改变。


下图例子就是非模态的属性配置弹窗。



2、模态弹窗的应用场景


1)通知公告类弹窗(通常是重要的信息,需要加强用户关注度)


营销弹窗

出于营销目的,这类弹窗都会第一时间出现在你面前,直到手动关闭,它的特点就是不用登录也会出现,提高曝光率,便于拉新和转化。


公告通知弹窗

主要是为了将一些重要信息通知给用户,这些信息要么来自一些被触发的事件,要么来自应用开发者的信息,一般在用户登录后第一时间弹出,确保用户不会错过。需要注意的是,在应用的通知中心一般也需要保留这类重要或者高级别的通知,以便用户可以随时查看回顾。



提示类消息弹窗

提示类弹窗是由应用程序主动弹出的消息,主要有三种状态:错误、警告、确认。通常是用户进行某项操作后给出的反馈信息,会中断当前工作流,属于阻塞型提示。



以上都属于通知公告类的“模态弹窗”,特点就是一般不需要用户具体操作,用户将其关闭或者点击“确认”等按钮即代表用户已经接收到该消息,弹窗就完成了它的任务。


2)操作配置(B端应用中大部分的模态弹窗都为这种类型)


简单配置(表单少,操作清晰)


“简单”意义上的弹窗可以理解为只有平铺的表单让你选择或输入,交互清晰明了。比如创建项目、分享链接、更改名称等操作。



标签页弹窗


有些应用的功能配置中有很多复杂的属性,简单平铺的弹窗无法满足需求,需要分层分类归纳,于是从20世纪90年代开始出现了选项卡/标签页弹窗。它的优点是合理利用了空间,也能让用户更好的理解信息层级。


mac os 8.5系统的弹窗(发布于1998年10月)


monday.com的配置弹窗(简洁的标签页)


标签页弹窗的设计必须合理且适度,找到信息之间的因果关系,仔细斟酌并加以连接整理。同时,单个弹窗中的标签页不宜过多,一般不超过五个(动态可增减的标签页除外)。



如果你的标签页过度堆叠,你需要尝试改变交互方式,重新整理信息。一种办法是增加标签页的深度,将能够归纳在一起的内容尽量整合,放置在单个标签页中;另一种办法是拆分信息,分成多个简单的弹窗。


下图中的例子就是第一种办法,整个弹窗有三个标签页,但是单个标签页中又划分了更详细的结构化信息,是一个典型的标签页少但信息量大的弹窗。



流程步骤弹窗


流程步骤弹窗与标签页弹窗接近,区别就是步骤弹窗需按顺序进行,一般上一步未完成之前无法进入下一步,用户注册常用这种方式。


3、非模态弹窗的应用场景


1)属性配置弹窗


属性配置弹窗主要为了让用户改变某一对象的属性,可以是局部属性也可以是全局属性。


属性配置也可以用模态弹窗,如何选择用“模态”还是“非模态”?当你需要让用户实时看到界面的变化或者表单项简单的时候可以选择“非模态”,如果操作复杂或者信息加载比较耗时,则采用“模态”更合理。


下图为实时生效的日期选择弹窗

2)下拉菜单


下拉菜单几乎都是非模态,它的优势明显,没有复杂操作和各种表单,只需要鼠标划过点击即可,快速。


3)消息提示


上文中应用级的消息提示通常是模态弹窗,而非模态的消息提示弹窗则通常从页面的顶部或者右侧弹出,这类弹窗可以长时间驻留在屏幕边缘,也可以一段时间后自动消失。


4)气泡框


点击按钮时,弹出气泡式的弹窗就是气泡框,气泡框可以针对元素进行简单的操作,尺寸也会根据内容大小不一。


5)Tooltips


Tooltips跟上图的气泡框很类似,区别在于Tooltips更轻量,属于页面中最小的弹窗类型,用于功能的提示说明,通常都是文字,背景用深色来与主界面拉开层次。


三、弹窗的设计细节和技巧


1、标题


一般来说,如果是明确的属性配置弹窗都应该有一个标题来说明用途或功能,以及关联的动词来方便理解。比如“创建列表”、“删除列表”、“修改配置”、“配置参数”等,不同标题对应不同的功能场景,前提是方便理解。另外,动词在名词前面或者后面都可以,注意统一规范即可,不要一会儿在前一会儿在后。


标题字号一般比默认文本字号大2px或4px,也有应用为了突出标题,选择使用更大的字号,但大的字号也应该符合文字规范,而不是随意使用。



2、关闭


模态弹窗应至少包含一个以上的关闭方式,常见的弹窗关闭方式有4种:(1)、右上角的关闭按钮;(2)、弹窗底部的“取消”按钮;(3)、弹窗外的任意区域;(4)、一段时间后自动消失。


1)关闭按钮(弹窗外、弹窗内、弹窗上)



“关闭”按钮在弹窗外:常见于营销弹窗,一方面按钮远离弹窗,比较隐蔽,拖延用户关闭弹窗的时间,提高信息的曝光率。


“关闭”按钮在弹窗上:版式设计中有一个“破型”的概念,是一种打破规矩的设计技巧,能让画面快速吸引眼球,所以营销类弹窗经常采用这种设计方法。这种概念可以理解为,我们希望用户关注于被强调的部分,常见的场景就是ios系统批量删除App的时候,应用图标左上角会出现“移除”按钮。这种方式强调了“关闭”按钮,视觉上增加层次外,用户的关闭体验也更佳,减轻干扰性弹窗对用户的负面情绪。


“关闭”按钮在弹窗内:这是应用最广泛最不容易出错的方式,对用户来说,固定在弹窗右上角的“关闭”按钮代表了安全感,在误操作或者想中断操作时我们会自然而然地去右上角点击“关闭”。


2)弹窗底部的“取消”等指令性按钮


弹窗底部的按钮一般有2种功能:(1)、取消或者确认;(2)、进入下一步流程。基于大多数用户右手掌握鼠标的习惯,一般按钮居右下角的设计方式更广泛。这些按钮上的文字大不相同,代表了对计算机的不同指令,但相同的结果都是关闭了当前弹窗。


有些应用也会采取按钮居左的设计,这种方式有一个优点就是减少误操作,让按钮远离鼠标点击热区。



3)、弹窗外的任意区域


这种方式一般用于模态弹窗,除了弹窗中的关闭按钮外,点击弹窗外的任意区域关闭体验更佳。操作配置类弹窗不建议采用这种方式,容易误操作导致正在配置中的弹窗被关闭。


3、字号


B端弹窗的标题字号通常比内容文本大2px或4px,常用字号为12px、14px、16px,14px为默认文本字号,12px为辅助说明字号,也有紧凑型页面将12px作为常规字号。无论选用何种字号,都应跟主界面的字体规范保持一致。


4、排版


左对齐:弹窗中应用最多的对齐方式,适合表单较多的配置类弹窗。


居中对齐:常见于消息提示类弹窗,适合图文结合或者信息较少时的排版方式。


两边对齐:两边对齐的方式让弹窗看起来更规整,适用于平铺的配置类弹窗。一般表单较多的情况下不建议使用两边对齐的方式,一方面左对齐比两边对齐看起来更有层次,另一方面多表单时两边对齐会使弹窗看起来冗长。


除了对齐方式,表单的排列是B端弹窗中最令人头疼的一块内容了,在一些复杂的操作弹窗中,常常包含各种类型的表单,例如下拉框、输入框、日期框、穿梭框以及各种组合模式的表单项,很容易让表单看起来凌乱,也影响了交互操作。


单行一个表单项:常见的表单排列,适用于表单较少的排版方式。


单行多表单并排:在复杂场景中,单行只排列一个表单项会让弹窗超长,因此会采用多个表单并列分布的方式。这种方式存在2个问题:(1)、如果表单的标题长短不一,看起来参差不齐,下图中的表单标题一样长是最理想的场景;(2)、横向距离长,导致弹窗过大。


标题与表单分行排列:越来越多的应用采用这种表单排版方法,这种方法可以兼顾更多场景,可拓展性也更高。这种方法会增加纵向空间的占用,不过眼睛焦点的纵向浏览比横向浏览获取信息效率更高,所以在表单复杂的情况下,相比于上一种方法也是一种更优解。


表单的排版不只局限于一种,我们需要根据表单内容来设计。但是需要注意3点:

(1)、当表单标题长短不一,上下无法等距排列时,我们要尽量将标题和表单分行排列;

(2)、一行不要出现太多的表单项,一般来说弹窗中最多一行排列三个;

(3)、表单的灵活性很强,哪些需要宽度固定,哪些需要根据内容可扩展可换行,我们都要在设计中加以规范说明,多考虑可能会出现的样式问题,提前规避。


5、弹窗尺寸


弹窗是一个容器,容器的大小取决于放置其中的内容物。这里主要讨论场景复杂的对话框的尺寸规范,其他例如Tooltips之类可作为单独的组件在需要的场景直接调用即可。


对话框的大小主要根据内容而定,B端应用中,一个尺寸无法满足所有类型的弹窗需求,所以我们要设定几种常规尺寸,一般可设定为4种:S(通知提示类)、M(配置简单)、L(配置复杂或者扩展详情)、特殊(根据实际情况而定)。pc的小屏幕分辨率为1024*768,所以高度尽量控制在600px以内(除去导航栏、工具栏高度),宽度控制在1000px以内,如果你所设计的B端产品在某个固定的场景中使用,也可以根据使用场景而定,原则就是要让弹窗能够一屏展示完全。


6、设计技巧:巧用sketch组件


这里主要分享一个小技巧,对于弹窗来说很实用。sketch右侧属性面板有一个“调整尺寸“功能,非常适合各种组件化的应用。不同场景下我们会需要不同尺寸的弹窗,有了这个功能,我们不需要每个弹窗都画一遍,只需要创建一组基本的弹窗规范,其他尺寸可以根据所需场景调整。



未调整过的组件不能随意更改尺寸,否则将变形不可用。


创建弹窗组件时,把弹窗里需要固定不便的尺寸参数设置好。(设置方法:靠左的左边固定,靠右的右边固定,对角的靠两个边固定,分割线高度固定,文字图标宽高都固定)。


设置好后的弹窗组件即可在设计稿中随意调整大小,固定参数不会发生变化,因此我们在设计规范中只需要做一种或二三种常见的弹窗样式即可,不需要把设计稿中的每种尺寸都放到设计规范中。


表单同理,在组件中设置好参数后,调用时可以根据情况替换图标、文字和宽高,非常方便。

结语


在B端设计中,随着数据量的增加和业务线的扩大,设计师在设计时,常常需要考虑到交互的可扩展性,我们设计的交互至少要满足未来半年到一年的产品应用。因此作为使用频率很高的弹窗,我们在设计时尤其需要考虑全面,不只为了满足当前的场景,也要考虑未来可能应用的场景。


最后碎碎念一下,这是一篇从2020年跨越到2021年的文章,加上拖延症,写了很久...原本只打算简单的分享和总结,结果越写越多,越写越扩展。其中很多内容是自己在实际工作中遇到的坑中摸索出来的,做个总结也便于自己的成长,欢迎各位大佬们批评指正。


文章来源:站酷  作者:time不休 

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

我最喜欢这五种色彩组合,色号告诉你了!!

之晨

大家好,今天给大家带来的是配色干货系列之第三期!!超级干货!!


前两期地址传送门:

1)用我这套方法,配出来的颜色很难不高级!

2)我常用的3个配色方法,搞定专家级配色!



前面两期,主要分享审美的培养与提升、配色的技巧与习惯。本篇更为实在,主要分析有哪些经典的万金油配色组合,满足日常工作使用。

看完这篇文章,相信你对色彩的掌握,能更深一步~~干货建议提前收藏!喜欢记得给咱们公众号添加星标喔~~


1)经典搭配-黄配黑 

色板 颜色组合 

Yellow & Black

黄配黑的色系非常经典耐看,普适度也很广。我在公众号里写的一些文章,也经常采用这套配色。



这套黄与黑的组合很适合一些生活、社区、人文、情感等场景进行使用,情绪温和。如果你的设计,会被频繁的在这些场景里进行使用,那么不妨使用一下这套黄黑配色试试看。


比如以下这些案例:


这里也给出我经常使用的两组黄黑色板,一组更为活泼鲜艳,更具娱乐化。一组更为内敛,充满文化气息


推荐组合色板①:


推荐组合色板②:



2)科技搭配-蓝黑白 

色板 颜色组合 

Blue & Black

这套色彩就不多说了,蓝色可以说是我非常喜欢的颜色之一了。从咱们公众号的logo,还有日常发文的封面,相信大家就能感受到。



蓝黑白搭配,可以说颜色是百看不腻,并且蓝色色相偏冷,没那么多情绪倾向,所以更能够让人心平气和的阅读信息,提升效率。因此也经常被用到科技、数据、社交、工具等应用场景。


比如以下几组案例:


关于蓝黑白,我也给大家推荐两组我很喜欢的色号组合。一组更为明亮,显得年轻活泼些,而另外一组则更加深沉商务,更为内敛。


推荐组合色板③:


推荐组合色板④:




3)CP组合-红蓝配 

色板 颜色组合 

Red & Blue

这套颜色组合,在近几年可以说是非常流行了。颜色比较浅的,有经典的马卡龙色组合,被广泛运用到年轻社交等工具场景。而颜色重点的,直播娱乐等秀场平台,也都大量可见其身影。




红蓝搭配,颜色的相撞导致色彩充满了热情与朝气,社交娱乐化产品的场景,非常适合这套色彩组合。


比如下面这些案例:



这里也给大家分享两套红蓝搭配的色板,一套略显温柔,另外一套则热情如火。


推荐组合色板⑤:



推荐组合色板⑥:




4)经典国潮-赤金组合 

色板 颜色组合 

Yellow & Black

这几年国潮风格也越来越受到大众所喜爱,而在国潮色彩的搭配中,赤色金色的搭配。一方面红色中国味特色浓厚,而搭配上高档的金色,瞬间浓厚的精致国民画风,就出来了。

比如每年的集五福,就是非常经典的赤金组合,精致的同时,还非常接地气儿。


关于赤金,我也从潘通色里挑选出了一组很经典高档的色彩组合,色板色号也分享给大家。


推荐组合色板⑦:


推荐组合色板⑧:


5)尊显高贵-黑金色 

色板 颜色组合 

Yellow & Black

黑金组合相比其它颜色更显高贵,在很多知名的APP里面,也都是能看得到,比如淘宝的88vip,京东金融的小金库。这套色彩组合往往代表着商务、尊贵,高级,既内敛又隐蔽,通常被用到各类会员、金融等尊贵体系中。


比如以下这些案例


关于黑金里面的金色,也分为两种,一种颜色更为纯金,还有种偏向于玫瑰金,玫瑰金的色彩相对要更温和一些,没那么冰冷。这两套色板,我都分享给大家啦~~


推荐组合色板⑨:


推荐组合色板⑩:



6)其它色彩组合 

色板 颜色组合资源下载 

Yellow & Black


除了我上面分享的这五套经典配色,还有很多其它的色彩组合,也都非常优秀好看,比如上次分享的这些:


这段时间的积累收集,又更新了下面这些新色板


还有很多,就不一一展示了。方便大家收藏,我把这些色彩组合的图片+色板文件,都进行了打包,方便大家直接借鉴这些色彩



文章来源:UI中国     作者:UX小学



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


私域构建的内容场景,是零售业的“人场货”

涛涛

疫情之下,很多零售商都开始经营私域流量,私域流量+传统零售的新模式似乎成为了保持市场增长的新药方,私域流量也对零售业进行了重新改造。本文将从三个方面对此展开分析,希望对你有帮助。

研究零售行业中的私域流量,有一个问题值得思考:是什么刺激了零售私域流量的发展?

今天,市场上移动互联网的流量红利消失,线下端人口红利的消失。包括零售业在内,大部分行业的市场性质,已经从增量市场过渡到了存量市场。

整个存量市场中,依赖过去传统的获客方式,获客成本在不断升级,导致商户之间的竞争激烈。即便各个平台之间没有形成自己的流量壁垒,各个商圈中的区位没有形成垄断。成本的不断升级,最终还是会刺激私域流量取代传统的获客,成为一种市场成交的新方式。

私域流量作为存量市场的产物,进一步得到发展的趋势非常明显。

一部分原因是受到了零售商品的属性影响,大部分的零售商品都是针对特定的用户人群需求设计,服务定向人群为主。所以大部分的产品有针对性,买一次A商品和买十次A商品的人,大概率是同一批人。

因为这种情况,让一个新客户买一次产品的成本,是要比让老客户再多买一次产品的成本,高得多。

增量时期,大部分商家都没注意老客户的运营,当产品慢慢触达到了市场边际,积累了一定的市场体量后,下个阶段更具有性价比的方向,就是前期一直被忽略了的定向人群的精细化运维,可提升复购性。

零售行业中,传统模式的消费者和商户的接触,往往是离不开:人、场、货的。同时一片区域内的线下超市和商店,只能服务这块区域的客流量,存在地域流量壁垒。

传统零售,消费者如果不去店铺、超市里面,看不到商品的陈列,就可能不会买牛奶、买饮料,就没办法形成交易发生。所以传统零售通过总代、分代、批发商,到零售商,开更多的线下店铺,打通更多的线下代理渠道,实现获客和成交。

但是私域流量+传统零售的新模式,会让市场重新审查传统零售人货场的模型。让重点经营的方向也会瞄准老客户线索的激活和运营,让老客户复购和带新。

私域流量对零售行业的一些影响

购物场景从线下(低频率)转到线上的可重复性。

私域流量模式内,用户和商户之间的触点发生了改变,从线下迁移到线上。实体场景代入了内容场景,没有实体店,照样可以卖东西。

1. 零售行业的私域流量,朋友圈的内容文案即终端,内容营造的场景即门店

从一开始的人、场、货模式,变成了一种可重复性的“叫卖”模式:一个消费者在社群中、朋友圈、小程序看到了信息推送,正好刺激了购买欲望,就会产生交易。生意的本质是人与人之间的供需链接。传统零售和消费者的“触点”是线下店,私域流量+零售的模式的触点是线上的方式。

类似企业微信这种线上的方式,就帮助商户绑定了客户线索。不仅是缩短了商户和消费者之间的距离,这中间还带有社交属性,帮助客户更好地了解消费者需求,做好用户需求的细分。

这种逻辑我们叫做“触点营销”,和用户做朋友,让熟人关系变成卖货的渠道。

触点,是商户和消费者之间接触点,通过接触点传递信息和提供服务。(现在线上端习惯,用社群链接和服务消费者)

比如现在热门的社区团购,是私域+传统零售的典型模式。

原来小区小卖部的老板,观察到小区的住户每次都嫌弃买菜的时候,耗时长、不新鲜的问题,于是自己做团长经营私域流量,建立企业微信拉了一个买菜群,帮助小区住户们“便捷买菜”

因为更加近距离的服务住户,老板还可以记录自己老顾客的喜好,做好SCRM的标签处理:

  1. 买菜的频率
  2. 买米的频率
  3. 买油盐酱醋茶的频率
  4. 家里几口人
  5. 平时买什么类型的菜会多一点

一段时间之后,老板可以提前几天进行这些日用品货物的销售,给住户发一条信息:“你好邻居,今天的猪肉6折,刚从XX现宰的,你看要给你留一点吗?”这就是利用企业微信这线上端的触点联系,建立可重复性的模式。

这是传统零售很难做到的,因为传统零售没办法更近一步的接近消费者,所以自己手里是拿不到相关的数据,于是只能把钱都用在优质广告位、优质区域位上,抢占消费者的视野。

那些年为了公域流量疯狂烧钱的平台:

2. 决策形式从重度决策转为轻度决策

传统零售场景中,消费者买东西要么认功能,要么认牌子。但是私域模式的零售场景就不一样,今天的消费者情感消费颗粒度比以前更细,决策情况在发生变化。

  • 传统零售的决策考虑是:功能消费+品牌消费。
  • 新零售的决策考虑是:功能消费+情感消费+内容消费+服务消费。

情感和服务因素,会使决策发生的更加快。你身边的朋友和普通一个销售,向你推荐同样的一个物品,正常情况下,你选择相信你朋友的概率是要大过于选择销售的。

还是用小区小卖部老板的例子,当老板服务多几次住户的时候,老板和住户之间的信任程度会慢慢上升。(情感消费)

老板了解到消费者的采购米的喜好,可以尝试给他推荐同品类,但是高单价、味道好吃的大米。在有原来信任基础的前提下,肯定是有部分消费者愿意尝试下,因为消费者追求“美味”的需求比较大众化。

这种时候消费者的决策程度会由重度决策转向轻度决策,一句话概括就是:你办事我放心。

私域流量中,客户和商户的联系变得非常密切,人即流量,关系即渠道,熟人变熟客。虽然要成为好朋友这个门槛比较难,但是在消费者的决策中,中间的情感因素会影响到消费者的决策。让决策变的更加的轻度。
重要的是,信息触达的成本也降低了很多。据「加一私域」官方统计:以大众客户运营每年发12次短信类比,同样100万私域客户的群发触达每年至少节省20多万元营销成本。再加上朋友圈运营,每发送一条朋友圈价值3-5万元(按腾讯朋友圈广告1000人曝光 / 30 – 50元为例计算)

3. 消费场景从消费者找货的模式,变成货找消费者

消费者在对商品进行购买决策的时候,有一个很大的通病:选择困难症。所以在传统的零售中,商品的陈列摆放也成了一门学问。贵的、销售额好的基本上都放在了展架的上面的位置。

同时很多的零售厂商为了博消费者的眼球,各种商品的包装也是非常讲究的。

这样做是为了让商品,第一时间出现在消费者的面前,提高成交转化的概率。大部分的消费因为有选择困难症,往往第一眼被看到的商品,这些商品的成交率比较高,这就是商品的“C位”效应。

在私域+零售的模式中,没有了线下店铺,内容是私域中商品的唯一的展柜。通过内容构建一个消费场景,实现“货找人”模式。

像很多的微商的朋友圈内容,就是构建这样的“货找人”场景。朋友圈和社群中的场景,营造的是一种“即时成交”,通过内容构建一种“冲动型的消费场景”,让交易的发生短、平、快(时间短、速度快、产品平民化)

私域模式中“货找人”,就要站在客户视角,与人近,就会离增长更加近。私域流量模式不是要一下干件大事,而是做对一系列小事;要做对一系列的小事,就要不停的细分,挖细节,挖每一个和消费者接触的点。

文章来源:人人都是产品经理  作者:阳俊Orlo

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


产品经理该如何把业务需求变成产品方案

涛涛

产品经理日常工作中最常听到的词就是需求,而产品经理的核心工作也就是把需求变成可使用的产品。那当我们接到需求时,我们是如何把它转化成产品呢?本文将从七个方面进行分析,希望对你有帮助。

一、对“需求”这个词的理解

首先我们先了解一下,在产品开发过程中所沟通的“需求”到底指的是什么。我们先举几个我们工作中常常听到的需求:

  • 老板:现在经营效率太低了,我们要上个系统,提率(目标需求);
  • 财务:每笔费用报销都要走审批,加强对费用支出的管理(业务需求);
  • 运营:日常经营数据需要支持导出功能,好进行加工分析(功能需求)。

我们可以将平常听到的需求都归为这三类,产品经理需要做的就是将目标需求和业务需要转化为产品方案,然后交付给开发团队。

接下来我们将以羽毛球馆订场地这个业务需求,来拆解一下整个过程,看它是一步步变成产品方案的。

二、定位业务问题

场馆运营部门提出一个需求,我们需要实现线上订场地。

业务需求的提出,肯定是为了解决某些业务问题。通过调研,现在纯线下订场的方式存在以下问题:

球友:

  • 想运动,但不知道哪里有合适的场馆?
  • 不知道场馆是如何收费的?
  • 场馆有没有空闲的场地?
  • 场馆的有哪些项目?有没有停车场、淋浴等设施?

场馆:

  • 球友打电话过来,询问场地价格和空余等情况耗费时间;
  • 新球友订场交定金麻烦,不交定金又可能爽约,造成场地未预定出去的损失;
  • 人工登记场地预定情况,易产生失误,导致一场多订等情况,极大影响客户体验;
  • 场地预定情况很难统计成分析数据,对运营决策无法提供帮助;

业务问题定位了,后面的设计就要围绕这些问题展开,设计完后要回过来看有没有解决这些问题,否则一切都是徒劳的。

三、梳理业务流程

流程是产品设计的关键,梳理流程能让你对整个过程更清晰。梳理过程前,先要明确下订场有几个场景,因为每个场景的流程可能不太一样。通过调研和分析得知,订场主要有以下几种场景:

  • 线上订场—球友在微信或者APP上订场;
  • 线下订场—球友直接到场馆前台临时订场;
  • 电话订场—打电话给场馆前台,让前台预留场地;
  • 长期球友固定订场—有些企业会固定在某个时段订场,比如周三的18:00~20:00,一次预订即可,定好有效期,不用每次临时预订;
  • 包场—企业搞团建时会包下整个场馆;

这里就要思考一下,我们这次设计是否要满足这5个场景呢?我们回到定位业务问题这一步,问题都是在想要运动的球友在订场时存在的,而方式e在线下的处理暂时并没有多大问题,再深入一步调研可了解到,包场都是直接线下谈好价格,这个价格也是可浮动的,然后将钱线下转给场馆,放到线上反而不灵活,所以我们就先不考虑线上实现这个场景。

Tips:产品经理需要学会做减法,并不是把线下所有业务搬到线上来,开发出来后发现并没有什么用,又浪费这么多资源。

将待实现场景确定下来后,我们需梳理每个场景的业务流程,这样才能对整个过程清晰。因为我们这次只是讲方法,所以就只拿场景a来举例,继续下面的分析过程。

我们梳理出线上订场流程图后,这时我们需要分析一下,这些环节哪些需要做到线上?

入场前:订场、付款、锁场肯定是需要做到线上的,产品的目标就是为了解决订场效率低的问题;

前台接待:出示订场凭证、校验订场凭证、开灯、放行这些环节并没有太大的影响效率。出示订场凭证、校验订场凭证可通过报手机号的形式解决。开灯和放行涉及到智能灯控和智能闸机的对接,没有这些东西业务也能跑的通,也能正常营业,这期也先不考虑在线上实现;

入场后:到点提示也涉及到智能设备的对接,先可人工提示。

Tips:产品经理需要定义需求的优先级,先把影响业务正常运行的问题解决掉,再来迭代优化。

四、梳理业务规则

业务规则是运营部门为使业务正常运行而定义的,就算没有系统也是存在的。产品经理需要做的是把这些业务规则梳理出来,然后用产品的语言把它描述出来。还是以线上订场举例,场地什么时候可以订?订的时候有没有时间限制?价格会由哪些因素影响?可不可以退场?会员有没有什么特殊权限?这些规则听着是不是很乱,这就需要产品经理一条一条梳理清楚,梳理规则的同时还需要多问为什么要这样做呢,一来以后方便和开发等同事说清楚为什么这样设计,二来也能加深自己对业务的了解。

通过调研我们梳理出以下预订规则,但我们需注意以下两点:

  • 这些规则都是比较容易通过调研得到的,还有一些隐性的规则,调研的时候很难得到,可能在产品上线一段时间后才能想到。例如订场后要在一定时间内支付,不支付就将场地变成空闲状态。产品上线后这种规则缺失一定会暴露出来的,但产品经理最好能提前考虑到这种规则,尽量避免损失。
  • 这些规则仅仅为一个场馆的规则,为将产品的适用更多的场馆,也为防止以后场馆的业务规则变动,尽量做成可配置的。

以上只列举了线上订场的预订规则,还有退订规则、价格方案规则、会员权限等规则都需要一条一条梳理出来,这里就不一一列举出来了。

五、绘制原型

业务流程和业务规则都梳理出来后,就可以画原型了。这一步对产品经理来说,即简单又困难。简单是因为去想象具象的软件操作比思考抽样的业务逻辑更容易,难是因为画的原型最终要符合业务流程和业务规则,并且还要符合常规交互原则。

从业务流程分析,整个订场环节涉及到球友和场馆,那肯定要有球友订场端和场馆管理端。球友订场端刚开始也没必要做APP,做个H5放在微信公众号就可以了,还能引流到公众号。确定好用什么来实现后,我们要梳理一下线上订场有哪些页面,不要想到一个画一个,这样很容易漏页面。


Tips:刚开始设计原型时,尽量不要添加一些和主流程无关的页面,比如你觉得别人做了个VR查看场馆,你也要做一个,但是前期最重要的是把业务跑通,再来添加一些附加功能。

工具类产品原型设计多参考一下美团、淘宝等移动端产品,因为移动端产品发展到现在,已经培养了用户的操作认知,我们不用去发明轮子,让用户再重新去学习。

六、可用性测试

产品的原型出来了,可以给客户演示,让客户跑一遍整个流程,看先前提的业务问题有没有得到解决。如果有问题,再进行调整。其实让客户跑一遍流程也不能发现所有问题,只有在真正使用的时候才会暴露出问题来,但这一步也是不可少了。

七、撰写PRD

PRD全称为Product Requirement Document,中文名为“产品需求文档”。其核心目的是帮助开发、测试、运营、产品人员理解该需求的背景和具体要求,减少产品实现过程中诸多不必要的重复解答,从而提升整体项目推进效率。当业务规则、业务流程、原型图都出来后,我们需要把它交付给我们的开发团队去实现,交付的形式就是PRD。这里就不阐述PRD怎么写了。

八、总结

当接到业务需求时,变成产品的过程是:

  • 定位业务问题;
  • 梳理业务流程;
  • 梳理业务规则;
  • 绘制原型;
  • 可用性测试;
  • 撰写PRD。

以上只是个理想化的流程,产品经理并不是写完PRD扔给开发就没事了。包括后面的需求评审、跟进开发进度和问题、测试上线、迭代优化等,都需要产品经理主导。

文章来源:人人都是产品经理  作者:康力文

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


2021-02篇 | 产品设计细节剖析,让你看看大厂是如何做设计的

前端达人

2021年产品体验日记,小目标365节,第016~030节。

前言


在互联网产品日趋成熟的今天,APP同质化越来越严重,使得设计不够精致、没有气质及品牌感。一个设计精致APP不应漏过任何一个细节,美观、可用和的界面设计都需要花费大量的时间从细节上去打磨,并从多方面钻研并创造出打动人心的UI/UE设计。





2021 | 第02篇分享目录(016~030


016.「QQ」手势力度决定页面展示范围

017.「高德地图」地点打卡-未来回忆曾经的足迹

018.「优酷」会员转化-击溃用户最后一道心理防线

019.「网易云音乐」播放中的歌曲快速定位

020.「boss直聘」多个入口-简化二次操作流程

021.「菜鸟」备注-快速找到列表中的包裹

022.「虾米音乐」符合产品特性气质的标签栏

023.「QQ音乐」触手可及的选择性MV播放

024.「微信读书」提升操作效率的进度条控制

025.「哔哩哔哩」信条-承包笑点的逆向弹幕

026.「淘宝」应对意外退出的通道

027.「微信」行为预判-提升操作效率

028.「抖音」搜索-抚慰每一个被情绪困扰过的灵魂

029.「京东」送礼物-更是一种神秘和惊喜

030.「叮咚买菜」一顿吃光-减少食材的浪费问题





016.「QQ」手势力度决定页面展示范围


产品体验:

QQ聊天的表情列表版块,系统会根据用户上滑的力度来确定表情选择区域的大小,力度越大,列表区域占比就越大,同屏可供选择的表情就越多。

设计思考:

经常使用QQ表情包的用户都知道,其更新频率非常快。比如社会上的最近发生的大事件、互联网当前流行的热词,甚至在疫情期间,凡是跟疫情相关的表情包都在不断变化,从开始的安全防护到后面的线上办公等,以至于深受广大用户的喜爱。

QQ的表情功能其中还有一个细节,用户在选择表情时,系统根据向上滑动的力度来确定表情区域所展示的范围。滑动的力度较大时,考虑到用户可能需要在更多的表情包中选择的情况,固增大显示的区域,便于用户在同一屏界面中可浏览的范围更大,同屏展示更多的表情包让用户在更短的时间内找到自己所需,所见即所得,对用户进行的定性操作十分友好,从细节处理方面提升了用户体验。





017.「高德地图」地点打卡-未来回忆曾经的足迹


产品体验:

在高德地图的足迹功能里,可以对我们所在的地点进行打卡,系统就会以亮光形式显示我们去过的城市,并留下“✔️️”标记,点击可以查看自己的打卡时间和具体位置。

设计思考:

我们在高压的生活下及忙碌的工作中,曾经去过很多地方游玩或者路过,随着时间不断的流逝,这些都成了模糊的记忆。当有一天静下心来细想,好想去过的地方很少,甚至回忆不起来。

高德地图APP的足迹打卡功能可以帮助我们记录所去过的每一个地方,分为自动和手动打卡。在设置中开启自动打卡后,当用户使用导航的目的地属于名胜古迹、美食地标建筑等类型的地点,导航结束后,即可自动完成打卡,如有特别需要,还可以通过手动打卡记录每一个点。打卡功能虽然在表面上并非用户硬性需求,但在未来的某个时间看到自己曾经的足迹时也略表欣慰,还可以满足部分用户的虚荣心,也许在无意间就能抚慰认为自己去过的地方太少、较为伤感的幼小心灵,给与温暖的安抚与力量。





018.「优酷」会员转化-击溃用户最后一道心理防线


产品体验:

优酷普通用户在看影片前面的广告时,倒计时后面会提示xxx元可关闭广告,广告下方通过展示会员特权以鼓励普通用户升级会员,且定时滚动展示刚刚已加入会员的文字提醒。

设计思考:

不管哪个影视平台,无论何种设备,非付费会员用户在看影片前都需要先经过长达几十秒的广告,这是任何人都无法避免的一堵墙,广告除了可盈利之外,还能起到激励普通用户开通付费会员的用处。

优酷视频激励普通用户开通会员的的手段可谓是拍案叫绝。

①、利益引诱:在广告倒计时的后面直接展示开通会员的金额, 通过优惠等利益刺激手段,吸引用户继续完成对产品的消费。较小的金额可以降低用户的经济成本,同时增加用户对会员价格的心理接受程度,减少其防备心理,有很大的几率吸引用户产生开通会员的动机,促使用户行动增强转化(除了首次开通连续付费业务,所付出的金钱成本较低外,其他情况下价格并无优惠,不过一旦让用户产生了付费动机,这些都是后话);

②  、增加说服力:  广告下方罗列了部分比较重要的会员功能,围绕开通会员后的特权并强调效果,以此证明会员内容的质量与真实性,吸引用户去了解,为用户增加开通会员驱动力;

③、羊群效应:提示****刚刚加入了会员,利用从众心理,因为用户的想法和行为容易受到周围人们的影响,往往会胜过自己的理性认知。通过前面的用户已做了前驱和后盾,不断的引导和刺激用户去开通会员(羊群效应在现实生活中遇到的很多。比如:大部分用户出去吃饭,对空无一人的饭店没有动力,往往会选择里面已经坐了一些人的店铺;走在外面,哪里围的人多,就想挤进去看个究竟)。





019.「网易云音乐」播放中的歌曲快速定位


产品体验:

在网易云音乐播放当前列表的歌曲后,当界面存在上下滑动的操作行为时,右下角会出现定位图标,点击可直接定位到正在播放的歌曲位置,如无任何操作,3秒后图标自动消失。

设计思考:

我们在听歌时,如果是无目标的行为,基本都会进入到某一个类型的列表或收藏歌单,进行顺序播放,比如飙升榜、新歌榜等。如果有兴趣,可能会在列表中上下滑动来看看是否有自己熟悉的歌曲,等最后要回到正在播放的歌曲位置时,就尴尬了,需要花费更多的时间来找到,在自己收藏的歌单中就更不用多说了。

网易云音乐在歌曲列表中增加了快速定位按钮,当系统检测到正在播放的歌曲列表中有滑动操作时,图标会自动出现,点击快速定位播放歌曲位置,方便快捷、省时省力。如果你的歌单中添加的歌曲太多,又无法找到播放的歌曲时,不妨试试右下角的定位按钮吧,此功能真的很人性化。





020.「boss直聘」多个入口-简化二次操作流程


产品体验:

在boss直聘求职关键词页面,单点复选框选中/取消,底部同时提供已选中关键词,可进行单个删除或通过左下方的清除按钮一键删除。

设计思考:

在用户的常规认知里,选项条件为数不多的复选框操作都是单点选中/取消,这种操作方式基本也成了用户的惯性思维,若站在用户体验角度深挖细节的话,即使是大众用户都认可,其实也没有最好,都还有上升的空间。

boss直聘的求职关键词选择,在这方面就做的更好,除了常规的单点选中/取消外,其底部还提供了已选中的关键词条,用户可在小范围内清楚的知道已选中的内容,让需求更加集中,便于进行统计、对比或删除等操作,避免在页面多个目标中寻找而增加时间成本。另外左下角还提供了清除按钮,需要重新选择目标的用户,可一键删除,节省了之前多次点击的重复步骤,简化二次操作流程。





021.「菜鸟」备注-快速找到列表中的包裹


产品体验:

菜鸟的包裹列表,左滑其中的一个,可通过包裹备注修改名称,方便用户在包裹较多时有目标的查看。

设计思考:

网购已成为用户的日常习惯,没事的时候淘宝逛一逛、京东走一走、不急用的就在拼多多砍一砍。但网购平台何其之多。我曾经碰到过这种情况,在不同的平台都买了商品,其中有急/不急用的。最为难熬的就是等待物流了,频繁的奔波于各大电商平台个人中心的订单页面查看最近物流状况,步骤繁琐不说,还浪费大量的时间,手机差的还会闪退卡顿,相信这也是很多网购用户的苦恼,直到菜鸟包裹的出现......

菜鸟定向的集合各大物流平台的包裹数据,通过手机号码,将单个用户的包裹归类到一个地方,非常方便。在使用过程中,还有一个很友好的设计细节,包裹名称备注。在包列表中,可选中其中的一个包裹左滑,对名称进行备注,便于用户包裹过多时需要对其中部分包较急的包裹进行频繁的查看,备注之后一目了然,能降低因误点造成重复操作的可能性,快速找到想要的包裹,方便用户有目标的查看。





022.「虾米音乐」符合产品特性气质的标签栏


产品体验:

虾米音乐顶部标签栏的选中状态,文字放大的同时配合一段起伏较大的音频波纹动效,彰显行业产品特性。

设计思考:

标签栏是APP界面中较为常见的控件之一,在视觉表现方面,只有选中、未选中两种状态,其设计也比较简单,通常会在文字颜色/字重大小上进行变化,标签下方加上小长条来区分两者的状态,用户对于这种表现方式也是高度认可的,如果不想被同质化,未在细节上下足功夫,就很难设计出彩。

虾米音乐的标签栏选中状态除了文字大小对比非常明显外,下方是一段音频波线动效,跳脱出较为常见的设计规范限制,从行业属性中获取灵感,把用户在现实世界中物理认知的“声波”形象来源作为产品特性,提取出具有独特气质的视觉音频波纹样式替代选中状态的小长条,这样能建立起视觉上的联系,让用户产生由内而外的一致感受,既有设计感又符合产品特征。





023.「QQ音乐」触手可及的选择性MV播放  


产品体验:

在QQ音乐播放页封面图的右下角,会显示该歌曲相关的视频数量,点击则展开视频列表,通过左右滑动选择想看的视频,可直接进入视频播放。

设计思考:

有人说:听音乐是一种情绪,也是一种心情,能从不同类型的音乐中听出共鸣,去发现一些事物的美好。当我们发现自己喜欢上一首歌曲时,有没有想打开该歌曲MV一睹演唱者的风采,或者边听边看去感受歌曲意境和内容所带来的一些理解上的辅助。

QQ音乐将歌曲的MV展示在播放页封面图片的右下角并提示数量,近在咫尺,便于用户在听歌的过程中对视频选择性的播放。一般音乐类型的应用在都是一首歌对应一个MV入口,需要先通过页面的跳转才能对视频进行选择,QQ音乐的这种交互路径能避免用户在听歌过程中选择视频时造成中断,通过左右滑动选择想看的视频,选中即可直接进入视频播放页,优化了操作路径,减少操作步骤,触手可及且不打断沉浸式的音乐享受。





024.「微信读书」提升操作效率的进度条控制


产品体验:

打开微信读书的进度控制条,点击游标左右滑动,除了页面内容变化外,进度条上方会显示当前页码/总页码,并提示章节及标题;长按游标可单独对书本的页码进行精准化的切换。

设计思考:

读书就是和世界各个行业的人物进行一对一交流的过程,如果想通过读书收获成长,就要靠自己看书、学习、思考,并把知识用到自己的工作和生活中,不断让自己做出改变,因此也诞生了很多读书类型的应用,线上看书不仅能适合多样化的环境,还能节省经济成本。曾经有人感慨,电子书是线性的,而纸质书是立体的,想看前面有联系的内容就可以随时返回去再读,而电子书只能通过目录和书签来解决,要经过多次的操作和页面的跳转,且书本的内容都是通过数据传输、每次都要刷页面才能看到内容,有可能会打扰用户看书的思路,相对纸质书籍,看书效率和吸收程度就低了许多。

其实并非全是如此,微信读书考虑到体验方面,针对用户在读书过程中可能出现的前后频繁翻页的问题,在进度条控制细节上做了很多便捷化的设计。用户可通过点击或长按控制条上游标,根据自己的实际需求进行前后长/短距离的滑动,就能轻松满足自己所需要的页面转,并伴随明显的小窗文字提醒。此功能相对纸质书籍虽然不能堪称完美,但足以解决用户线上读书时最基本的需求,让操作流程变的更加简单,大幅度的提升了操作效率,节约时间成本并提成产品的易用性。





025.「哔哩哔哩」信条-承包笑点的逆向弹幕


产品体验:

在哔哩哔哩看《信条》电影,播放到时间发生逆向片段时,弹幕的文字及方向也发生逆转,即逆向弹幕,两者结合在一起非常应景,网友几乎被“惊掉下巴”。

设计思考:

有很多用户喜欢开着弹幕看视频,弹幕有可能是视频内容的良好补充,大部分视频是不能牢牢抓住观众,也不需要观众死死盯着看的。各种神弹幕、刷屏本身就是内容的重要组成部分,所以看着弹幕可以给我们在看视频的过程中带来更好的氛围及愉悦的体验(部分不爱开弹幕的用户除外)。

最近被一个脑洞的弹幕方式吸引到了-逆向弹幕。B站在《信条》电影里隐藏了一个很有趣的彩蛋,正负时间线穿插(片头也逆向了)的情节发展,设计了让人惊艳的逆向弹幕,跟电影的逆向片段组合在一起时非常应景,神奇且趣味化的弹幕方式让用户几乎“惊掉下巴”,看完电影后仍能记忆犹新。有人直言“当时在电影院看完信条后,是不是倒着走出来,影院就把买票的钱给退了”。





026.「淘宝」应对意外退出的通道


产品体验:

在淘宝的其他功能页面发生闪退或意外结束应该进程时,再次进入首页,会提供“打开上次访问的页面”的快捷入口,如无需要,几秒后入口自动消失。

设计思考:

智能时代,每个人的手机中应该都装有不下几十个APP软件。当我们正沉浸在某个APP当的内容时,因设备或其他原因意外的结束了应用进程,当再次打开时,需要凭借自己的记忆多番操作才能回到原来的内容处,甚至永远无法找到,为此真的是很苦恼。

淘宝针对软件意外退出的情况则留了一手,当用户在使用过程中,APP因意外情况退出时,下次进入,可通过首页提供的“打开上次访问的页面”入口,快速回到原先失踪的页面,再也不用担心内容丢失了,看似一个简单的入口,但通过细微的改进能给用户带来更好的操控感和易用性,便于用户通过短时间记忆还原。





027.「微信」行为预判-提升操作效率


产品体验:

我们在手机的其他界面发生截图行为时,打开微信对话框的工具栏,系统会把刚刚截取的图片以缩略图的方式展示在右侧,暗示询问用户是否有发送此图片的需求,几秒后会自动消失。

设计思考:

我们不管使用何种应用,在交流过程中有发送图片的需求时,除了应用本身提供的图片之外,其他都绕不开系统相册功能。如若深究用户体验,进入相册的操作路径是可以减少的。

从微信对话框页面打开工具栏,如在相近的时间内系统检测到有截屏行为时,会把刚刚截取的图片以缩略图的方式展示在屏幕右侧,点击即可发送,通过行为感知并帮助用户解决可能有发送此图片的需求,提前预判用户的操作,以提升选择效率。若无此需求,几秒后自动消失,丝毫不影响用户的其他操作。





028.「抖音」搜索-抚慰每一个被情绪困扰过的灵魂


产品体验:

在抖音搜索较为极端且消极的关键词时,比如:抑郁、服毒、不想活了等,系统会出现较为温馨的爱心画面,并通过情感化的文案鼓励以及提供心理援助渠道,以此来提高用户的积极情绪。

设计思考:

人们通常会借助于欢乐、开心来表达自己的愉悦,同时也会面临悲伤、忧虑的情况,需要表达心中的苦闷。如果没有得到有效的疏解、排遣,使得内心一直处于郁闷状态无疑是很糟糕的。尤其是目前处于高度压力下的年前人群,在环境因素、心理与生理创伤、家庭环境等情况的影响下,导致一些人因为心中的苦闷,得不到很好地宣泄、发泄,走上了极端的想法,其解决问题的方式不管是线下、线上都是从心理上入手。

抖音APP在面对极端且消极的关键词搜索时,并非跟其他应用的搜索结果雷同,而是以情绪激励的统一样式展示结果。首先通过温馨的爱心画面缓解较为消极的用户情绪,并通过积极正向的文案鼓励用户;其次,基于用户在心情低落时要得到安慰或鼓励的需求,平台提供了心理援助热线以及消极心理的疏导建议,帮助用户进行缓解或改善消极行为。作为一个短视频平台,虽然没有明确的义务去抚慰用户,但这种做法可以用温暖的方式传递爱与力量,也抚慰每一个被情绪困扰过的灵魂,让用户感受到亲切放松的氛围,是巩固用户粘性与忠诚度十分巧妙的方式。





029.「京东」送礼物-更是一种神秘和惊喜


产品体验:

在京东商城购物礼物时,可以通过商品详情页的“送礼物给TA”,节省很多中间步骤,直接在线上完成包装、贺卡、寄语和快递等“一条龙”服务,将礼物送到对方手中。

设计思考:

部分用户在特殊情况下,都有送礼物的小习惯,不管是礼尚往来、男女朋友还是送基友,有时甚至不需要理由,只想把最好的东西送给TA们。这时候可能去会店里(线上/线下)买一个对方喜欢的东西,然后经过包装+寄语,再快递给对方,因为整个流程的复杂,有时候不可避免会出现一些突发性的状况,难免造成尴尬。

在京东APP购买礼物则省去了一些列的麻烦,只需要选好礼物,即可完成从包装、贺卡、寄语和快递等“一条龙”服务,免去不必要的麻烦以降低出错的可能性,将操作流程和路径都进行了简化,让整个送礼的过程更。通过选择合适礼物的包装风格,制造出礼物的神秘感,送出的不仅仅是礼物,更是一种浪漫和惊喜。





030.「叮咚买菜」一顿吃光-减少食材的浪费问题


产品体验:

在叮咚买菜分类的“一顿吃光”列表中,菜品会根据专业厨师建议一顿的常规用量进行组合搭配包装,包括分量较小的调味品类也进行了小份装的贴心组合,避免食材偏多造成浪费或损耗。

设计思考:

“一粥一饭,当思来之不易”,勤俭节约,珍惜粮食是我国的传统美德。随着互联网带来的便利,很多人足不出户便可在线上平台完成食材的购买,但买菜也存在的很多困扰,比如买少了不够吃,买多了又浪费,没有一个确切的方案可以让买的一顿食材刚刚好,因此会造成食材的浪费和更多的金钱成本。

叮咚买菜推出的“一顿吃光”栏目,用倡导勤俭节约的用餐理念与生活方式,筛选出用户经常购买的食材搭配,再根据专业厨师对食材配比,进行分量、包装及动态调整,以最大化满足消费者需求,减少食材的损耗,在很大程度上解决了买菜很难确定食材分量的问题,不仅让用户每餐都吃得新鲜健康的同时,尽可能地减少食物浪费。





结语:


设计师需要养成体验产品的好习惯并将优秀的产品细节记录下来,加强自己的记忆,不仅能提升自己的语言组织和总结能力,也为日后输出优秀的作品当铺垫,对自己的能力提升以及未来的职业发展带来便利。


本期产品设计细节分享结束,我们下期再见。




转自:站酷

作者:大漠飞鹰CYSJ


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

2020工作项目-小程序设计

前端达人

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



转自:站酷

作者:chuting97


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

mg动效练习

前端达人

mg动效练习

收藏
收藏
收藏



转自:站酷

作者:眼中英雄梦


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

体验度量专题|易用度在企业级中后台产品的探索和实践

鹤鹤

作为产品设计者,经常遇到一个备受灵魂拷问的问题:怎么衡量我们设计的产品,用户体验是过关的?

今年,我们在内部中后台产品进行尝试,发现「易用度」可以作为合适的度量指标,并成功推广到 35 个产品,帮助PD、设计师、工程师等产品设计者去衡量产品体验现状,发现改进机会点。实践证明,易用度,相比满意度、尖叫度、NPS,更适合技术类产品的体验度量。结合用户行为数据,可以为用户画像、改进方向、运营策略提供更准确的决策依据。


1. 中后台体验度量现状


在公司内部,技术类产品种类繁多,有很大一部分是开发、运维人员使用的中后台产品,且以从 0-1 阶段为主。由于这部分同学本身工作复杂度高,又必须依赖内部产品来完成,所以长期以来“简单易用”成为大家追求的产品体验标准,他们也把“如丝般顺滑”作为终极目标。但现实情况是, 上手门槛高是使用技术类产品最大的痛点。 

对于前台业务的设计者,经常会使用「人+钱」,也就是「流量+付费」来衡量产品效果。通过成功率、转化率等指标,可以快速看到用户行为上的反馈,来指引后续优化。但对于技术类产品,尤其是强流程、工具型产品,很难找到一套契合业务特点的度量方式。理论上,使用「成本+效率」是比较合适的衡量维度,实际操作下来,找到设计和产品效果之间的因果关系,并非易事。 

我们做了一个内部调查,发现产品设计者经常容易遇到这些问题: 
  • 体验度量是一个绕不开的话题。天猫、阿里云、华为、京东都有尝试提出解决方案,但没有统一的衡量维度。 
  • 设计方案与产品的市场反馈,需要一个可以解释关联关系的抓手,这对迭代方向的指引至关重要。 
  • 产品团队逐渐重视用户用户,但缺乏有说服力的指标。 

业界在体验度量上的方案,大致分为 3 个派别: 
  • 客观衡量法:通过数据埋点监测用户行为数据。例如经典的 PULSE 模型,还有大家熟悉的运营指标,活跃用户数、留存率、ARPU、LTV等等。这对于还未商业化、用户基数少的产品不适用。 
  • 主观衡量法 收集用户主观打分。经典的满意度、尖叫度、NPS,可用性测试量表(如SUS),美国客户满意度指数ACSI。 
  • 主观+客观衡量法:把用户行为数据和主观打分结合起来,多数用归一化方式得出一个总分,把分数划分成不同档次作参考。Google 经典的 HEART 模型,内部 的 PTECH 模型,阿里云 QoUE 模型 ,华为云的用户体验模型。 

在掌握了这些信息之后,我们在内部的技术类产品上,进行了一轮新的探索。经过半年时间的试点,结合业界的解决方案、内部产品的业务特性,我们最终选择主观衡量法,并使用「易用度」这个衡量指标。


2. 易用度指标


易用度,英文 Customer Effort Score ,简称「易用度」,也有译成「费力度」,指的是用户使用某个产品/服务来解决问题的难易程度。目的是 消除或减少用户使用产品过程中的障碍。


该定义来自 2010年 《哈佛商业评论》发表的文章《Stop Trying to Delight Your Customers》。2013年,Gartner 子公司 CEB 发布易用度2.0版本的测量方法,定义为“解决问题的难易程度”(make it easy to handle my issue)。 

它的源头可以追溯到美国用户研究专家 Jeff Sauro(2009)提出的单项难易度问卷(Single Ease Question,SEQ),在可用性测试之后,用户需要对一个问题进行打分,问法是“整体上,这个任务是非常困难-非常容易(7分制)”。 

为什么说「易用度」更适合技术类的产品?主要基于技术类产品的三大特点。 



衡量维度

总体指标
易用度:使用**产品完成**工作的容易程度。 

影响因素
  • 主要因素:产品及设计给用户操作带来的复杂度,我们称之为「基础体验」,包括帮助引导、功能入口、概念术语、任务流程、操作反馈。 
  • 次要因素:用户特征对使用易用度的调节作用,也称之为「调节因素」。不同特点的用户,会影响易用度分数,包括操作熟练度、先验知识、行为习惯。 



量表开发

大家肯定要问,这些影响因素是怎么确定的,如何证明它们的合理性?这就要提到量表开发方法,基本上可以分为几个步骤: 

step1.理论借鉴
从相关领域查找经典量表,站在巨人的肩膀上,经过实践检验的量表更可靠。我们首先从 15种国际可用性测试量表中借鉴,抽出了一些关键的衡量维度。另外,易用度创始人Matt Dixon(2014)在《the effortless effort》书中,总结了在客户服务场景,费力的关键因素: 
    1. 信息分类不恰当,反复描述问题(82%) 
    2. 需要多次求助(62%) 
    3. 帮助指引不清晰(59%) 
    4. 找不到相关入口,频繁切换沟通渠道(59%) 

step2.实践总结
我们盘点发现,技术类产品,绝大部分属于工具型产品,强调任务流程,也是用户痛点集中的地方。汇总多条业务线近1年的调研结果。除了功能、性能问题外,根据对完成任务的阻碍程度,无论是0-1阶段,还是1-N阶段,高频体验问题分布都集中在5个维度: 
  • 帮助引导 
  • 操作反馈 
  • 任务流程 
  • 概念术语 
  • 功能入口 


step3.数据分析
通过整理归纳的影响因素,需要经过信效度验证,才能有说服力。简单来说,信度就是“可信与否”,指的是结果的一致性、稳定性及可靠性;效度就是“命中与否”,指的是结果反映所想要考察内容的程度。通过统计学的探索性因子分析,验证性因子分析,我们确定 5 个维度可以有效测量易用度分数的变化。详细可查阅《如何找到影响用户体验的关键因素?》。 

与满意度、尖叫度、NPS的区别

从易用度-满意度-尖叫度-NPS,是一个用户预期的渐进变化。从中可以看出,易用度更关注的是基础体验,也就是“简单好用”。 


为什么易用度相比其他指标更适合技术类产品呢?主要有 3 个原因:

1.内部试点发现,满意度无法准确衡量技术类产品体验
  • 满意度不能很好衡量真实体验,分数虚高。我们在一些产品上,同时使用「易用度」和「满意度」作为总体指标,发现 43% 的用户满意度评分,高于易用度评分,可以理解为“产品我满意但不好用”。此外,易用度分数与满意度分数相关性高达0.77,具备很高的可替代性。 
  • 易用度更接近用户真实体验。对任务难易程度作出评价,用户在判断时会更直接,考虑使用过程中付出的脑力、时间等成本。对满意度作出评价,除了考虑产品本身的易用性,内部用户还会考虑其他主观因素,例如: 
    1. 合作关系:你是研发,我是用户,担心给你满意度打低分了,之后就不满足我的需求了。 
    2. 中庸倾向:满意度调查,已经是人尽皆知的评分,国人都倾向于打中上。 
    3. 评价范围:易用度问的是完成工作的容易程度,范围更小,用户评价的时候更聚焦。满意度问的是整体是否满意,范围更大,用户会综合考虑很多因素,例如上面提到的服务支持、上下游协作、需求响应等等。 


2.行业实践表明,易用度比 NPS 更能预测用户留存和成本变化
  • 易用度更能预测用户留存。《哈佛商业评论》(2010年)发表易用度时,调研7500多名用户,数据显示易用度低的客户,94%的有复购意愿,88%表示会增加支出,仅1%表示会对公司持负面态度。Garter(2013)发布报告,基于49000多名用户数据发现,易用度分值从1分提升到5分,可以使用户忠诚度提高22%。Oracle(2015)发布服务云易用度白皮书发现,当用户表示使用产品付出了更少的努力,忠诚度提高18%。相反,从满足用户预期到超出用户预期,用户忠诚度的变化并不明显。 
  • 易用度更能预测成本变化。Gartner(2019)对100+公司、12.5w用户的调研发现,易用度从高分到低分,可以降低37%的成本。 

3.行业实践表明,尖叫度更适合成熟度较高的产品类型
  • 目前在市场上,至少在国内,ToB 产品没有达到饱和,定位也各有不同。在企业用户心中,并没有足够清晰的心智和经验去判断。例如企业微信和钉钉,基本上很少有用户会同时使用这两个产品,那用户就无法准确评价二者的好坏。 
  • 更关键的是,很多 ToB 产品,用户多数是被动接受使用的,极少有选择余地。普遍的高技术门槛,也把他们尝试的意愿和可能性大打折扣。 


优劣对比

对比满意度、尖叫度、NPS指标,易用度的优势在于: 
  • 关注用户完成任务过程中的阻碍,重视基础体验; 
  • 适合去度量特定的用户接触点和任务流程,以便了解用户解决问题的难易程度。 
劣势在于: 
  • 对于分数过高或过低的情况,没有通用的基线,需要区分行业、产品类型、产品复杂度来衡量分数是否合格; 
  • 侧重基本体验,无法衡量用户的总体满意度。 



3. 易用度基线


经过半年的实践,我们采集了 35 个技术类产品的易用度,根据产品类型、产品阶段来区分。 结合内部试点和行业调研,我们把技术类产品的易用基线,设定为 5.5 分。主要发现: 
  • 产品类型越复杂,易用度越低。试点产品中,ToC 产品易用度均值 5.46,ToB 产品易用度均值 5.32,ToD 产品易用度均值 5.07。 
  • 产品阶段越早期,易用度越低。试点产品中,0-1 阶段的产品易用度均值 5.09,1-N 阶段的产品易用度均值 5.28。 

内部实践

如图所示,易用度有很好的区分度,不同产品类型的不同产品阶段分数呈现出差异性,我们可以根据这个数据,去评估自己的产品所在位置。 



为什么总体上选择 5.5 分作为“易用”标准?

我们在这 35 个产品上进行易用度的尝试,最终收集了 4000+ 问卷数据,得出了技术类产品的体验基线: 
  • 总体均值 5.07 分,中位数 5 分。具体分布如图所示,认为“比较容易”(5-7分)的用户占 69%。 
  • 但由于内部的技术类产品,大多处于 0-1阶段,以现在的状态作为“易用”基线,显然不合理。 



业界标准

因此,我们需要结合业界的实践作为参考。我们收集到 2 家用户研究领域的老牌公司 Nicereply 和 HotJar 的数据。Nicereply 是一家咨询公司,它服务的对象既包括 C 端用户,也包括 B 端用户。HotJar 是一家专做用户行为监控的公司,它服务的对象主要是 C 端用户。因此, 我们倾向于采纳  Nicereply 发布的基线 5.5 分,作为参考。
  • Nicereply 公司在2018 年发布的易用度  benchmark(链接),基线为 5.5 分。 
  • HotJar 公司在 2019 年发布的易用度 benchmark(链接),基线为 6.09 分。 



分析思路

很多设计者会想,不就是一个问卷嘛,能发挥多大的作用?实际上,当问卷数据+用户行为数据,它将发挥更大的价值。 
  • 现状描述:对产品当前的功能、体验、性能的在用户心中的水位进行摸底,通过数据和主观反馈找到原因。 
  • 对比差异:技术型产品往往有多个角色共同使用,并且有上下游协作关系,可以通过问卷和数据发现不同角色的偏好,找出差异化的改进方向。 
  • 影响关系:当发现某些模块用户评价低时,需要下钻找到最相关的影响因素,这时需要用到相关分析,找到此消彼长或相辅相成的变化关系,以及用到回归分析,找到可能的因果关系。 
  • 聚类分析:结合问卷数据和用户行为数据,我们可以对典型用户进行分层,也就是我们通常说的“用户画像”,可以结合经典的 RFM 模型,找到高频、忠诚、高付费且评价好的用户。 



现状描述

以某个技术类产品 A 为例,通过现状描述,可以发现低分人群抱怨的问题集中在哪里,提出问题优先级排序。 



对比差异

通过对比差异,把用户根据人口学、行为特征进行单维分类,与易用度分数做交叉分析,找出人群之间的差异,有针对性改进。 



影响关系

通过影响关系分析,可以找到影响产品 A 易用度分数的主要原因,也就是用户为什么觉得好用/不好用。 



聚类分析

通过聚类分析,结合问卷数据和用户行为数据,可以发现典型人群,制定差异化的运营策略。 



现象与洞察

在 35 个技术类产品上的实践,我们发现了一些常见现象和经验性的洞察,它并非都是普适的,却有很高的参考价值。 



结论

基于内部技术类产品的体验度量实践,我们得出以下结论: 
  • 实践证明, 易用度指标衡量技术类产品更有效。技术类产品降本增效的商业目的、降低技术门槛的用户诉求、流程复杂上手难的痛点,决定了体验度量要关注基础体验。满意度、尖叫度、NPS去衡量都不太准确。 
  • 易用度的衡量维度,包括 5 个部分的基础体验。即 帮助引导、功能入口、概念术语、任务流程、操作反馈。
  • 结合内部试点和行业调研,我们把 技术类产品的易用基线,设定为 5.5 分。当前内部技术类产品的易用度基线是 5.07分,行业技术类产品的易用度基线是 5.5 分,产品类型(ToC/ToB/ToD)、产品阶段(0-1阶段,1-N阶段)也会有所差异。 
  • 结合行为数据,易用度可以进行描述、分类。使用现状描述找出低分人群的高频问题,使用对比差异找到多角色的不同诉求,分析影响关系找到影响易用度的主要因素,结合用户行为数据进行聚类找到典型人群。


    文章来源:站酷  作者:Ant_Design

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

如何构建品牌体系?网易智企品牌体系化建设实录

涛涛

导读

品牌体系的长期价值是什么?如何构建完整品牌体系?

本文将以网易智企品牌设计体系的建立过程为案例,与大家分享一下品牌体系化过程中的经验和总结。

如何构建品牌体系?来看网易智企品牌体系化建设实录!

△ 网易智企-品牌设计体系

目录

  • 背景:从产品走向事业部
  • 研究:品牌体系的不同构建方式
  • 策略:选择合适的品牌体系构建策略
  • 设计:从品牌字体到框架规范
  • 标准化:设计文档与流程规范化
  • 推进:发起会议正式确立体系
  • 成长:体系的不断自我成长
  • 传承:网易品牌设计
  • 生态:品牌体系的长期价值
  • 资料获取

背景:从产品走向事业部

网易智企是一站式企业服务提供商,依托 23 年 AI、大数据、通讯音视频技术,以 PaaS、SaaS 为主,提供智能化、数据化、场景化的企业服务解决方案。

网易智企的前身,是网易云信和网易七鱼两个的产品。2019 年初,网易集团决定整合 B 端资源,成立一个新的事业部——网易智企,并在此之后陆续打造了网易定位、网易互客等多个优秀产品。

至此,网易智企的品牌架构由两个独立的产品品牌,逐渐变成了事业部品牌+多个子品牌的品牌架构。

如何构建品牌体系?来看网易智企品牌体系化建设实录!

但是,因为原有的两个品牌(即云信、七鱼)已经运营多年,在设计上并不统一。而事业部品牌为新设计的品牌,再加上其他的子品牌,最终造成了多个品牌在设计上“各自为政”的现状。

并且随着网易智企的快速发展,子品牌不断的变多,我们与市场部同学便逐渐发现了一些问题。下图是市场部同事在 2019 年发表在朋友圈的一张图,便是当时品牌的现状。

如何构建品牌体系?来看网易智企品牌体系化建设实录!

△ 网易智慧企业现状(2019 年初)

虽然产品线愈发丰富,整个事业部也在不断成长中。但是,若是品牌设计体系不够清晰,将会对未来的品牌传播造成非常多的问题,之后的修正成本也会越来越高。

如何改变现状?我们是否能够主动去推动事业部进行整体的品牌升级?能否通过设计去构建一个完整的体系,以满足网易智企未来的发展需要?

因此,在发现这个问题后,我们便马上开始了品牌设计体系的构建工作。结合之前的品牌经验,并在查阅大量资料进行研究后,逐步制定了完整的解决方案。之后与市场部同学一起合作,共同推进了品牌体系的构建与落地工作。

研究:品牌体系的不同构建方式

在企业的成长过程中,随着业务的不断拓展,自然而然地会产生越来越多的子品牌。在这个过程中,许多优秀的企业通过长期的实践,通过不同的方式,逐步构建了属于自己的品牌体系。比如联合利华、大众企业集团、苹果、雀巢、谷歌等等。

品牌体系一共有哪些构建方式?他们分别适用于哪种情况?而我们又应该用何种方式去构建品牌体系呢?

带着这些问题,我开始进行了品牌体系构建的研究。通过大量的案例分析与调研,我总结了以下几种最常用的品牌体系构建方式:

1. Free Standing 自由家庭式

自由家庭式,顾名思义,一切皆为 Free Style。子品牌与母品牌几乎无关联系性,完全自由地进行各自发展,因此品牌在设计上和基本毫无关联性。

这种品牌模式,通常适用于强子品牌战略的集团公司。不同的子品牌之间并无依存关系,也不需依靠其他子品牌、母品牌进行背书。而是各自在领域中独立运营,甚至形成差异化竞争,以扩大在单领域的品牌丰富程度,占据更大的市场份额。

如何构建品牌体系?来看网易智企品牌体系化建设实录!

△ Free Standing 自由家庭式

比如联合利华集团,所有子品牌几乎均采用自由家庭式,在不同的细分领域拥有多个子品牌。比如个人护理用品领域,主要品牌有旁氏、多芬、Iluminage、卡玫尔、清扬、凌仕、中华、力士、夏士莲、舒耐、凡士林等。食品系列品牌有家乐、老蔡、立顿、四季宝、净水宝、可爱多、梦龙、和路雪等品牌。

很多品牌你甚至意想不到这是出自联合利华之手(或者被收购了),但仔细查看产品介绍,均会发现联合利华的身影。而在产品广告的最后 1 秒,也会快速出现联合利华这个“爸爸”的身影 。

如何构建品牌体系?来看网易智企品牌体系化建设实录!

△ 联合利华集团-品牌体系

再比如 VOLKSWAGEN(大众汽车集团),所有子品牌也均采用自由家庭式。旗下有奥迪、斯柯达、宾利、西雅特、布加迪、保时捷、兰博基尼、大众、斯堪尼亚、杜卡迪等众多子品牌。通过差异化竞争,在汽车行业的不同领域(家用车、豪华车、摩托车、重型卡车、巴士等)的不同级别中,均占据了不错的份额。

面对不同的消费群体和阶层,品牌需要承载不同的品牌概念,解决不同的问题。因此,只有采用自由式家庭式的品牌家庭,才能在不同的领域中有针对性地进行品牌的建设。

当然,这种方式也具有一定的负面作用。如果当两个子品牌在同一领域重叠性较大时,容易导致品牌在“内部竞争”中逐渐弱化,比如斯柯达汽车的定位与大众汽车重叠性过大,定位区分不明显,而与大众的三大件又是相同的,因此逐渐在市场中被边缘化。

如何构建品牌体系?来看网易智企品牌体系化建设实录!

△ 大众汽车集团-品牌体系

我们可以总结一下自由家庭式品牌体系的优劣势。

优势:

  • 子品牌更灵活,更有利于差异化竞争。
  • 可以针对同一行业进行不同层次的用户获取,提升单品类占有率。
  • 子品牌危机,对母品牌营销较小。

劣势:

  • 品牌一致性差,用户难以感知整体品牌感,不适合弱子品牌型企业。
  • 用户难以形成整体品牌归属感,无法通过母品牌进行有效地用户迁移。
2. Gene Delivery 基因家庭式

基因家庭式,即母品牌与子品牌拥有部分相同的元素或风格特征,并通常具有延续性,而这种元素被称为品牌基因。

基因家庭式是品牌体系中最为常见的表现方式,它通常适用于强母品牌的集团企业。此类公司通常在母品牌发展成熟后,基于母品牌进行其他领域的拓展,逐渐形成不同的子品牌。因此,子品牌需要延续母品牌的基因作为背书,从而提升子品牌的知名度与信誉。

如何构建品牌体系?来看网易智企品牌体系化建设实录!

△ Gene Delivery 基因家庭式

而基因家庭式这个大的方向中,按照基因传递的方式进行细分,又可以归纳为以下 3 种最典型的形式:

基础版:将母品牌图形直接融入到子品牌中

比如雀巢公司的部分重要子品牌中,都将母品牌的品牌文字融入到品牌图形中,而这也是雀巢母品牌最容易识别的部分。

通过这种方式,子品牌既保持了相当程度的自由度,同时用户也能直观地通过品牌基因识别出子品牌与雀巢母品牌的关联性。

如何构建品牌体系?来看网易智企品牌体系化建设实录!

△ 雀巢公司-品牌体系

以及美国联邦快递 FedEx,则是以母品牌为基础,通过改变局部颜色、增加品牌文字等方式来构建其不同的子品牌。保证了一定的差异化的同时,与母品牌形成了强关联,达到了比较强品牌延续性。

如何构建品牌体系?来看网易智企品牌体系化建设实录!

△ 美国联邦快递-品牌体系

进阶版:提取母品牌关键特征,融入子品牌中

比如亚马逊公司,将其标志性的“箭头笑脸”提取出来,与各自不同的子品牌字体组成了新的品牌。这种方式相对于基础版又提高了更高的灵活性,但同时也保持了相当程度的品牌延续性。

如何构建品牌体系?来看网易智企品牌体系化建设实录!

△ 亚马逊-品牌体系

高阶版:提取母品牌基因,通过重构形成子品牌

比如 google 公司的新品牌与其各子产品的关系。通过提取统一的颜色以及扁平化的纸片效果,经过重组以后得到不同的图形,形成自由度极高,但又拥有高度统一性的品牌体系。

如何构建品牌体系?来看网易智企品牌体系化建设实录!

△ Google-品牌体系

但是,这种方式在设计上的要求较高。如何在差异化的同时,保持一定的品牌关联性,需要非常精准的把控。

我们可以总结一下基因家庭式品牌体系的优劣势。

优势:

  • 整体品牌感强,用户容易进行感知,并进行品牌迁移
  • 灵活性、丰富性较高,可针对不同产品进行差异化设计
  • 扩展性强,后期延续更轻松

劣势:

  • 需要母品牌有较强的影响力
  • 品牌基因的延续上,需要平衡统一性与差异性,需要精准把控
3. Clone Family 克隆家庭式

克隆家庭式,即子品牌直接使用母品牌的品牌图形与品牌字体。子品牌通常与母品牌在品牌上毫无差异,或者保持图形、颜色、字体等特征的高度统一性,只进行文字内容的更换。

如何构建品牌体系?来看网易智企品牌体系化建设实录!

△ Clone Family 克隆家庭式

比如苹果公司与其所有子产品的品牌,直接沿用苹果的主图形,并配合统一的色值、字体、间距等品牌规范,仅在文字进行相应的命名。通过几乎一致的品牌表现,当你识别任何一个子品牌时,便能感受几乎一致的品牌传递,甚至是各种细节,比如包装风格、说明书等等。

如何构建品牌体系?来看网易智企品牌体系化建设实录!

△ Apple-品牌体系

当然,严格意义上来说,你可以认为他们只是同一个品牌。但当一个单一属性的品牌需要扩张到更多品类时,就必须带上相应的属性。你可以认为“iPhone”、“MacBook”、“TV”只是品牌的附加说明,但当他们组合在一起并出现在新的品类中时,便是一个新品牌的概念了。

这种品牌体系通常适用于企业在同一个的领域中,开拓不同的细分领域。他们传递的品牌概念与价格定位是一致的,比如苹果的所有产品都代表科技感、细节完美、设计精良,在价格上也通常占据比较高的层级。

但是,这种方式也具有一定的局限性。因为你必须保证所有子品牌所传递的上述所有特性,都与母品牌是一致的。如果某一项有差异,则品牌母品牌所蕴含的一切将不能被子品牌的用户群体所接受,这也是当时 iPhone 4C、5C 失败的原因。当你的价格定位与母品牌存在差异时,你的用户便不再认同这个子品牌,以及背后传递的一切。

为什么小米要开拓红米系列、华为要开拓出荣耀系列,为了他们放弃克隆家庭式而转向自由家庭式?就是这个道理——你不可能靠一个品牌传递不同的声音。

我们可以总结一下克隆家庭式品牌体系的优劣势。

优势:

  • 统一感强,用户无需更多的记忆,可直接进行品牌印象迁移
  • 低成本,可以无需更多的设计与推广活动

劣势:

  • 同一种品牌图形,不一定适合不同的产品
  • 缺乏变化,用户难以感知与产品间的关联
  • 容易引起品牌层级的混乱,致使整个品牌家庭崩溃

策略:选择合适的品牌体系策略

1. 确定策略

通过网易智企品牌现状的分析,并结合智企未来的发展需要,我们最终确定——使用基因家庭式-进阶版(即提取母品牌的关键特征,融入到子品牌中)的品牌体系是最为合适的。因为这种方式既能保证品牌设计的整体统一性,又能保持足够的灵活性,以适应不同品牌的需要。

但是,提取什么样的品牌基因是最合适的?

网易七鱼、网易云信原本就拥有多年的产品历史,如果只提取一方的基因,显然不太合适。如果大改品牌图形,则会对原有用户的认知产生较大影响,并不是一个理想选择。

最终,我们决定了一个大胆品牌策略——以品牌字体作为品牌基因的承载物,并通过标准化的框架规范使品牌的整体一致性得到的统一。通过这种方式,也可以将品牌图形的自主设计权留给子品牌。

如何构建品牌体系?来看网易智企品牌体系化建设实录!

这种品牌策略的主要优势有:

整体品牌感强,品牌基因容易延续。

后续可将品牌设计流程标准化,提升设计与一致性。

原有品牌可只升级品牌字体和框架规范,保持原有品牌图形,从而不影响用户认知。

通过这种方式,我们可以对原有的网易七鱼、网易云信,以及网易智企的品牌做一个统一的升级,小幅优化品牌图形、统一品牌结构,并以全新的字体风格重构品牌字体。这样,我们既能够达到设定的目标,又能够最小程度的对品牌认知造成影响。

2. 可行性调研分析

这种构建策略是否可行?想要让相关人员理解这个策略,仅仅依靠设计方案是不够的。因为大家的视角不同,并不一定能够从设计的角度去理解。因此,我们必然要充分地进行论证,并拿出相关的案例去佐证,才能让设计体系的的推进更具实践性。

通过市场调研,我们分析了最近 10 年中优秀的品牌升级案例。在这其中,腾讯的品牌升级案例与我们的策略非常契合。

2017 年 11 月,为庆祝即将到来的 20 周年,腾讯发布了一款新字体——“腾讯字库”,并借此机会对部分品牌进行了升级,以此来加强整体品牌感。

如何构建品牌体系?来看网易智企品牌体系化建设实录!

如何构建品牌体系?来看网易智企品牌体系化建设实录!

通过发布全新的品牌字体,腾讯公司构建了以品牌字体为核心的品牌体系,并取得了良好的效果。而这种品牌体系的构建方式,与我们的设想不谋而合。

因此,我们认为以品牌字体为核心的品牌体系构建策略是完全可行的。但是,这种方式所需要投入的资源是巨大的,且周期通常比较漫长。

我们又如何克服这个问题?

虽然无法得到如此多的资源,但我们可以通过合理的计划与推进策略,逐步去构建整个体系。不断地进行策划、构建、落地、完善,形成一个完整的闭环,通过不断实践去提升、丰富这个体系,最终让这个体系变得越来越完整。

确定策略之后,我们开始着手进行品牌体系的构建工作。

构建:从品牌字体到框架规范

1.  品牌字体设计

品牌设计体系的构想虽始于 2019 年初,但真正的准备工作则始于两年前。在我刚接触网易七鱼和网易云信时,便发现了品牌中存在的一些问题。虽然没有合适的时机进行品牌升级,但研究和尝试则不断地进行中。

在此期间,我开始着手设计一款全新的专属字体,也就是之后的网易 B 端产品的统一品牌字体。

通过对于网易智企品牌调性的分析,以及未来发展的需要,我确定了品牌字体的基本调性:现代、简约、刚正、大气、品牌基因的融入。

如何构建品牌体系?来看网易智企品牌体系化建设实录!

作为科技类企业品牌的字体,它应该是有现代感和设计感。其次,为了适应不同的产品调性,同时传递出信任感,我希望它是刚正、大气的。最后,作为品牌体系的载体,它必须具备专属的品牌特征,才能以此为基础形成统一的品牌体系。

因此,在字形的结构上采用了较为刚正的框架,干脆利落的同时,在转角带有一定的弧度。方中带圆,刚中带柔,形成美学上的互补。而在遵从中文字体结构的同时,也对笔画本身进行了适当的简化(比如勾,用切割式的笔画代替上勾,但感知上仍然是勾),让字体更具现代感与简洁感。

如何构建品牌体系?来看网易智企品牌体系化建设实录!

而整个字体的灵魂,则是将网易的特征以笔画特征的形势融入字体中。贯穿始终、恰到好处,使其作为统一的品牌基因延续在品牌家庭中。

网易的建筑风格在所有公司的大楼中,都是属于非常有识别性的。除了深邃而低调的色彩外,整个建筑从外形到地板、再到每个细节中,都将拥有独特切角的菱形融入其中。因此,我将这独有的菱形的四个边单独拆分,作为字体的基本笔画。通过简单的移动,四个边正好形成了网易的首字母“W”。继续移动,将其从两边的翅膀往中间压,则形成了一个网状的 XX 形状——这不正是网字中间的图形吗?

网易建筑风格——网易的“W”——网易的“网”,网易的基因就这样融入到字体中。而另一个更重要的特征,则是这四个笔画与水平线相交,所呈现的统一倾斜角度——80度切角。

如何构建品牌体系?来看网易智企品牌体系化建设实录!

如何构建品牌体系?来看网易智企品牌体系化建设实录!

2. 初步制定框架规范,预先进行品牌升级

完成字体风格的定义后,下一步就是以品牌字体为核心,进行原有 2 个品牌升级的方案设计。

首先进行的是网易云信的品牌预升级。将网易云信的品牌字体以全新的字体风格进行重新绘制,并结合品牌图形制定了全新的品牌框架。比如品牌图形与品牌字体的间距,确定为字体高度的 1/2,而安全距离则定义为与字体高度相等间距等一系列规范。

通过初步的框架制定,一套围绕着品牌字体的初步规范便制定完成了。

如何构建品牌体系?来看网易智企品牌体系化建设实录!

如何构建品牌体系?来看网易智企品牌体系化建设实录!

完成云信的品牌预升级后,又进行了网易七鱼的品牌预升级。因为原有的品牌图形存在一定的优化空间,除了品牌字体重新绘制与标准规范外,还对品牌图形和品牌色做了升级,让品牌图形保持原有识别性的基础上,更加圆润、灵动,颜色也更具科技感。

如何构建品牌体系?来看网易智企品牌体系化建设实录!

如何构建品牌体系?来看网易智企品牌体系化建设实录!

通过两个品牌的预升级,除了初步对整体框架规范进行了制定,也对品牌字体的品质和实用性也得到了良好的验证,为接下来品牌升级工作的推进奠定了一个比较好的基础。

标准化:设计文档与流程规范化

1. VI 设计文档

品牌设计不仅仅是完成图形的设计,更重要的是使品牌在后续使用中更加规范,而品牌 VI 识别系统是其中最重要的工具。文档的初衷并非约束设计,而是使品牌设计的流程更加标准化,提升非关键环节的工作效率,让设计师将时间真正聚焦于的品牌创意阶段。

因此,我们制定了适用于不同场景的 VI 设计标准文档。整个文档的设计准则:一致性(整体框架、页面结构高度一致)、专业性(文字表述、规范演示高度专业)、灵活性(允许在框架中的寻求灵活创新)。

如何构建品牌体系?来看网易智企品牌体系化建设实录!

封面样式:推荐的默认为标准品牌色+Logo 图形样式,除此之外还提供了背景图,在保持框架一致的基础上,也具备了一定的灵活性。

如何构建品牌体系?来看网易智企品牌体系化建设实录!

△ 封面样式

目录样式:提供基础版的 2 个模块版式和 3 个模块的版式

如何构建品牌体系?来看网易智企品牌体系化建设实录!

△ 目录样式

内容框架:文字说明的区域与版式,内容区域的不同分割模式,尽可能地适应不同的内容需求。

如何构建品牌体系?来看网易智企品牌体系化建设实录!

△ 内容框架

2. 品牌展示规范

在品牌的传播和使用中,VI 识别手册相对专业性会更强一些,而在平时的展示中,更多的会进行单独的品牌展示。因此,我们也为此制定了不同场景下品牌的单独展示规范,以及在标准尺寸(1920×1080)下的页面布局、图形显示比例等规范。

如何构建品牌体系?来看网易智企品牌体系化建设实录!

△ 品牌图形单独展示

如何构建品牌体系?来看网易智企品牌体系化建设实录!

△ 横式标准组合

如何构建品牌体系?来看网易智企品牌体系化建设实录!

△ 竖式标准组合

3. 为新品牌制定 VI 系统

完成标准化的 VI 设计文档后,下一步便开始着手进行新品牌的 VI 识别手册的设计工作。按照我们已经制定完成的设计文档,品牌 VI 识别规范的输出效率得到了较大的提升。

如何构建品牌体系?来看网易智企品牌体系化建设实录!

△ 网易云信-VI 视觉识别系统

如何构建品牌体系?来看网易智企品牌体系化建设实录!

△ 网易七鱼-VI 视觉识别系统

最终,我们完成了两个品牌的 VI 视觉识别系统,为后续的体系化推进做好充分的准备。

推进:发起会议正式确立体系

通过全新品牌字体与品牌规范的确立,并完成了 2 个品牌升级、1 个新品牌设计以后,我们将完整所有的准备工作整理成一个完整的提案。

下一步,就可以发起正式的品牌升级研讨会了。会议目的是通过整体的背景分析与方案呈现,让各相关方都能够达成一致意见,最终完成正式的品牌体系落地。

1. 提前与关键相关方沟通,对齐目标

在准备好充足的方案后,如何推进并最终落地?

这是非常关键的一步,也是许多设计师比较不擅长的领域。想要顺利的推进项目,光靠一个好的解决方案是不够的,还需要在正确的时间点,寻求各相关方的支持。

因此,首先就需要了解各相关方对于品牌现状的看法,并通过现状的分析,初步对齐我们的“项目目标”——即解决长期的品牌混乱问题,而这也是我解决问题的初衷。只有对齐了目标,我们才能站在共同的出发点,并在合适的事件抛出解决方案。

如何构建品牌体系?来看网易智企品牌体系化建设实录!

下图是当时与其中一个市场侧关键相关方沟通的过程。当我们分析完目前的现状后,相关方对目前的现状表示认可,并期待解决方案。这个时候,我们再将已经成熟的方案展示出来,才能让相关方站在同一角度去思考问题,并最终认可解决方案。

如何构建品牌体系?来看网易智企品牌体系化建设实录!

之后,我以相同的方式询问起产品侧和其他侧的相关方。大家在对齐目标以后,都有一个比较清晰的认知,也对我提出的解决方案非常认可。这时候,我们的项目便有了进一步推进的基础。

2. 发起会议,正式推出方案

通过提前的沟通,确定了各相关方的态度,同时了收集了一些小小的意见,并对方案进行了微调。之后便与各相关方正式地发起了品牌升级会议。下面是这次会议的简要过程:

会议开始后,我们首先进行背景分析。

为什么需要进行品牌升级?简要分析 2019 年初智慧企业的品牌现状,以及智慧企业未来的品牌发展方向:整体品牌感弱,品牌一致性过差,无法满足智慧企业长期的发展需要。

如何构建品牌体系?来看网易智企品牌体系化建设实录!

同时,我们也对目前现有的品牌设计进行分析,发现了较多的问题。比如品牌字体的风格不统一、比例不一致、色值不统一等问题。而这些问题可以也可以通过品牌升级进行解决。

如何构建品牌体系?来看网易智企品牌体系化建设实录!

最后,随着网易智企的快速发展,智慧企业的子品牌会越来越多,而品牌联合推广的频次将会越来越高。这意味着品牌 Logo 设计混乱的现状将会产生越来越大的影响力,而我们的修正成本将会越来越高。

为了解决这几个方面的问题,我们推出了最终解决方案——进行品牌升级,并建立网易智企品牌设计体系。

如何建立品牌体系?

通过策略分析与市场调研,以及未来网易智企发展的前瞻性思考,我们最终确定使用基因家庭式-进阶版的品牌体系是最为合适的,即提取母品牌的关键特征,融入到子品牌中。通过这种方式,我们对网易七鱼与网易云信进行了整体的品牌升级,并为所有新品牌制定了详细的 VI 识别系统。

如何构建品牌体系?来看网易智企品牌体系化建设实录!

△ 品牌升级会议 PPT

如何构建品牌体系?来看网易智企品牌体系化建设实录!

经过这套完整的方案阐述,大家在会议中一致通过了网易七鱼和网易云信品牌升级的方案,并对以品牌字体+品牌规范为核心的品牌设计体系表达了正式认可。

3. 以规范对事业部 Logo 进行升级

品牌设计体系经过各方认可以后,推进主品牌的升级就轻松多了。由于原有事业部的品牌字体和品牌色存在一定的设计问题,在确定了品牌体系的标准字体与规范后,我们便顺势对事业部的品牌进行升级。

当一个体系被认可后,遵循这个体系就变成了理所应当。因此,网易智企主品牌升级的工作也得到大家的认同,并顺利推进下去。

如何构建品牌体系?来看网易智企品牌体系化建设实录!

之后,我们同样为网易智慧企业主品牌制定了详细的 VI 识别系统。

如何构建品牌体系?来看网易智企品牌体系化建设实录!

△ 网易智慧企业-VI 视觉识别系统

至此,我们已经完成了现有的主品牌进行了整体的升级,网易智企的品牌矩阵已经初步形成。对比原有的品牌矩阵,整体品牌感得到了极大地提升。同时,也将会对之后的新品牌形成良好的规范,并促使这个体系不断地成长。

如何构建品牌体系?来看网易智企品牌体系化建设实录!

如何构建品牌体系?来看网易智企品牌体系化建设实录!

4. 发送邮件,全员通知并规范使用

通过会议并得到各相关方确认后,最后一步便是发送正式的品牌升级邮件了。

通过发送邮件,正式宣布品牌升级,并通知每一个关键相关方。这就相当于合同的最后一步,整体体系便正式地得到了确认、生效。同时也将 VI 手册和设计文档同步给大家,引导各方正确地进行品牌使用。

如何构建品牌体系?来看网易智企品牌体系化建设实录!

成长:体系的不断自我生长

1. 不断丰富的品牌矩阵

随着网易智企的快速发展,我们的品牌也逐渐增多。从 2019 年初进行品牌预升级,到 2019 年底,我们一共推动了 4 个产品进行品牌升级,并以新的规范进行了 4 个新品牌的设计。

如何构建品牌体系?来看网易智企品牌体系化建设实录!

有了品牌设计体系后,大家对品牌设计的态度也发生了明显的改变。

每当有新的产品需要进行品牌设计时,大家便会自觉地去遵循这个体系——“按照品牌体系的标准设计即可”。“我们只需要按照体系来就行了,剩下的图形创意工作就交给你们了”。

如何构建品牌体系?来看网易智企品牌体系化建设实录!

如何构建品牌体系?来看网易智企品牌体系化建设实录!

如何构建品牌体系?来看网易智企品牌体系化建设实录!

在此之后的每个新品牌设计,我们都按照标准化的设计流程进行,将重点的工作投入在图形的创意上,而不是反复地去尝试各种风格。我们的品牌设计效率得到了极大的提升,而各方对于品牌方案的确定也变得顺利多了,因为大家只需要判断图形是否符合产品特点即可,无需反复对比各种品牌风格。

2. 英文品牌规范的加入

随着品牌设计体系的不断发展,我们的品牌将不仅仅局限于中文,也会涉及到单独的英文品牌。经过我们的长期实践,英文品牌规范应运而生。

MCtalk 是网易发起,由网易智慧企业部主导的科技活动品牌:通过汇聚深度思维(Mind) 和顶尖创意(Creativity)来打造价值集合与传递的平台。包含 MCtalk Forum 论坛、MCtalk Conference 峰会、MCtalk Live 分享、MCtalk Park 开放日和 MCtalk Academy 私享会等系列活动。

如何构建品牌体系?来看网易智企品牌体系化建设实录!

如何构建品牌体系?来看网易智企品牌体系化建设实录!

3. 周年数字品牌规范

随着不同产品线周年庆,许多品牌会设计专属的周年组合样式。为了因为不同周年 Logo 而影响产品统一性,同时减少了不必要的工作,我们设计了品牌+数字周年的品牌规范。

每个品牌都可以应用统一的周年组合形式。让不同品牌在周年组合中,也能拥有统一的品牌感。

如何构建品牌体系?来看网易智企品牌体系化建设实录!

如何构建品牌体系?来看网易智企品牌体系化建设实录!

但是,周年品牌规范的统一,并不意味着每个活动独特性的缺失。我们仍旧可以围绕数字+主题发挥出强有力的创意,为每次活动创造丰富的主视觉。

如何构建品牌体系?来看网易智企品牌体系化建设实录!

如何构建品牌体系?来看网易智企品牌体系化建设实录!

传承:网易云商品牌设计

随着品牌设计体系的设计规范与标准化文档已经逐步成型,这份文档可能会发送给许多设计师进行使用。但是,具体设计时,许多设计师可能会产生一些疑问,导致字体设计、图形设计上面会出现问题。

那么,如何使用这份框架规范,正确地进行品牌设计呢?下面,我将以网易云商的品牌设计过程为例,大致演示一下这个流程。

1. 品牌字体设计

品牌字体的设计,我们在文档中给出了统一的字体风格,以及目前已经设计完成的品牌字体。如果字体已经存在,则可以直接获取,无需重复设计。

如何构建品牌体系?来看网易智企品牌体系化建设实录!

比如网易云商的品牌字体中,“网“”易”“云”三个字已经出现过,则直接取用,根据规范进行“商”字的设计即可。

如何构建品牌体系?来看网易智企品牌体系化建设实录!

字体的设计,大概有三个步骤:

确定字体的骨架:字体设计,首先要保证字形的结构准确,遵循汉字的书写规律。否则,将会影响字体的易读性,让字体看起来不够自然。这一步,推荐多去借鉴已有的一些优秀字体,网易正体的字形结构,参照了“方正正中黑简体”和“黑体”这两个字体,在设计时可以先研究相同字形的笔画结构。

融入品牌基因:品牌基因,包含了横线末端 80 度切角,折角处的圆角,勾、点的简化处理等统一风格。同时,笔画带有细微的圆角,使字体本身刚而不锐。

整体调整,细节优化:最后一步,则需要凭借字体设计经验,对笔画进行优化,使其遵循字形结构的前提下,更严谨、更具设计感。这一步,若没有相关经验,建议与我或者有字体经验的设计师进行探讨。每个字体力求严谨、优美、更有设计感,以便未来其他设计师使用。

2. 品牌图形设计

品牌图形的设计,是品牌设计中最为关键的一个部分。设计师需要在契合品牌理念的基础上,设计出最符合需求的品牌图形。也需要让品牌图形在风格上保持相对一致。

在网易智企品牌体系中,推荐以平面化的图形进行品牌设计。这样能够保证图形足够简洁,并适应不同的场景使用。同时,品牌图形应尽可能地与母品牌保证一定传承、关联性。

如何构建品牌体系?来看网易智企品牌体系化建设实录!

通常情况下,设计师需要在充分理解概念的基础上,进行多个方向的尝试。最终逐渐缩小范围,直至最终方案的确定。

如何构建品牌体系?来看网易智企品牌体系化建设实录!

网易云商的核心概念是,成为企业的商业增长服务平台。因此,“增长”这个概念应该贯穿于品牌图形中。而云商的产品皆为 SaaS 产品,而“商”的首字母是“S”,因此,S 也成为云商的一个标志之一。云商的目标,希望打通企业营销全链路,因此,全链路也成为附属的概念之一。

如何构建品牌体系?来看网易智企品牌体系化建设实录!

如何构建品牌体系?来看网易智企品牌体系化建设实录!

因此,整个品牌图形呈现的是一个向上增长的字母“S”,它像火箭一样向上发射。而整个图形,则由三段线条构成流畅的“S”线条,寓意三个品牌所形成“营销全链路”的概念。

为了让整个图形更严谨、细节更完善,在大致确定品牌图形后,设计师还需要巧妙地通过辅助线,去完善和优化整个品牌图形。为了避免切角过于尖锐,也同样在转角处加入了细微的圆角,使其优雅而柔和,并且更好地与品牌字体相契合。

3. 品牌基因的延续

网易云商是网易智企旗下的商业增长服务平台, 旗下包含网易七鱼、网易定位、网易互客三大产品。因此,品牌的传承性显得尤为重要,如何巧妙地表现出其中的关联性,是品牌图形能否承载更多含义的关键。

在品牌图形的风格中,网易云商的图形使用了与网易智企相同的线形风格。同时,线条的倾斜角度,也延续了网易智企品牌图形的 25 度倾斜。

如何构建品牌体系?来看网易智企品牌体系化建设实录!

在品牌图形本身,则巧妙地融入原有的 3 个子品牌特征。比如线条末端传承了七鱼的鱼形尾部,上下两个线条传承了互客的“互手相连”图形,而线条前部的尖角则传承了定位“精准尖头”的图形。

虽然这三个原有的品牌,之后将逐渐融合成新的品牌。但是,它们并没有消失,而是以另一种方式进行了延续。有延续、有情感、有温度,才能让用户更有记忆度,也更能让陪伴了这么多年的图形有一个精神的传承。

如何构建品牌体系?来看网易智企品牌体系化建设实录!

同时,整个图形又像一个 DNA 双螺旋基因,互相环绕增长。寓意网易云商,将成为企业的增长基因这一概念。

如何构建品牌体系?来看网易智企品牌体系化建设实录!

最后,通过统一的品牌框架规范,将品牌图形与品牌字体进行结合,形成了最终的完整方案。

如何构建品牌体系?来看网易智企品牌体系化建设实录!

4. 制作完整品牌 VI 识别系统

最后一步,便是按照 VI 标准文档,快速进行品牌 VI 识别手册的设计。标准文档中已经覆盖了基础的品牌使用规范,如果需要增加规范,可以按照相同的版式进行手册内容的新增。

如何构建品牌体系?来看网易智企品牌体系化建设实录!

生态:品牌体系的长期价值

随着更多品牌的加入,品牌设计体系的大家族也变得愈发丰富了。我们不仅获得了一个高度体系化的品牌矩阵,同时也形成了一套更、更规范的企业品牌设计流程。并且,随着我们的影响力不断扩大,逐渐也吸引了更多品牌加入到这个体系中…

1. 自我成长的字体库——网易正体

在每次新品牌设计的过程中,都会遵循统一的字体风格进行新字体的绘制,品牌字库也因此不断丰富。我们希望它最终将成长为一款完整的品牌字体,并对其进行了正式的命名——网易正体。

如何构建品牌体系?来看网易智企品牌体系化建设实录!

我们并不刻意去“生产”字体,而是让其自然地随着新品牌的加入不断的成长。

需要说明的是,虽然我们将字体的设计权交给设计师,但我们仍旧会对每个字体进行评审。除了字体风格的统一之外,我们对字体本身的基本要求也同样严格,比如字形结构的正确性、字体美感是否达到标准等。

如何构建品牌体系?来看网易智企品牌体系化建设实录!

随着品牌体系的影响力越来越广泛,我相信我们的品牌字库也会越来越丰富、完善。我们也欢迎更多的内部品牌遵守这套规范,一起加入网易 B 端品牌设计体系、网易正体的“共创计划”中。

2. 标准化的设计流程,更高的设计效率

通过对于整个设计流程的优化,我们将品牌的框架规范设计、品牌字体设计、品牌 VI 规范这几个流程进行了标准化,以此来提升整体的设计效率。

如何构建品牌体系?来看网易智企品牌体系化建设实录!

设计师可以将更多的精力专注于前期的品牌图形与概念的创意上,而之后的工作可以用这个标准化的流程来完成。更重要的是,这并不是单纯设计层面的流程,二是经过整个团队确认的流程。 因此,只要图形创意获得通过,那么后续的流程便可以快速完成可出产出,无需再次与各方确认。

通过实际的测算,对于传统的设计流程,我们可以将品牌字体的设计时间提升越 60%(如果字库足够丰富,那就是 100%了),整体规范输出效率提升 80%。

如何构建品牌体系?来看网易智企品牌体系化建设实录!

最终,我们通过这套标准化的规范节约了大量的时间,同时逐步构成了非常完整的品牌体系。我们也希望这套标准化流程能够帮助更多的品牌。

3. 围绕品牌体系的内部生态

我们通过不断的品牌设计与升级工作,通过不断成长的品牌、不断完善的标准化流程,最终完整了网易智企的品牌设计体系的建设工作。

如何构建品牌体系?来看网易智企品牌体系化建设实录!

基于所有的 VI 规范都是同一标准的,所有场景的规范可以任意组合、替换,这使得我们可以以统一标准输出给市场、产品人员,并逐步去建立后续的统一规范。

如何构建品牌体系?来看网易智企品牌体系化建设实录!

随着品牌体系的完善,我们的推设计广体系、产品设计体系才有了建设的基础。围绕市场侧,我们建立了统一的推广体系,用以规范线上线下的推广输出规范,产品官网的规范以及活动页等规范。而围绕产品侧,随着品牌体系的认同,FishDesign 的统一使用得以有了“群众基础”,并基于样式组件化+规范体系化建立了产品设计体系。

如何构建品牌体系?来看网易智企品牌体系化建设实录!

总而言之,品牌体系是所有体系化的基础,也是智慧企业设计体系的核心。只有顶层品牌的统一,才能在顶层认知上影响每个产品线,并逐步去引导中层、底层规范的统一。

如何构建品牌体系?来看网易智企品牌体系化建设实录!

2020 年下半年,网易智慧企业的中文名已经正式升级为网易智企,欢迎关注我们的产品~

4. 更大的影响力,“B 端品牌体系”共创计划

我们为什么要建立品牌体系?

回到最初的原点,除了帮助网易智企解决当前阶段的品牌问题外,还有另一个原因——在网易内部建立一套指导性品牌设计规范与流程。

设计不仅仅是纯粹的创意性,也不是片面的规范性。

体系的目的并非强制性的规范(我个人并不推崇毫无意义的统一)。体系的目的在于引导性、在于选择性。我们希望提供的是一个基础标准和流程。也许某个产品的设计师并不擅长品牌设计,也许大家有这套体系需求,那么大家可以有一套高品质、的品牌设计与落地流程。

也许某个产品线觉得这套体系不够满足目前的现状,但对于品牌的基本标准不清楚,对于品牌设计流程不够清晰。那也可以这套体系的基础上进行创新,借鉴这套设计流程。

如何构建品牌体系?来看网易智企品牌体系化建设实录!

如何构建品牌体系?来看网易智企品牌体系化建设实录!

如何构建品牌体系?来看网易智企品牌体系化建设实录!

基于这个目标,我们已经将品牌规范与标准文档进行了小范围的开放试验。截止到 2020 年的上半年,已经有多个品牌开始使用这套标准化流程进行品牌升级与规范输出,比如网易易盾、网易轻舟、网易疾风等。

品牌设计体系更大的价值在于——帮助品牌快速建立秩序,将时间留给创意。而体系本身,也会因为每次的创意,变得更丰富、更完善。通过不断地正向循环、自我迭代,最终成为一个更大生态。

在无序中寻找秩序,在秩序中寻找创意,让世界变得更有序、更有趣、更美好。

文章来源:优设  作者:Jady13_剑杰

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

日历

链接

个人资料

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

存档