首页

如何选择设计需求分析结果?

资深UI设计者

这周我们进行下一步讨论:如何对分析结果进行选择。

团队角色分工

首先我们需要了解互联网产品研发团队的各个角色分工。

对于初期的产品研发,可能公司没有团队概念,所以从想法到设计到开发,都由一个人搞定;

等到公司发展差不多,自己成了领导,就可以对各个角色和分工有所分组,也就是大多数初创公司的分配情况:

  • 产品经理(产品设计师):产品管理、项目管理、交互设计;
  • UI:UI 设计;
  • 开发工程师:技术开发

随着公司业务的发展,产品经理需要处理越来越多的业务规划任务,所以从业务视角和用户视角将之前的产品经理岗位职责进行划分:

  • 产品经理(业务视角):去组织管理公司业务;
  • 交互设计师(用户视角):去观察用户心理,分析需求,设计人机交互界面。

所以最终的角色分配是:

  • 产品经理(产品设计师):产品管理、项目管理;
  • 交互设计师:交互设计;
  • UI:UI 设计;
  • 开发工程师:技术开发

再大一点的公司,会增加项目经理岗,把之前产品经理负责的职责拆出一部分,这部分职责就是项目管理。所以角色分配最终是:

  • 产品经理(产品设计师):产品管理
  • 项目经理:项目管理
  • 交互设计师:交互设计
  • UI:UI 设计
  • 开发工程师:技术开发

交互方案评价标准

了解了团队角色分工,只是让产品得到了更专业的技术支持,接下来我们需要切入正题:对交互方案进行评价筛选,筛选的标准可以围绕:有用性、易用性和吸引力展开。

1. 有用性:

方案是否同时满足业务目标与用户体验目标,为了更好理解,大家可以看下如下事例:

如果所有的线上商品都发顺丰快递,对于用户来讲,用户体验当然很好:够快。但是从业务目标来讲,这是不可取的,毕竟快递不能独顺丰一揽。所以这个想法没有顾及到业务目标,是不可行的;

很早之前,有过 Open ID 的概念:用一个 ID 就可以登录多个网站。但是接入了 Open ID 的网站,对于自身产品的登录注册就会有一定影响,所以这个想法不了了之。

后来 Facebook 和 Twitter 开放了自己 ID,可用这两个账号进行其他网站登录。于是国内很多网站也开始支持微博、微信、QQ 账号登录。

这样降低了用户注册成本,而且也获得了一定收益。所以这是个不错的想法,但是对于一些需要获得用户信息的产品可能不太适合,所以视情况而定。

总结来说,有用性就是要满足产品利益与用户利益。毕竟如果只是很好看,最多也就只能被称作一个艺术品。

2. 可用性

所谓可用性就是用户容易理解,使用起来没有障碍,并且感受良好。

关于产品可用性,大家可以去了解下鼎鼎有名的尼尔森十大可用性原则。

3. 吸引力

所谓吸引力就是产品有打动人、超越用户期望值的细节。

关于吸引力设计,大家可以了解一下 KANO 模型,KANO 模型定义了三个层次用户需求:

基本型的需求:用户认为产品必须有的功能属性,如果没有,用户会不满意;如果有,用户会觉得理所当然。这个层次的需求,还谈不上用户满意与否;

期望型的需求:不是产品必须的功能属性,可能用户自己也不清楚一些功能,但是又恰恰是用户希望看到的。如果这种需求实现得越多,用户会越满意;如果没有满足用户这种期望值,用户会不满意;

兴奋型的需求:对于一些无关紧要的功能需求,如果产品满足了这些需求,用户会非常满意,从而提高用户忠诚度,最后把它推荐给好友。

方案的决策

通过以上标准对方案进行分析,最后涉及到决策,不管哪种类型的角色分配,都需要进行决策,这里可分为以下两种:

个人决策:对于最后的方案选择,由一个人进行「拍板」,这种决策方式速度快,容易抓到事情本质;但是缺点是缺少了团队氛围,不太建议这种一人说了算的决策方式;

群体决策:这种决策方式团队氛围会好很多,通过发表每个人的看法,最后得到合理的、正确的、富有创造力的解决方案;但是缺点就是因为参与者多,需要比较长的时间进行决策,即使这样,也建议使用这种决策方式,不过前提是需要事先确定一个明确的负责人,这样可以对决策后果进行负责。

从小的方面来讲,决策也可分为:

内部 review:设计的作品先在团队内部进行过稿,然后修改,切忌全部做完才进行 review,需要做完一步就进行内部讨论;

外部评审:以会议的形式展开,召集大家对作品进行讲解。

方案的推销

确定了最终方案后,我们需要把它推销出去,具体有以下几种方法:

将思考过程可视化:可以采取上一篇文章的表格分析方式,让设计更有说服力;

自己人效应:对自己人说的一些建议方法更加信赖;

准备一份PPT:展示设计思路;

讲一个故事:以用户的某个使用场景开头,一步步讲解用户的使用情况,慢慢过渡到产品功能设计;

掌握必要的演讲技巧和表达能力:包括口头和文字表达能力,通过这两种表达理清思路,也更好让别人进行反馈。

最后想说的一些话:

作为交互(设计)专业人士,我们需要把握好一个尺度:什么该坚持,什么不该坚持,对于一些专业方面的东西,我们需要团队内部人员都坚持,这样目标会更清晰;但是对于一些比较小的设计细节,有时候可以适当妥协。

总结

如何对设计需求分析结果进行选择:

  • 团队角色分配
  • 交互方案评价标准:可用性、易用性、吸引力
  • 方案的决策

  • 方案的推销

文章来源:优设    作者:Pony欧尼的日常

上亿人使用的百度网盘会员中心,是如何做体验设计的?

资深UI设计者

以下是百度网盘UE团队近期对会员中心体验进行优化,希望对大家做商业化产品有所帮助。

项目背景

会员中心是承载着产品增值权益展示、购买、管理的「集合地」。自2016年起推出会员和超级会员两项增值服务至今已有4年时间,随着时间推移,用户对网盘会员的诉求越来越多样,会员中心也不仅仅承载着支付能力,更多地是获取福利信息和情感上的尊享感知,同时在产品框架上的拓展性和效率也有待提升,因此有了本次会员中心改版项目。

对于设计师而言,我们发起这个项目所面临的挑战,不仅停留在用户体验的优化还需要兼顾商业转化。接下来将从确定目标、会员中心框架重构、视觉语言升级、沉淀通用组件等方面,跟大家分享下改版背后的设计思考。

确认目标

在着手推进项目设计前,我们通过定性和定量的分析,并组织多角色对本次升级的目标进行确认,本次升级的目标是:提升用户决策效率;提升用户尊享感;沉淀设计组件库。

1. 为什么要提升用户决策效率?

会员中心是价值与信息的洼地,用户需要在众多特权、优惠信息中做出决策。整个框架清晰、直观、易懂,是提升用户决策效率及满意度的关键所在。

我们通过支付转化漏斗分析并结合用户反馈发现,改版前,会员中心信息架构比较扁平和单一,缺乏关键性信息的直观展示,比如:优惠信息、会员服务信息,导致部分用户无法在付费过程中更好地做决策。

此外,在支付流程上,操作链条较长,容易引起用户厌倦,导致用户流失。基于这些考虑,我们将对现有框架进行升级,以提升用户的决策效率。

2. 为什么要提升用户尊享感?

会员中心也是用户感知身份变化、感知会员尊享的第一步。改版前,不同身份用户(未开通/会员/超级会员)看到的会员页面却是相同的,无法直观感受到不同身份的差异。

通过UER的用户访谈我们也发现,很多用户出现以下场景:

购买会员后用户,产生疑惑「是否购买成功了吗?」;身为超级会员用户,「感受不到任何尊享感受」;快过期的会员用户,「对会员/超级会员快过期的也感知不到,导致特权中断,影响使用体验」…

因此,我们需要对整体身份的感知进行升级,让用户更清晰地感知到自己身份的层级。

3. 为什么要沉淀设计组件库?

对于产品而言,会员中心也是会员类活动的主要运营渠道。

在日常「小步快跑」迭代需求中,为了提升项目组的开发效率以及更好地实现产品侧多场景模块灵活调用的诉求,需要对复用率较高且灵活多变的模块(尤其是支付模块、特权模块)进行组件化。因此我们也对多个模块进行组件沉淀,提升产品迭代效率。不仅于此,组件化也能给用户提供更加统一的认知,做到产品体验上的统一和规范化。

设计落地

明确了目标后,我们从以下维度进行设计升级,解决现存问题:懂你所想,会员中心框架重构;凸显尊享感知,视觉语言升级;提升迭代效率,通用组件沉淀。

1. 懂你所想,会员中心框架重构

我们本次框架重构的关键词就是「懂你所想」,只有更了解用户,才能提供更符合用户的选择,从而提升用户决策效率。因此,我们在交互框架层面上,做了以下几件事:打造分层布局;强化关键信息;缩短支付步长;智能化推荐。

打造分层布局

进入会员中心的用户,根据会员成长周期可被划分为:历史未付费用户、会员开通中用户、会员即将过期用户、会员已过期用户。

因此,在这次框架设计中,我们根据身份、动机、行为的差异进行分层布局。改变以往的「多人一面」的布局架构,打造出新的「多人多面」的灵活分层页面布局。

当用户是历史未付费用户时,我们更加突出用户的特权介绍和商品支付,便于用户了解会员服务和商品信息;当用户是开通中的用户,我们更加突出用户可尊享的福利信息,突出尊享感;当用户为即将过期用户或已过期用户时,我们展示用户常用特权信息,唤醒用户付费意愿,并为用户提供便捷的续费能力。

下面是改版前后效果对比,从单一身份感知到多元分层处理。

强化关键信息

关键信息也是用户更为「关心」的信息,通过调研发现,网盘用户更加关注会员优惠活动信息、服务到期提醒以及会员之间的差异性,因此在本次升级中,我们对用户所关心的决策信息进行强化,恰如其分地展示便于用户决策,同时提升用户的付费意愿。

新增运营渠道

通过用户访谈,了解到很多用户总是错过网盘的福利活动,不知道在哪里能接受到一手信息。

因此,本次升级我们在会员中心中新增了运营位,增加用户关注的优惠活动的曝光。

服务到期提醒

针对即将过期或已过期的用户,我们会展示用户常用特权功能的即将到期的信息,避免用户特权功能到期后,给用户日常使用带来困扰,比如使用视频原画备份等功能,我们也会提前告知给用户:「3天后即将到期,将不再享有视频原画备份和在线解压等11项特权」,让用户提前做决策。

强化特权的差异对比

此外,我们还强化了特权对比的差异,分别展示了普通用户、会员用户、超级会员用户拥有特权功能的差异性,便于用户根据自身需求选择对应更为合适的会员服务,避免买错等一系列不便或者多花冤枉钱的行为。

缩短支付步长

为了更方便用户进行支付,让用户付费行为更加顺畅丝滑,我们摒弃以往全页面跳转形式,采用了浮层收银台的方式,减少用户在页面间的跳转而带来的迷失感,达到简化支付路径的目的。

也在用户即将过期等状态,保留了原有前置展示商品和支付操作的方式,让用户一键完成续费,方便又快捷。同时,也会在用户选择商品支付时,展示用户帐号信息,避免用户买错的问题。

智能化推荐

与以往不同,我们不局限于通过理性的信息展示,让用户自己搜寻信息、被动匹配,同时我们也在不断尝试采用更加拟人化、对话感的方式触达用户,推送给用户更为关注的信息,更加精细化地探索多样的运营场景。

比如:针对已付费用户,结合用户的使用场景,更多展示特权信息,如:「周末看视频,2倍速、2K、极速加载缺一不可」;

当我们上了会员新特权的时候,也会及时告知用户,让他们享受更加丰富的权益。

2. 凸显尊享感知,视觉语言升级

本次对会员中心的视觉呈现也做了全新升级,不仅凸显会员的尊享感、情感化,同时兼顾用户的识别效率及后续拓展性,针对这一目标,我们做了以下优化:卡面升级,提升身份感;品牌色优化,确保拓展性;icon重塑,强化识别性;惊喜彩蛋,提升情感化。

卡片升级,提升身份感

会员身份卡片是用户直观感受身份变化的第一步。本次卡片设计中,在卡片比例上,尽可能接近于实物卡片,并在卡面肌理表达上,采用磨砂质地,更贴合用户自然认知,卡片颜色结合会员品牌色进行设计。同时结合网盘品牌基因中的logo的「云」,提升品牌差异化。

当用户进入会员中心时,采用光影动效,同时描绘「云」型,提升视觉层次感,同时加深用户认知。

品牌色优化,确保拓展性

我们还重新定义了会员体系的品牌色,超级会员选用黑金配色来突显最高级别身份。

主题色延续了网盘会员色系,超级会员为金色,会员为红色,在此基础上调整色彩明度。新配色在产品界面和运营活动上,能给用户带来更加直观的身份感知。

辅助色为黑白,因为它是色彩世界中的 「 经典 」 ,给人以简洁、纯粹的审美感受和视觉享受。以黑白色作为会员体系的辅助色,可以衬托出黑金配色的尊享感。

icon重塑,强化识别性

在特权icon设计中,强化识别性是本次优化的重点,因为图标的目的是用来辅助用户识别,帮助用户做决策的。

我们在icon表现手法上,从「线性」改成「面性」,增强视觉比重;去除底部圆形衬底,采用异型图标,强化icon之前的差异化,同时异型的icon在占比较小的区域里使用更加节省空间,提升拓展性。

比如,当用户是未付费时,特权icon仅作为辅助图形,因为在这种场景下,icon远没有文案更能帮助用户清晰理解,避免用户买错。

因此异型、面性、无衬底的icon处理手法,也是在拓展方面较优选择。

以下是icon优化后的整体效果。

惊喜彩蛋,提升情感化

尊享感,不仅体现在功能、视觉层面,还体现在情感化关怀,因此我们通过彩蛋式翻卡的触发形式,采用对话的方式,展示互动文案。

当用户首次进行翻卡时,它会贴心问候:「很高兴你与你相遇,愿美好时光与你相伴。」;当用户日常互动时,它风趣幽默:「据说超级会员,法力无边!」「你喜欢的样子超级会员都有~」;当有用户关注的重要消息时,它会及时预告式通知:「4.11日即将有一大波优惠福利袭来,超级会员最高5折哦」,从而营造一个风趣又贴心的小管家,也让我们的网盘会员服务变得更加贴心。

3. 提升迭代效率,通用组件沉淀

会员中心包括个人信息展示、身份卡片、商品和支付、尊享特权、尊享福利、成长体系、专属内容、积分兑换等模块。

其中有多种模块会在多场景中进行复用,为了节省开发及设计成本,同时保证体验一致性,我们本次也沉淀出能够灵活调整各个模块的位置的组件,来提升产品及运营效率。

比如:支付模块;特权展示模块。

支付模块

支付模块承载了会员类商品信息的展示,会在多个场景出现,比如:浮层收银台、会员中心页面、全端收银台,以及会员类运营活动。为了保证支付体验的一致性,我们优先对支付模块进行统一和规范,包括其中的商品展示、优惠展示、以及支付按钮的规范化。

为了便于用户感知到会员与超级会员之间的差异,避免错误购买带来的困扰,我们通过品牌色(超级会员的金色,会员的红色)进行区分。

支付模块的统一和差异,既能保持支付体验的一致性,也能避免用户对会员权益产生误解,为用户带来了更规范的支付体验。

特权展示模块

对于特权展示模块进行特权展示的优化,针对以往特权数量多占用空间大,以及特权展示信息过少用户看不懂的问题,不再采用平铺的方式,而是采用利用横向空间的侧滑方式展示,节省更多空间;不再采用原有的特权图标+特权名称的方式,而是同时展示辅助特权信息,便于用户更加了解特权内容。

并将特权展示方式进行组件化,当有新特权上线时,可直接通过后台配置进行上线,无需进行开发,提升效率。

同时,我们还完成了运营位、专享内容、专属推荐等多个模块的组件化,也根据会员商业化的设计规范,形成会员中心的组件库,提升合作效率及用户统一的认知体验。

总结

以上就是本次会员中心改版项目的全过程,从前期用户调研、目标确定(1.提升用户决策效率;2.提升用户尊享感;3.提升迭代效率),到通过多维度地将目标落地(1.懂你所想,会员中心框架重构;2.凸显尊享感知,视觉语言升级;3.提升迭代效率,通用组件沉淀),不仅优化了体验、提高了效率,也对付费转化率有所提升。

本次会员中心改版,是网盘所有同学的共同努力,同时也是会员中心提供给用户更多选择、更率、更多服务的第一步,它不再是机械的信息展示和冰冷的支付平台,而是更懂用户、提供给用户更多元服务的聚集地。

目前还有很多不足和待完善的地方,我们也在尽最大努力为用户提供更好更有价值的服务,感谢大家一致以来的支持与陪伴 。

文章来源:优设    作者:百度UE团队

如何设计商品列表框架,才能让更多人买买买?

资深UI设计者

今年已经是 2020 了,各位作为时代的弄潮儿,上网冲浪是生活中的不可或缺,丰富的冲浪生活中必不可少的当然是买买买,面对琳琅满目的商品图与文案,用户怎样才能快速抓到重点?或者说,怎么样才能让信息出现在合适的位置?

视觉浏览模型

首先我们要了解浏览信息这个动作的本质和特征,浏览的本质就是大脑通过眼睛去提取信息,是一个传达→解码的过程,在这个过程中又存在一些特性,我们可以利用这些特性去进行一些更的信息传达。

受阅读习惯影响,人们阅读的起始端都是在左侧,结合依据尼尔森等老前辈发布的眼球轨迹研究报告可知,视觉浏览习惯呈「F」型且是不受控的潜意识习惯;同时可以延伸出例如「E」、「Z」等浏览模型,我们可以根据这些视觉模型的特性,结合产品的战略层目标,将信息放置在合适的位置,已达到信息传达率的最大化。

单元结构

了解了基本的视觉浏览模型,那我们的地基就已经搭建好了,接下来我们来看看地基搞定之后的结构要怎么去布局。

首先我们需要清晰产品的属性,电商平台的本质是物品的交易,因为线上的特殊性,产品中图片与文案对于平台的 GMV 就存在最直接的关系。这个时候,单元布局的轮廓就出来了,就是「商品图+关键词文案」。

同时,不同平台战略方向、发展阶段、团队规模等因素的不同,所针对的用户群体、消费阶层、心智、审美等各个因素都会大不相同,有时候甚至在同一平台中针对不同的活动、不同的品类进行细致的场景划分,产生不同的单元结构以满足商业目的上的需要。

720° 全方位了解平台的属性特征后,我们就可以开始利用这么信息来搭建基本的单元结构了。

例如平台主攻下沉市场,用户群体多为三四线,这个时候用户吸引点在于商品的价格与卖点关键词,这时候我们就可以拉大关键词文案的占比,缩小图片的占比,让他们关注的内容尽可能多的进入他们的眼睛,吸引购买意向模糊的用户点击,增加购买意向明确的用户匹配商品的速度,已达到 GMV 的提升。

简单来说,过程中需要考虑到平台因素所产出的图片尺寸/比例/精致度/是否统一等,与文案搭配所呈现的是否适用当前消费场景及用户心智,是否可以提升用户的转化率,是否可以提升平台的下单率。

单元的架构是多样且复杂的,就像一块七巧板。重点就在于对于产品属性和用户行为、场景、心理等特征的分析,需要权衡各个关键点的重要性,把用户需要看到的信息、我们想让用户看到的信息、用户希望看到的信息以合适的结构状态呈现给他。

点睛标签

我们将大体架构搭建好之后,剩下的就是要把细节元素给点亮,让他们起到一个点睛的效果。

细分一下,其中涉及到的细节元素大致为活动标签、折扣标签、跳转按钮等常规的分子部件,在结构中,图片、商品名称、价格是用户关注的重点,其他的部件则起到辅助刺激的作用。图片和商品名称的大体结构我们在上一步已搭建了,剩下来我们看看这些小部件该如何合理归置。

先从标签说起。整体框架出来了,用户所需要了解的商品信息就已经基本呈现了,这个时候用户心智上更多的主观意向,寻找合适的商品,而标签的出现,更像是一剂兴奋剂,强烈告诉用户:「这个品热度第一!」、「这个品是款!」等我们刺激用户的声音,增强用户查看的欲望。

这个时候疑问来了,那放哪里合适呢?

活动标签,多为显示该商品的热度、促销主题、排名等一些大的状态性的信息,为的是在用户心理层面给这个商品带来更多的好感度,放置的位置可以结合具体场景去分析,可以考虑与商品图进行结合放置。

遵循由上而下滑动的交互原理,我们可知在每个单元的顶部会是滑动浏览时第一被眼睛识别的信息,而且可以利用这个心理去给还没看到具体商品的用户进行一个心理铺垫,比如商品的品质、权威性等,先入为主的进行心理建设,再结合视觉浏览模型,合适的位置就出来了。

次要信息比如倒计时、商品折扣、商品特点等辅助信息,结合布局场景考虑,有的可与图片一起放置增强品质感,有的可与文案一起放置增加决策信息,有的可与价格一起放置,刺激用户进行决策,是很有灵性的一个点睛之笔。

最后是按钮,在这里的按钮可以理解为浏览过程的一个闭环节点,也是一个操作的终结点,是最后的临门一脚。位置当然是在右侧最为合适,降低操作难度,同时也是整个单元的一个视觉终结点,浏览完流程之后决定是否点击跳转。当然,你可以利用你的方式去引导或刺激用户点击,你可以的。

总结

  • 多方面的了解战略目标、市场因素、用户目标、画像、场景、心智等等信息;
  • 利用视觉浏览模型进行信息的合理规划和引导;
  • 根据平台的特性对框架进行布局,左右结构、上下结构,依据平台特性而定;
  • 标签可以起到很合适的辅助作用,放在相应的位置可以起到多样的效果;

  • 按钮作为闭环节点,降低操作的难度,有需求的话可以用你的方式去刺激或者引导。

文章来源:优设    作者:阿类杂碎面

高手是如何利用认知偏差,打造独特用户体验的?

资深UI设计者

为什么大爷大妈们总对排队情有独钟,为什么平常不想要的东西一打折就买一堆……震惊!原来套路你的竟然都是自己的大脑!

如今想要成为一名合格的用户体验设计师,首要就是对目标用户的理解和把控。而为了实现这一目标,掌握一些心理学知识就显得尤为重要。当我们能在设计中合理利用心理学的时候,就离创造出让用户感慨「深得朕心」的体验不远了。

这次要介绍的是设计心理学中与我们日常生活密切相关的认知偏差 (Cognitive bias) ,了解它的基本定义之后再结合相关案例探讨如何在设计中利用认知偏差来创造更好的用户体验。

什么是认知偏差

网络上的定义是这样的:人们在知觉自身、他人或外部环境时,常因自身或情境的原因使得知觉结果出现失真的现象。

简单来说,就是大脑创造了一些快捷方式,在处理信息时自然地去调用这些快捷方式,只是这种操作在快速的同时,也会对我们的决策过程产生危害,比如我们会选择性忽略一些信息,或是自发地对信息进行脑补。这样的认知模式导致我们产生了非理性的偏差。

△ 图:大脑的操作

认知偏差种类丰富,已经被提出的就有几百种,有很多尚未被完全验证。下图总结了现有的认知偏差,它们大概可以分为四类:信息过载,信息的意义不明确,大脑来不及认真作出反应以及大脑存不下所有的记忆。通过这张图,我们可以更清晰地了解不同认知偏差背后的成因。

△ 图:认知偏差宝典

认知偏差在体验场景中的应用

那我们该怎么在设计中利用认知偏差呢?我根据日常工作中经常接触的消费场景和学习场景总结了以下几个方面:

△ 图:章节概览,也叫懒人速读版

1. 引导用户决策

作为体验设计师,我们需要为用户的决策创造合适的环境,来引导其按照我们设计的方向去达成他们的目标。

锚定效应

锚定效应(Anchoring)是比较常见的一个被利用在消费场景中的认知偏差。它指的是人在做决定的时候,会在很大程度上依赖于其接触到的信息。

比如商场里原价 2000 现价 500 的商品,原价的存在会让人觉得这件商品的价值就是 2000,现在 500 简直是捡了大便宜。

在体验设计中可以借鉴这种做法,通过前后对比放大来优惠感知,进而促进用户做出有利于我们的决策。

△ 图:利用锚定效应推荐会员套餐,对比差价确实诱人

从众效应

从众效应(Bandwagon Effect)是另外一个常见的用于消费场景的认知偏差,指的是人们做决定时通常会和他人保持一致。

下图是售前页一般的设计技巧,通过展示购买人数和滚动播放购买信息来体现出该商品的热门,让正在犹豫的用户「随大流」下单购买。

基于此,我们在设计中可以营造出一种群体选择的效果来吸引更多的用户。

△ 图:这么多人选择,跟随大家不会错,买它

内群体偏差

前面提到的认知偏差之外,内群体偏差 (ingroup bias) 也一般被用来引导用户决策,它是指人们会在认知上倾向于自己所属的群体。

比如 Booking 在查看评论的区域加入了筛选评论语言这一按钮,虽然设计的本意可能是为了方便用户更好地理解评论内容,但是在真实的使用过程中可以发现,用户更加信任自己所选标签内的评论内容,因为同语言往往意味着来自相同的国家或者相近的文化背景,用户通过这种方式找到一个小群体,然后被影响进而做出与群体内人们更为相似的决策。

△ 图:同胞的评价更可靠

因此在体验设计中利用内群体偏差的关键点在于打造群体归属感,借由小群体的力量影响用户的决策。

2. 提高用户粘性

引导用户做出于我们有利的决策之外,同样,我们可以利用认知偏差提高用户粘性,增强用户和产品之间的联系,使他们对产品「爱不释手」。

宜家效应

宜家效应 (The Ikea Effect) 是指消费者对于自己投入劳动、情感而创造的物品的价值产生高估的价值判断偏差的现象,消费者对于一个物品付出的劳动(情感)越多,就越容易高估该物品的价值。利用宜家效应提高用户粘性的核心是创造低投入、高回报、高贡献价值的任务,保证用户能够完成任务的基础上贡献自己的价值。

在学习场景中我们可以利用宜家效应提高用户粘性,将用户留下来坚持学习。

首先需要保证用户能够完成任务。懂你英语 ®A⁺ 产品中,我们会在用户设置目标时描述该目标的表现,用户以此选择自己的目标。这种方式下的用户对于任务结果的预见性提高,能清楚的知道如果完成任务会达到什么效果,更能被促使顺利地完成任务。

△ 图:目标展示与贡献积累

其次,用户对产品粘性增强需要能够感知到自己所做出的投入,学习场景下这种投入感知更多体现在知识的累积上。在懂你英语 ®A⁺ 课程中,我们将用户与目标之间的距离设计为学习路径,用户每完成一个阶段的学习便会在路径上明显前进,日积月累下来用户能看到自己前进的印记,清晰感知到自身知识的累积,也就因此对产品有更高的价值感受。

3. 情感化激励

负向偏见

由于学习的「反人性」,学习场景下的用户在体验流程中产生消极情绪的概率要大于其余场景,比如学习效果不好,难以坚持等。此类消极情绪对于学习产品影响很大,是因为负向偏见 (negativity bias) 的存在,人们对不好的事情的记忆比快乐的记忆更加清晰,更经常回忆。

因此在学习场景下我们需要给用户更多的正面积极的反馈来抵消掉负面体验的影响。在懂你英语 ®A⁺ 课程设计中,我们在学习结果页根据用户不同的学习表现给出不同的反馈,即使是偏低的成绩,也依然会给出一个较为积极的反馈,以期鼓励用户坚持学习。

△ 图:做得不好也不要灰心

除了简单抵消掉用户的负面偏见,我们甚至可以通过设计去完全扭转局面,变困境为有趣的体验。最经典例子便是谷歌断网时的小恐龙游戏,不知道有多少人会故意关掉网络来玩这个游戏。

△ 图:谷歌的断网小恐龙

最后

作为设计师我们可以通过了解和利用认知偏差来创造既让用户满意又平衡商业的双赢体验。但由于设计师本身也是人类,与用户拥有同样的思考机制,因此在日常的调研分析和设计的过程中也要警惕认知偏差的影响,不断深入了解用户以及使用科学的测试方法来完善自己的设计,持续迭代反思,不因为某个方案自己倾注了很多心血,就觉得它是最好的。用户可能并不买账呢。

从四个角度,帮你快速了解瓷片区设计

资深UI设计者

最近设计项目中涉及到「瓷片区」,于是和一些设计伙伴请教了解了一下,在此记录总结一下,也希望可以对大家有些小小的帮助。

什么是瓷片区

听说:美团内部将首页的运营广告位模块称为瓷片位,其可以根据需求变动灵活调整,就像瓷片一样灵活适用,顾名思义,瓷片区也就被叫开来了。

根据下图我们可以了解到,瓷片区在产品中的应用。

瓷片区的功能

瓷片区作为与 Banner、金刚区并行的三大运营板块,都负责着导流的功能。瓷片区较两者更便于在页面中进行布局,可以灵活复用。

在电商产品中,导流指的是通过某种形式,增加对商品/功能的曝光,使自己的用户群去购买或了解感兴趣的商品/功能。导流简化流程:导流入口 → 落地页 → 转化率,设计师需要通过在这个流程中收集的数据,进行复盘反思优化设计。

瓷片区常见类型

瓷片区属于运营区,在页面中通常位于用户容易点击的区域。通常为图文混排,常见的类型有:实物类、插画类。

1. 实物类

应用场景:需要对商品/服务有高曝光度的产品类型,如外卖、电商、旅游类等,通过对自有商品/服务的直观展示,达到吸引用户的目的。

优点:识别度高、适配千人千面、元素更换灵活;

缺点:图片质量要求较高;

2. 插画类

应用场景:常见于金融类、虚拟类产品。

优点:高度概括主题的图形,通过插画增加产品的调性和趣味性;

缺点:针对性比较强,难复用,花费时间;

设计关键点

1. 排版

瓷片区常见排版方式:左右排版、上下排版和对角线排版。设计师可以将三种排版方式组合设计,使页面更具有节奏感;

  • 左右排版:图标/插画左右布局,一行展示 1 块或 2 块,适用各种场景;
  • 上下排版:图文上下结构布局,一行至少展示 3 块瓷片,适用于功能入口;
  • 对角线排版:图文呈对角线布局,一行显示两块瓷片,适用于文字信息较多的需求;

2. 图片

对于电商或商城类产品来说,配图的好坏是影响用户点击率最直观的元素;设计瓷片区时需要考虑全局配图和局部配图的情况:

  • 配图质量:高质量、符合产品调性、背景简洁、抠图边缘一定要干净;
  • 配图规范:统一图片或插图的尺寸和视觉面积;保证图片之间的差异性;提炼关键文案信息。

3. 文字

  • 主副标题:通过大小、粗细和颜色进行区分,颜色不宜过多;
  • 标签文字:结合需求属性和定位,处理不同层面的标签;

4. 背景

瓷片区背景常见类型:白色/浅色背景、渐变色背景;设计师根据产品调性及业务需求对背景进行灵活使用,但要遵守以下原则:

  • 层次清晰,是否对最重要的元素有所突出;
  • 易读,保证文本及商品符合所有设备的易读标准;
  • 视觉表现力,强化品牌风格;

小结

文中从四点对瓷片区进行了一个概括性的了解总结,设计要点的话在排版设计中都是需要注意的基础知识所以未多加赘述,以此为自己在项目中遇到的知识点做一次沉淀。

文章来源:优设    作者:木子的小千世界

你想要的免费商用插图,这个网站全都有!

资深UI设计者

一转眼,夏天就来了,设计中需要清新又抓人眼球的图片,老板又要求使用各年龄段都喜欢的插画风格,应用场景要广,但是预算又没有那么多,该怎么办呢?这也不是熬夜就能熬出来的,不要烦恼,下面这个网站立马解决你上面所有需求的同时,还能帮助提升你的工作效率,延缓你秃头的时间。

这个创造性超强的插画制作网站就是 BLUSH ,你可以根据自己的想法进行元素的替换,也可以直接使用 8 位网站合作设计师的现有作品,超清新的颜色和多样的搭配空间,绝对会让你十分满意的,无论是做 Banner、海报还是用作文章中的插图都十分合适。最重要的是,可以免费商用!接下来就跟着我一起,走进这个网站吧。

网站链接:https://blush.design/

网站内拥有 12 大种类的插画图库,包含人物、城市风景、植物、甜点、涂鸦等等。选择你喜欢或者需要的一类,就可以开始你的创作。操作类似于换装游戏,在各个你需要改变的地方更换你喜欢的元素就可以。如果你要摸清整个网站可以产生多少种搭配的话,可能需要花上你不止一天的时间哦。

从上图可以看出,单在人物上,网站就提供了不同的风格,有像儿童形象的「Friendly ones」,也有极简线条的「Big Shoes」,还有夸张超炫的「Power Moves」等等。接下来,为了更好的理解网站提供的服务和操作的方式,我选取实用多变的「Croods」来演示。

首先在栏目左侧选择「Croods」,就会看到下面这样的界面。最上面是设计师的作品,下面则是可以由你自由创造作品的入口,造型可以选择站着或者坐着,场景可以选择谈话、聚会、公园等等,整体的背景也有五大类供你选择。

这里我选择点击「Peaceful Place」。网站出现的作品很符合现在多数人在家办公的状态,如果你不想自己动手,那直接选择这张图片或者点击「Randomiza」再随机生成一张图片,自己满意之后,点击「Download」便可以获取 PNG 格式的图片,不过,高品质 PNG 和 SVG 格式则需要付费。

当然,你也可以通过改变图片上的各个元素,生成你所需要的场景插画。例如想要一个盘着腿坐在沙发上发消息,和朋友聊天聊的很开心的一个形象,就可以通过下方给予的元素进行个性化定制,把表情改成开心,电脑换成手机,右上方替换成聊天框,最后导出为下图的样子。如果想要多人的场景,在上一步选择多人的场景进入就可以了。

同时,网站也支持下载插件,方便众位设计师在 Figma 中更好的运用。在首页点击右上角的「Get Plugin」进入页面,注册账号就可以顺利安装插件。大家可以根据自己的需要选择下载插件或者直接在网站上在线制作。

最后,不得不提的一点是,网站图库在兼顾多样性和平等性上做了很大的努力,人物的肤色可以随你改变,残疾人也有一席之地,可以选择为人物匹配轮椅,或者给人物戴上假肢,涵盖尽可能多的人物情况和场景。相信这样的网站一定能满足你丰富的设计需求,快去使用吧!

文字来源:优设    作者:山楂

如何做好儿童节设计?

资深UI设计者

在教程开始之前,我先说一下今天的教程我们会讲哪些部分。首先我们会分析儿童风格的特点、然后在这些特点之上给大家演示绘制一些插画小元素。

我们先来看一下这些海报里,是不是很容易就能分辨出,哪一个是关于儿童主题的画面?

可能刚刚的会比较明显,那这组是不是也同样可以分辨出哪一个儿童感比较强的画面?儿童感它既然能够在这些风格里凸显,它一定有一些特点。那么接下来我会通过几个方面去分析这些特点。

物体的选用

我们要选用一些符合儿童风格的元素。植物是儿童画里出现最常用的元素,动物作为自然界的一份子,当然也非常适合。一些儿童属性的物品。比如书本、棒棒糖等。还有天空的云朵、房子这些儿童画画的时候经常出现的元素,都非常适合儿童画面。

但是一些明显不属于儿童用品的元素就不合适了。比如说口红,口红不会让人联想到儿童,更多是成年女性。骷髅头这种恐怖的物体也不能出现。

那我问一下,眼镜适合吗?如果是这种尖锐的眼镜的话可能不太适合。

但是一旦它的外形变得圆润可爱,就很合适。很多物品也像眼镜一样,只要把外形改变得更符合儿童的气质,就不会显得突兀。

假如某一些物体儿童化特征不明显,而又想让它有儿童感,那应该怎么做呢?加入表情,表情简单可爱,就能表现儿童感的情绪。

每个物体加上表情就会变得可爱。但也正因为这些表情加在了本身没有表情的物体上,所以风格里有一种搞怪感。

颜色

我把随机下载的儿童海报拼接在一起,整体分析它们的特点。

儿童插画的海报元素使用的色相比较多,这里随机抽取的海报里,画面都是使用了比较多的颜色,红、黄、蓝、绿基本都用上了。

在饱和度上都偏高,一般保持在 70% 以上。

明度方面,把画面模糊再变黑白,我们可以看到整体画面给我们的感觉是比较亮的,就连中间用了大色块的海报的明度也在 50% 以上。而存在的一些深色也是作为画面的点缀。

那么总结起来,一般是色相选取的颜色比较多、饱和度比较高、明度比较高。我们以这张图为例。

当它的颜色种类变少的时候,画面的活泼程度就会降低。

而饱和度变低后,不仅活泼度降低,这种颜色的风格会趋向于成人化。

画面的颜色变深之后,画面就没有透气感。有一个很合适的成语形容,叫「老气横秋」。就是缺乏朝气的感觉。

形体

那么儿童插画的形体有什么特点?总结起来有两个特点,简单和随意。首先儿童对世界的理解还不够深,能力也不足,往往画岀来的东西都是以概括的形式。

比如儿童画一颗真实的树的时候,去掉很多细节,把一个物体比较有特征的外形表现出来。比如儿童画一颗树可能是这样画的。

其次儿童的能力和经验不够,画画的时候边缘都是比较不平滑的,看起来比较随意。

而且就算本来在他眼中是对称的物体,因为手绘的感觉而看起来歪歪扭扭。

当一个物体简单成平滑的几何形的时候,它是偏向于设计感和现代感的。当它越来越接近于随意感觉的时候,它的儿童特征会更强,同时更亲切。

就像这些作品,虽然是插画师画的,但是却有很强的儿童感,就是这种简单和随意再加上插画师的审美形成的画面。

要注意的是简单和随意的把握,太过随意,商业化的价值就不高了。

画面布局

儿童海报里的插画虽然每个元素比较简单随意,但是要保持画面比较完整,是需要很多元素的拼凑的。

就像这个幼儿园品牌的元素都特别随意,但是最后呈现的效果却也不错,除了在延伸上花了很多心思之外,还因为它的元素比较多,看起来不至于太单薄。

而这些元素的摆放可以不遵循严格的透视和逻辑,这种方式体现了儿童绘画和成年人严格的绘画原理的不同。

案例演示

能满足上面的特点的儿童风格有很多,在这里我打算用一种比较简单的绘制风格,来进行操作的演示。

首先我们画一颗简单的树,来看一下这个风格。外形不会追求非常的对称。

就连树干我也是用「画笔工具」和鼠标画的。营造一种随意感。

在这里调整一下最后整体的外形后,我们会发现它的边缘和线条都太顺了。没有手绘的自然感。

所以我们要用到「变形工具」,对边缘进行推拉,这样它的边缘就不会特别光滑了。

最后调整一下尖锐的锚点,树就这么简单地完成了。

大家可能会觉得这个风格过于简单了,我用画动物,去讲解一下其中的细节。首先还是用「钢笔工具」,把形体轮廓和主要部位画出来。 大家是不是觉得画到这里就完成了?其实这个风格比较简单,如果没有一些装饰感的细节的话就会显得太过随意了。所以在这只鸟里,要去想怎么添加一些细节。

首先可以加个腮红。腮红的颜色不一定是红的。像鸟的身体色块面积太大了,需要有装饰,所以画几条羽毛。羽毛的形状太过规矩了,还是需要转曲用「变形工具」调整。

还有尾巴的部分也是需要用线的形式让整体更有细节感。最后都是要用「变形工具」让它的线条有种随意感。

最后的细节在嘴巴上添加,直接画一条直线。其实添加细节就是不要出现一整大块的纯色色块。

对于物体的简化不用太过于死板,比如我们现在看到的这个植物,它可以直接简化成圆形和密集的点的组合。

一开始我是直接用「剪切蒙板」的,但是这样边缘过于光滑了,而且里面的点也被框住,不够美观。于是就把点的分布超出圆形一点。这样看起来就比较有细节了。

而我们通过改变形体,就可以演变出很多种不一样的形态。比如这个物体,我在做的时候想能不能把中间的圆缩小一点 。黑色的点占比再大一点。这样就产生了另外一种植物。

甚至还可以直接去掉中间的圆,把点再放大作为主体。原本的点放大会变得太过随意。所以只能通过画圆形和「变形工具」调整。

这样又可以得到不一样的一颗植物了。这样的演变可以根据画面的需求选取不一样的植物。

所以在这里我已经画好一套常用元素的素材了。以植物动物为主,基本能满足日常设计中的需求了。这套素材会分享给大家,在我们的订阅号后台回复「儿童节素材」就可以下载。这套素材是允许大家商用的。有了素材后,怎么用呢,接下来我将用这套素材演示它能怎么使用。

这些素材可以在画面作为点缀营造气氛。

直接使用这些素材,堆叠成完整的画面。

也可以和图片中的人物或者产品做穿插。

接下来用一个案例演示一下,我是怎么用素材的。这个是学而思的手机端海报的文案,主要有标题部分、课程内容、和二维码等。

首先建立一个手机端尺寸。设置好版心的大小。在这里我做的是下方卡片式的结构。(白色色块部分是海报)

可以先把文案编排进来。首先安排好大的元素,二维码和活动价格。主讲老师和上课时间的小标题,字号大小要保持一致。卡片里的信息就编排完了。

标题是画面最大的字号放在上方,副标题和补充信息和大标题居中。接下来就是要在画面中添加我们的素材了。那么怎么选择呢?首先要定好你要选择的元素范围,不要同时出现太多种类的元素。以植物为主、再加上几个元素点缀是一般不会出错的选择。

首先添加的是面积比较大、块面化比较明显的元素。这里就加了三棵简单的树。

接下来就是添加一些更有装饰感的花花草草。

在添加元素的时候也要注意画面点、线、面的结合。就比如现在我们添加的元素主要是以面和点为主。

虽然树的树干也有线,但是轮廓的线条太「顺」了。

所以要添加「线」的特征更明显一点的元素。

在画面的上方加上适合存在画面上方的元素、比如长颈鹿因为本身比较高,所以没问题。把标题移到适合的位置,加蒲公英作为点缀。最后只剩下中间的部分怎么做出和主题相关联的画面了。

我们还有一个信息可以放在人物的手上。最后一个元素就从海报的主题出发。既然是学习的内容,可以画一本书,放在背影上。元素的拼凑完成了,最后就是细节的添加。

现在画面下方的信息不够突出,是因为卡片和背景都是白色的,所以下方加上一个深色的色块,让信息更显眼。

突出的信息可以变颜色。

背景变成黄白色,最后加上 logo。现在画面好像完成了,但是我最后还发现了一个问题,画面上的颜色饱和度都很高,各种颜色之间碰撞,看起来有点透不过气的感觉。

是因为画面缺少浅色。所以我选了两个花把它变成白色。

现在这个素材使用的案例就完成了。

最后要说明,这一套素材它只是一种风格,我们教程前面有说到的任何一个因素的改变都可以演变成无数的风格。

比如它的颜色搭配也可以变,变成一种更亮眼的颜色。或者说它变得更随意,有笔触的自然感。甚至还可以是画画技法风格变化。也可以为每一个元素都加上眼睛,一种搞怪感就出现了。所以是有无限的可能性的,最重要的是要学以致用。

做好画面还不够,我们画面选择的字体也是很重要的,那么我觉得这几款字体做得都不错。

文章来源:优设    作者:研习设

后来居上的抖音,做对了什么?

资深UI设计者

当下“两微一抖”已成为企业品牌传播必备的渠道策略,可见抖音的江湖地位不容小觑。

抖音,诞生于2016年9月,是一款“音乐创意”短视频社交软件。截至2020年1月,其日活跃用户数突破4亿,而同属短视频行业的快手的日活跃用户数也才刚过3亿。要知道,在2016年6月,当时抖音还没上线,快手就坐拥3亿注册用户数。显而易见,抖音不过是一个后起之秀,却能傲视群雄。

短视频行业的数据统计

也有数据表明,抖音用户的粘性很大,转去玩快手的用户只有55.6%,反而快手用户转去玩抖音的高达68.2%。快手高级副总裁马宏斌也曾透露,快手前100名的大V有70个是抖音用户,抖音前100名的大V只有50个是快手用户。

想知道抖音是如何后来居上,必先了解冰山模型

一般认为,一个人80%的成功几率是由冰山模型水平面以下要素:动机、价值观/性格和综合能力决定的,另外20%是由冰山模型水平面以上要素:经验和技能决定的。

而且,上层要素的生长受到底层要素的制约:一个人有什么样的动机,就会促使他/她着重培养哪方面的综合能力;有什么样的价值观/性格,对他/她的行为举止也会产生一定约束力,什么该做,什么不该做。

互联网产品的冰山模型

如果把一家互联网公司的品牌视为一个人,那么动机就是品牌价值,价值观/性格就是品牌人格,综合能力就是营销4C中的用户需求(Customer)和学习成本(Cost),经验和技能就是营销4C中的消除障碍(Convenience)和用户运营(Communication)。

抖音的成功可从冰山模型自下而上进行总结:

1. 底层构建了一个让人为之惊叹的品牌人格

从最初的品牌Slogan——让崇拜从这里开始,以及有一头条的员工在朋友圈晒出公司的背景墙——让更多人的美好生活被看见,可以看出抖音成立的动机——帮助更多人提升个人知名度。

字节跳动的公司背景墙

这个动机是基于对社会冲突的深刻洞察:近年来各类选秀节目(如:中国好声音、超级女声等)的热播透露出许多年轻人心藏一个明星梦,但由于家庭出身、人际资源、社会财富等先天条件限制不得不放弃追逐梦想。城市已经发展到需要一个品牌来给这批年轻人创造机会的时候,抖音应运而生。

作为一个创造者,抖音还找到了提升个人知名度应该具备的人格特质——精致(Sophistication),并以这样的人格特质与城市年轻群体沟通,包括借助明星光环来诠释何为精致、掷重金在各大城市举办美好生活节……这些事件在目标群体里迅速传开,并取得目标人群的情感认同和品牌信任。

在抖音里明星云集

注:精致(Sophistication)、称职(Competence)、刺激(Excitement)、坚韧(Ruggedness)和真诚(Sincerity)是J.Aaker通过问卷调查得出的五大最容易被消费者感知的人格特质,而且这五大特质也能概括许多流行品牌在消费者心目中的人格形象。

2. 浅层做到了品牌价值稳定输出及承诺兑现

在站内,抖音致力于帮助更多人提升个人知名度,加强产品功能和用户体验,让更多人得到同等机会展示自我。

在用户需求(Customer)方面,采用了去中心化内容分发机制,当内容创作者发布一条短视频后,抖音并不是把这条短视频发给创作者的所有粉丝用户,而是小范围分发测试这条短视频的潜力,让可能喜欢这类内容的标签用户通过行动来评价。只有获得更多用户认可的优质短视频才能得到二次流量推荐,进而成为爆款,创作者就有机会爆红。同时,采用了全屏自动播放模式,让每一条短视频都能被观看,不失为一种公平竞争。

抖音的产品功能

在学习成本(Cost)方面,采用了中心化内容生产机制,组建了服务达人的MCN机构,由平台签约明星、网红和大V推出一个个可复制、易模仿的有趣短视频,降低用户学习门槛。同时,运营团队也会不定期发起各类短视频挑战赛,提供各种滤镜、剪辑技能、流行音乐等素材,即使普通用户没有创新力,跟风模仿也能拍出看起来酷炫的、专属于自己的15秒“大片”。

3. 顶层把精致人格和品牌决心展示得更直观

在站外,抖音秉承“精致”理念开展一系列PUGC营销活动,持续影响用户的感知,并不断强化精致的人格特质。

抖音冠名综艺节目

在消除障碍(Convenience)方面,抖音通过冠名一些和明星互动的综艺节目,比如中国有嘻哈、快乐大本营、天天向上等,借助节目酷炫的舞台效果和高度吻合的受众群体,消除年用户从产品感知到下载应用之间存在的疑虑——抖音是否有实力助我提升知名度?事实上,抖音已经帮助不少草根明星(如刘宇宁、陆超等)登上主流媒体的舞台,让用户看到了展示自我的机会、成为明星的希望。

在用户运营(Communication)方面,除了大众明星入驻,引入其他平台的网红和大V,还与多家MCN机构合作,扶持和培养平台内的潜力用户,保证内容的质量和持续产出。同时,不定期更新挑战活动、热门搜索、加强品牌合作激励用户创作,以增强用户对抖音的依赖和活跃。在参与创作的过程中,用户也能得到抖音提供的专群维护、不定时礼物、拍摄指导、流量曝光等多方面帮助。

抖音品牌活动及福利

写到这里,你可能会惊叹一声:哦,原来如此!

但是换到自己来做品牌、运营产品,你就会一脸懵逼了。要么无从下手,要么觉得每天的工作就是打杂,不知道做这些运营动作意义何在。你制定的运营计划也可能是杂乱无章,运营策略多半也是效仿其他大品牌,在各个产品生命周期阶段没有什么不同。

产品运营人的苦恼

产品运营的策略制定

所以,我们应该从抖音身上学如何“做正确的事“,并且”正确地做事“——把产品当作对社会有贡献的人来培养,寻找能让它快速被社会接纳的人格特质(做正确的事),然后在不同的成长阶段制定相应的历练计划,并长期坚持做事风格的一致性,而不是一天一个花样模糊了用户对品牌的印象(正确地做事)。

从抖音身上学如何“做正确的事“

第一步,了解产品所属的行业发展到哪一阶段

行业生命周期曲线

探索期:市场供给量和需求量低,增长速度只有3%左右。只有一部分有研发实力的企业在生产产品,因为试错率高、生产成本高,使得企业不敢做出太多花样,产品售价普遍也高。对于消费者来说,老产品的转换成本高,新产品的功能还不稳定,普遍是观望态度。

成长期:市场供给量和需求量增加,增长速度达到10%以上。这时候产品技术已取得突破性进展,可大规模复制生产,部分产品还是供不应求。随着进入市场的企业数量增多,企业的竞争就是价格战(红包、补贴)和产品多元化,助长了市场抢购风气,强化了消费者对价格的敏感性。

成熟期:市场供给量和需求量接近峰值,增长速度在5%以下。企业占有的市场份额越多,其产品销路越宽卖得越好。企业之间的竞争从瓜分空白市场变成了抢占对手的市场,营销手段多了起来,导致消费者出现了选择困难症,这时企业的口碑开始发挥了作用。

衰退期:市场供给量和需求量下降,增长速度在0%以下。消费者的消费观念改变了,市场出现了供过于求的现象,而替代品日益增多又带来冲击,企业开始大批量清理库存,行业标杆在现有的口碑基础上向新产业转型,小工厂则因资金不足被迫退出市场。

从行业的发展规律来看,只有产品的企业会因行业变化而被淘汰,但是有好口碑的企业却不会,因为它可以引导用户消费来应对市场挑战。

第二步,在当前发展阶段应为用户带来耳目一新

新媒体时代下的需求

首先,根据行业供给和需求特点细分出公司产品的目标用户群,描绘能给产品创造最大价值的核心人群画像,然后洞察他们在社交生活中未被得到满足的需求:在新媒体时代,每个人都想成为“主角”,年轻人更急于寻求个性表达,但自拍效果不够酷,也没有太多技能加持。

其次,了解标杆/竞争对手又是如何解决这些现实冲突,对目标用户群说了什么。作为抖音的头号竞争对手——快手,以“记录世界,记录你”作为Slogan,具有很浓的个人主义色彩,乍一看以为是帮助感情受到挫折的人走出伤痛,学会自我疗愈。

最后,顺势而为,不违背或超前于行业发展,将核心人群的需求痛点与公司产品利益点建立连接,从事实主张、认知区隔、情感主张和价值区隔中挑选适合当下的一种广告内容。

不同生命阶段的产品广告内容

事实主张:根据品牌内部能力或资源的明显优势进行突出定位,传达所具备的事实优势壁垒,直击重点。如:早期的抖音——让崇拜从这里开始。

适用评估:企业在行业中具有先发优势,在组织资源方面具有强大的科研能力、上市速度快,在产品/服务方面是行业唯一,不容易被模仿/超越。

认知区隔:在受众心中建立独特记忆认知,让受众对于该品牌和其他某种特定行为或体验产生强关联,从而做出选择。如:现在的抖音——记录美好生活。

适用评估:行业中出现了新的关键驱动因素,消费者心智中还有其他尚未被占领的空间。

情感主张:提炼品牌中蕴含的情感因素,通过向受众传递美好的情感联想,让受众将心中期望憧憬与品牌实现关联。如:格力——让世界爱上中国造。

适用评估:除功能性需求外,目标用户群还有情感性需求未被满足。相比竞争对手,产品包装设计、信息传播更能触动用户情感,公司愿景能够引发消费者共鸣。

价值区隔:传达品牌对于受众产生的某种独特价值观,且能通过产品体现在受众心中形成心理认同,产生价值共鸣。如:耐克——Just do it。

适用评估:已经积累了一定数量的用户群,公司愿景切换用户心理并引领时代,取得了行业KOL、大V等背书。

第三步,扮演极具感染力的人来讲品牌价值所在

品牌人格原型及特质

将创始人/团队个性特征和公司产品的发展愿景两方面因素综合匹配,找到适合公司长远发展的人格原型。

不同的品牌塑造如同人的成长,不同的基因决定了不同的人格,不同的人格决定了不同的传播调性,不同的传播调性又决定了受众对品牌的不同反应。有生命力的长寿品牌是具有人格原型的。一个成功的品牌人格,可以让品牌拉近与用户的情感距离,并且在用户心智刻画出鲜明难忘的品牌形象。

所以,确立相应的品牌人格后,找出核心人群最可能听具有什么样人格特质的人说的话,然后学习这类人的表达方式、行动风格等,以此作为产品运营的人设模板并长期坚持不断强化。

第四步,明确当前产品生命阶段的任务是什么

产品生命周期曲线

产品所处的生命周期阶段一般可从以下几个方面进行判断:

  1. 将产品日下载量/销量变化趋势曲线与生命周期的“S”曲线拟合;
  2. 将产品累计下载量/销量与市场总量及潜在用户总量对比,评估上升的可能性;
  3. 将产品的百度指数与行业标杆/头部竞品的对比,客观评价产品的差距;
  4. 观察产品的日/月活量、营收等平台数据波动情况,预判上升的幅度大小。

探索期:日下载量/销量极低,市场占有率几乎为0。该阶段主要任务就是寻找高质量的种子用户,让用户参与产品体验,并对产品提出优化建议。种子用户一般控制在100个左右,多了会交流不过来,严重地会导致分不清主次需求。这些种子用户可以是有一定圈子影响力的同事或朋友,与产品沾边的相关领域意见领袖(KOL),微信(群)、微博、垂直论坛等网络大V。那么如何让对方搭理我们愿意成为种子用户?我们得事先准备一个鼓舞人心的品牌故事,愿景是致力于解决某一个非常紧迫的社会难题,现正寻找一群志同道合的人一起攻克。

成长期:日下载量/销量、 日/月活量、营收增多而且增速较快,但与头部竞品的市场占有率相比还有很大差距。该阶段的主要任务就是激发用户尚未意识到或未被满足的需求,一旦使用产品后能够给生活带来不一样的感觉。例如,有些年轻人喜欢自拍模仿明星,但鲜有人围观,最终沦为自娱自乐。于是抖音推出一条“找呀找呀找爱豆”竞猜H5,一下子刷爆了朋友圈,为模仿者,也为抖音带来了巨大的流量关注。在那之后,抖音开始找一些明星合作增加产品流量和话题,让更多的用户也加入到抖音队伍中来。

让抖音一炮而红的宣传

成熟期:日下载量/销量基本稳定,已占据了一定市场规模,但日/月活量、营收仍在增加。该阶段主要任务就是对用户进行精细化运营,围绕用户的地域、人口特征、消费品类、品牌偏好,购物行为、生活场景和用户价值七大维度进行用户分群贴标签,然后收集用户贡献值,如活跃度、购买力情况等数据将用户按二八原则分为不同等级:1%为重要客户,19%为主要客户,30%为普通客户,50%为长尾客户,让不同等级用户享受到不同的专属服务,培养用户的忠诚度和提高客单价。

衰退期:日下载量/销量、日/月活量、营收均出现明显下滑。该阶段主要任务就是牢牢把握住核心用户,通过发起有影响力的社会公益活动扩大品牌影响力的边界,开发出和产品/服务强相关的常用周边产品,满足用户的新需求。同时关注行业的潜在进入者动态,通过升维或降维的方式尝试创新转型,升维是指增加自身的实力,给同质化的产品或服务附加超值的东西;降维是指用高级、全套的打法平移到相对落后的空间,如车企推出网约车服务。

第五步,按照原先拟定的品牌人格组织内容运营

人格是贯穿始终的唯一宗旨,包括内容定位、行文风格、推送时间等在长时间内都是保持不变,让内容集成为一个有人格特质、高辨识度的符号。

内容运营的基本流程

首先,打好内容定位的核心基础,分析用户TA是谁、在哪、每天在做什么、有什么偏好等等,制作出不同于竞品的差异化内容,如图文、视频等类型上的差异,漫画、直播、弹幕等形式上的差异,猎奇、愉悦、慰藉等需求上的差异,形成产品特有的内容亮点。内容亮点是热点和特点的集合,热点源于长期不断积累的素材库、百度热搜和微博热搜,特点则是产品特性和品牌人格的总结。

其次,建立内容生产的素材库和人才库。素材库的建立主要通过以下三种方式,一是对时事保持敏感,搜集和整理每天的新闻热点;二是对舆论保持敏感,通过百度搜索风云榜、微博热搜实时榜等网络渠道了解当下的热点;三是保持的运营思维,收藏和分析最近的优秀内容案例。

人才库的建立通常是先寻找和记录的优质内容创作者,包括个人和机构,然后联系和维护这些优质内容创作者,平时也多加留意热点文章的作者,随时更新和完善优质内容创作者的信息。

当然人才的关系维护离不开一整套合理的合作机制:找到能够帮我们传达信息和组织其他用户的超级用户后,要用产品资源对其进行包装和曝光,如:经纪团队挖出杨超越“村花”这个事件点后,通过节目再不断发酵出各种新的事件。然后再找更多的超级用户,复制这一模式,不断重复循环操作。也可以从不同角度对内容生产者设置不同的奖项,如:微博之夜,由官方定小奖,用户投票定大奖,让80%的用户参与评选,最终给20%的用户颁奖。

再次,有组织地进行内容加工和包装。常见的高级包装有专题和专栏两种:专题是特定事件的内容集合(世界杯专题)、特定时间的内容集合(6月原创歌曲排行榜)、特定场景的内容集合(抖in City 美好生活节)。专栏是特定主题的连续内容(今日说法)、特定领域的连续内容(舌尖上的中国)、特定形式的连续内容(焦点访谈)。

一般加工流程是根据内容的定位确定要生产的内容主题,搭建最终想要呈现的内容框架,用最酷或最土的方式击中用户。再从素材库中挑选出有用的元素,撰写一个优秀的内容策划方案,在特定的时间推一些能引起目标用户情感共鸣的话题。也可以把内容框架和素材给到人才库的创作者,将他们生产的内容包装成一个栏目。又或者把所有具备共性的内容抽离出来,提炼出一个主题,这个主题是没有立场之分,能够引起正反方辩论的。

最后,在用户可触达的渠道发布内容。试想在0预算的情况下,借势热点利用产品功能以不同的方式(Push、Banner、客服等)内推给用户,或者在免费平台(微信微博)建立基础的外推渠道。也可以在一条或多头内容上加入玩法(如:评论、直播、弹幕、测试等),引导用户进行互动传播。为了能让用户有意愿参与,可按用户分层(人群、年龄、工作标签、用户等级等)、内容分层(超级内容、头部内容、信息流内容)、时间场景(上班、周末、休假等)、空间场景(办公、餐厅、酒店等)进行内容精准推荐。个人建议,任何栏目或版块都应有C位内容,把它们放在最显眼的位置。

第六步,策划活动让品牌人格常在用户眼前晃动

根据活动举办的周期性,活动类型可分为常规活动、原创活动和节点活动三类。

常规活动,主要包括各种节假日活动、用户共知的节日活动,比如世界杯、NBA总决赛、奥斯卡颁奖等;

原创活动,主要是一些品牌积累到了一定用户基础并有广泛的品牌认知,结合产品本身特点打造的专属性活动,比如天猫的双十一,京东的618等;

节点活动,主要是针对产品生命周期的用户特点开展的重大运营活动,比如为了需求唤醒、信息互动在拉新阶段开展的【新人红包】,为了培养使用习惯、购买升级在促活阶段开展的【每日签到】,为了增强购买升级、精细服务在转化阶段开展的【首单立减】,为了建立用户口碑在传播阶段开展的【分享有礼】。

节点活动目的及手段

每一个活动必须要有一个目标,活动运营的目的无非就是提升粘性、加快用户转化、增强消费决策、提升用户复购和扩大活动传播五个要点。

活动策划的目的及手段

提升用户粘性,实现该目标的关键点(或者说如何让用户养成使用产品的习惯)是让用户在产品上消耗时间,有时间投入,或对产品价值有一定预期,常用的手段就是每日签到各种任务;

加快用户转化,实现该目标的关键点(或者说如何让用户产生付费的意愿)是突出产品在某一方面的实用价值,常用的手段是红包/优惠券,新人特权;

增强消费决策,实现该目标的关键点(或者说如何催促用户尽快下单)是通过价格冲击和优惠策略刺激用户消费,常用的手段是限时秒杀,特殊优惠;

提升用户复购,实现该目标的关键点(或者说如何让用户多次购买,买的更多)是为用户提供信息筛选或新奇有趣的内容,常用的手段是内容/商品精选,特定补贴;

扩大活动传播,实现该目标的关键点(或者说如何让用户主动分享产品信息)是赋予产品更多的内容娱乐价值和社交价值,常用的手段是转发/邀请有奖,测试小游戏。

第七步,以强化品牌人格为目的开展用户运营

本着与用户交朋友的心态服务用户,循序渐进为用户谋福利,让用户感知到并不断强化品牌的人格特质。

用户运营的基本流程

拉新:利用高频使用、刚需、大众化需求等流量爆品(如公交刷卡、比价搜索等),以丰富内容形式(如直播、短视频、吉祥物IP等)来吸引用户的策略,进行搜索引擎、新媒体平台、应用商店等线上宣传,或扫楼发传单、赠品合作、地面广告等线下硬广。但是宣传渠道并不是越多越好,事前需要考虑到关于流量效率的问题并做好渠道调研,是不是精准流量来的用户,拉新渠道不精准,获客成本高,用户质量差。

在宣传过程中,适当使用折扣、抽奖、代金券、红包、限时限量购等营销工具,或者团购、预售/众筹、邀请返利、二级分销等社群裂变方法。值得注意的是每一款产品都应该有一个核心的拉新手段/方式,东打一棒西揍一拳,如此从各个渠道得到的流量不会太多。所以建立快速稳定的热点扩散渠道是有必要的,推荐一种方法:强控公司员工朋友圈,然后维护核心种子用户群,再利用双微一抖等第三方管理工具进行效果检测,最后对每个热点创意进行总结、复盘和优化。

盘活:从用户接触产品后需要有一个引导文案或指导规范,突出产品核心功能、利益点,让用户知道这款产品是干嘛用的,对TA有什么好处,给他什么东西希望TA留下来。常见的引导方案就是设计丰富的新手特权,引导用户尝试不同类型资产投资,比如完成签到、转发、评论、收藏等各种任务就可以获得各种奖励。用户能够完整地使用或操作产品全流程,才算是一个有效的、相对稳定的新用户。如果产品服务体验不精准/认知度差,新用户容易流失、产品口碑差。

防流失:一次给用户发多张券,分为不同的面额和门槛,引导用户完成5次以上消费,同时设置连续购买多单就给奖励,缩短付费时间间隔,加速用户生命周期的进化。还可以搭建常态化的活动体系,在固定的时间点(如:每天10点,每月8日等)开展每日秒杀、限时抢购、会员日等的促销活动,让用户形成具备记忆点的活动预期。

对于一个已经流失的用户,可以通过电话召回(重点用户)、短信/App消息、品牌宣传(老用户)、大型促销活动等手段召回,为他们提供限时特权、红包/抵用券、新品发布/重大改版、重点促销商品等新体验。为什么我们宁愿花时间去召回一个老用户而不是寻找新用户,因为召回一个老用户带来的效益要远大于一个新用户的获取成本,老用户已经熟悉我们的产品,不需要太多的教育成本,而且能够直接带来效益的。当然并不是真的等到用户已经流失才会采取行动,我们可以通过RFM模型监控用户活跃情况,对潜在的流失用户进行预警,并且采取相应的挽留措施。

强粘性:建立用户成长体系,比如用户积分体系、积分商城,用户等级体系、会员体系、勋章、证书等。用户成长体系是一整套驱动用户成长的运营机制,是在用户数据模型的基础上,比如交易类产品的累计交易金额、交易频次、交易类型、交易质量等,内容类产品的用户参与度、内容贡献度、用户活跃度等,工具类产品的用户活跃度、用户ARPU值、用户访问时长等,找到用户成长的关键路径和核心驱动力,从而搭建用户成长的激励通道和连接用户行为的触达通道。

促转化:常见的有提高客单价、增加关联购买和拓展盈利模式三种手段。提高客单价手段再细化就是满额立减、满件立减的满减优惠,加N元送配件/日化用品的加价购,第二件半价的N件N折。制作场景、季节专题或推出产品套装就是为了增加关联购买。在拓展盈利模式里,除了线下探索,将产品和服务延展到线下,寻找产品/服务强相关的常用周边商品,提高品类的丰富度。还可以设置会员专属服务,不同等级会员享受不同的服务,首次付费有优惠。

在用户运营工作中最难的是搭建用户成长体系。当然不建议产品刚上线就做用户成长体系,当用户达到一定量级,知道哪些用户对产品贡献值最大后再考虑要不要做、怎么做,而且用户等级不易超过4级。据调查,抖音至今都没有对外公开(就当不存在)用户成长体系,用户也不会知道自己处于哪个等级,有哪些特殊权益。

用户成长体系搭建的基本流程

首先建模型,可以沿用用户漏斗模型,提升从访客、下单到支付每个环节的运营效率,实时关注用户反馈,看用户是在哪个点流失的,这个点就是要优化的地方;也可以沿用用户生命周期模型,判断用户处于哪一阶段,设定对应的运营规则;还可以沿用用户价值模型,根据用户在不同阶段对产品的贡献度,设定对应的运营规则。

其次搭通道,激励通道主要有秒杀/限时抢购、抽奖、代金券/红包、特权等级、积分/成长值/经验值、任务引导;触达通道主要包括关键访问路径、短信、邮件、产品通知功能、微信渠道、个性化Push等。

最后促成长,通常采用补贴策略、在成长节点触发消息推送和抓牢动力引擎三种方式。动力引擎主要包括:内容类产品的高质量、率、内容形态丰富,电商类产品的低价格、高品质、物流快、品类丰富,教育类产品的优秀师资、系统化教学,金融类产品的供给渠道、电商化、游戏化,出行/外卖类产品的供给驱动、匹配、优质服务,工具类产品的解决具体问题的效率。

第八步,环顾行业发展部署下一阶段运营重心

了解行业发展及竞争对手动态,及时调整品牌的价值主张,加快催熟成长期的产品,或扩大品牌影响力的边界延长产品的成熟期。无论运营重心怎么变,但品牌人格和人格特质不能改变。

在扩大品牌影响力的边界方面,除了借助用户故事都自带自传播的特点,对有代表性的用户故事进行包装,前提是故事一定要真实,把品牌人格的塑造得更富有真情实感。个人推荐发起社会公益活动,就像蚂蚁森林一样打破虚拟空间,通过线上攒能量种树活动,再把4亿+用户的这份参与热情展现到线下——在沙漠种真实的树苗。

 文章来源:人人都是产品经理    作者:炒冷饭的二叔


最近爆火的小宇宙APP,有哪些值得关注的产品细节?

资深UI设计者

「小宇宙」是即刻团队开发的播客App,目前已上架各大应用商店,仅能通过邀请码使用,导致一时间微博上出现「一码难求」的情况,那它与其他播客App有什么不同?

内容推荐

进入App即展示「信息流」推荐,每日更新3条播客「信息流」推荐,听的时间越长,会推荐越多更加精准的播客内容。那用户如何判断推荐的单集是否有自己想要听的内容呢?如下图所示,页面上单集信息展示条目的空间较大,在首屏约能展示2条的单集内容,除了基础的节目封面、节目名称及单集名称外,小宇宙巧妙地通过将热门评论外显,辅以展示播放量及评论数量,引导用户点击进入二级页面,进而形成转化。

强大的搜索

不同于传统播客App仅能搜节目名称,小宇宙还支持搜索单集和用户,甚至是节目内页的内容也可以搜索到。对于那些「我对栏目本身不感兴趣,只想听其中的某一集」或者「我关注某个人或某个话题,想听听看关于他的一切」的节目,使用单集搜索功能可以更简单地直达所需。

让人惊喜的是,在节目内页长按选中任意词汇可以呼出「智能搜索」功能,这个智能体现在它允许用户选择用magi搜索和用互动百科搜索相关内容。这让我想到了Mac上一款很好用的工具PopClip(通过对文本内容的扩展来提升操作效率),小宇宙的智能搜索对于边听节目边扒关键词的「考据党」来说,无疑会大幅提升在听节目时获取资讯的效率。

更便捷的互动

在单集播放界面,除了常规的进度条拖拽、快速后退/前进等功能外,还有一个点赞功能,用户听到精彩的内容或引起共鸣的部分可以通过点赞进行互动,从点赞功能的反馈到进度条的高度的升起都能够进行实时的反馈,同时也可以帮助其他听众了解单集内容的关注点,以此为⽤⼾营造出符合他当时⾏为和感知的情景,可以达到提高用户的参与度的目的。

评论页的输入框常驻于页面底部,点击后输入框高度延伸,引导用户评论互动,此时用户如果是通过单集播放界面进入的评论页面,还会出现标记时点的选项,勾选后评论内容即带上了单集内容的时点。而时点高亮色+下划线的表现形式可以引导用户聚焦注意力和点击进行内容的收听,当其他用户点击带评论中的时点即可直接跳转至对应时间点播放单集内容,为⽤⼾之间的互动建⽴起羁绊,方便用户间的讨论交流,进而提升了点击率和单集的收听率。

另外,在用户输入评论时,输入框并不是以模态的形式出现,在用户评论的过程中依然可以滚动页面进行交互操作,这样做的好处在于不打断用户操作的连续性。以iPhone X的屏幕高度为例,除去标题栏+评论输入框+键盘高度外,留给评论本身的空间仅有大约1/3左右,在空间有限的情况下,用户滚动屏幕查阅感兴趣的评论或针对性进行回复的行为非常连贯,非模态的处理可以进一步降低用户互动的门槛。

这里有一个改进小建议,输入框内的预制文案可以换成引导性更强的内容或由系统自动生成一个场景适合的评论,这样不需要用户自己思考写什么内容,降低用户评论操作的成本,提高用户参与度。

小宇宙目前在社交上的尝试处于用户友好型状态,用户可以查看他人的播客订阅列表,发现同好,即「相近信息的收集爱好者容易获得共鸣」。如果这个有共同兴趣爱好的人刚好是用户收听的主播,就可以很容易拉近听众和主播的距离,主播对于听众来说不再是手机屏幕后面冷冰冰的声音,他更像你的一个朋友,你可以去了解他的喜好,讨论共同话题,更好地跟他进行互动。

情感化共鸣

不同的主题表达了不同情感,针对不同的社会群体的设计风格也会有所不同。

回到产品本身,小宇宙根据播客节目封面的主题色来适配不同播客信息页的视觉风格,营造出适合不同播客风格的氛围,以此来传达不同播客节目的特点。

若在热门的单集下评论,且评论点赞数最高,小宇宙领航员(官方账号)会给你留言,告知「你的评论上首页啦!」,通过这种与用户互动的方式激起⽤⼾的情感认同,提升用户评论的积极性。

点击「加入播放列表」,通过动效形式给予用户反馈,让信息的展示更生动自然,为产品增添趣味性的同时,给予用户更美好的操作体验。

下拉刷新动效中以「宇宙」图形为载体,将产品的Logo融入了其中,赋予产品独有的个性和灵气,让用户切身感受到这是一个可以探索的「宇宙」,而不是一个冰冷的工具,在减少用户等待过程中引发的负面情绪的同时强化了品牌形象。

可以改进的地方

产品中使用了较多无文字按钮,对于初次使用的用户来说存在一定认知负荷,不知道这些都是什么功能。

存在相同样式的图标承载不同功能操作的问题:「播放列表」功能在「我的播客」页中点击后是加入播放列表操作,而在播放列表模态弹窗中,点击后进入播放列表的编辑状态,同个样式的按钮承载了不同功能操作,容易引起用户困惑,带来冗余的学习成本。

当你收藏了一篇文章,收藏按钮状态从「收藏」变为「已收藏」,点击「已收藏」可以取消收藏状态,这是用户对于两个状态切换已有的认知。而小宇宙的加入播放列表功能,在点击加入播放列表后,再次点击「播放列表」按钮,会提示「已在播放列表」,而不是通常认知中的「取消加入播放列表」,容易带来认知错误。

列表右侧的「已订阅」按钮,视觉感知上像是不可点的状态,点击后提示「已取消」,再次点击提示「订阅成功」。对于有明显状态变化的功能性操作可以省去toast,这里通过「已订阅」和「订阅」状态的按钮样式变化已经给予用户清晰的传达反馈,再次提示反而多余。

小宇宙的体验分析就到这里,总的来说虽然存在一些需要优化的细节(毕竟还处于邀请码体验阶段),但是设计师可以学习的设计亮点有很多,感兴趣的小伙伴可以下载体验一番,也欢迎大家一起留言交流。

2020年最火的新拟物化设计,需要思考的五个方面

资深UI设计者

新拟物化设计只是一种风格吗?

最近正火的新拟物化风格(Neumorphism)在 2019 年底,设计师 Alexander Plyuto 所提出的「Skeuomorph Mobile Banking」作品中亮相。之后不仅被选为 2020 年界面趋势,又称为 soft UI。但这种风格在真实世界落地时,可视性上受到许多争议。

确实,新拟物化风格它算是一种风格,但又不是只有视觉上的风格这么简单,它延伸出来的议题,其实是扁平化跟拟物化之间的战争。

拟物化与扁平化的瑜亮情结

拟物化是 Apple 在早期设计中大量使用在界面上呈现对象属性、材质的方式。然而在 2013 年 ios7 发布时,Apple 开始为了画面简洁大量将界面元素扁平化,紧接着 Google 在 2015 年发布了 Material Design,宣示扁平化在 UI 设计中扮演着主导趋势的角色。2020 年真是百家争鸣的一年,首先是 BMW 发表的扁平化新 logo,接着是这一波新拟物化的反击。究竟代表新拟物化可能夺回界面风格主导权?或仅是 2020 年昙花一现的视觉风格呢?

扁平化VS 拟物化,我们可以思考的五件事

我认为新拟物化的概念其实是融合扁平化与拟物化的集大成,它建立在扁平化风格之上,又将组件带入了拟物化的元素,提高用户的判断力。不过在纠结于扁平化与拟物化哪个比较好时,有五个议题是可以让 UI、UX 设计师去思考的。

1. 多数年长者对于扁平化界面提供的视觉元素暗示无法理解。

大家身边一定都有那种已经把 Line 操作得滚瓜烂熟,但是每次要用 Line 加好友时,还是不知道怎么操作的长辈。最早期当人类还没进入屏幕时代前,我们所使用的界面大多是实体产品上的控制界面,而这些界面上的每个开关、按钮,都只有一个输入源,对应到一个功能(一对一),我们因此就这样与产品进行简单的交互动作。然而在屏幕上这个简单的交互模式被改变了,像是用键盘跟鼠标可以辅助我们,在系统中进行抽象与复杂的无限多任务(一对多)。

△ 你偏好用哪个微波炉加热咖啡呢?Image credit:Bence Mózer

让我们再来看看对长辈最重要的 Line 加好友功能,我们先不论这个功能在整个 APP 中被埋得多深,因为找到加好友的入口真的对长辈来说是看缘分~

在我引导长辈找出二维码画面的经验中,发现他们都是用死记的方式,把下一步要按哪个键、在画面的哪一个角落,记下来。但由于加好友功能并不是每天都会操作的,因此在学习上的效果,就像是高中时没有把课文理解、吸收就硬死背下来一样困难。

我们来看看「显示行动条码」在扫描二维码画面中,是否真的具有可以被点选的暗示。在扫描画面背景单纯的时候(如下图情况 1),「显示行动条码」的 button 底色是有透明度的黑、扁平化后没有阴影提供可以按的暗示,不过因为有大圆角的造型,勉强还是可以诱使人点点看;但一般情况下,扫面画面背景不会那么理想的无其他干扰(如下图情况2),button 原本的透明黑完全融入了后面的背景,这时候只剩下「显示行动条码」的文字,已经不具备可以被点选的提示。

△ 情况 2 中,显示行动条码的 button 看起来可以按吗?

扫描画面中的外框有一定的透明度,在可操作暗示(affordance)上已经不具有实体的特征,如果又放上有透明度的 button 在上面,让人充满不确定性,年长者无法将这样的情况与现实生活中的经验联想在一起。

2.以颜色做区别真的是最好的方法吗?

你知道同一个颜色,每个人看起来会不一样吗?而不同颜色在不同环境下,却又能看起来像同一个颜色吗?

不同意新拟物化设计的人中,有人主张运用颜色的引导用户操作界面的色彩元素不能从界面设计中抽离。但事实上,不同年龄、性别,视觉锥细胞中的活跃程度不一样。同一个颜色,不同人看,明度跟彩度会有差异。基于种种现实,由色彩的引导是好还是坏呢?

例子1:关于人类的视觉锥细胞

同一个颜色,不同人居然会看成不同颜色?

为什么阿嬷喜欢买大红大紫的衣服?这个偏好除了受到个人喜好影响外,也关系到阿嬷视觉锥细胞的活跃度。老年人在上了年纪后,部分视觉锥细胞开始退化,因此对于蓝色、绿色这类冷色系的颜色,老年人会开始接受不到这个区段的光带来的刺激。因为视觉锥细胞对冷色系的刺激降低,导致阿嬷在菜市场逛街时会被偏暖色系的物品吸引。所以会买热情系服饰不是阿嬷本人的意图,而是老化的锥细胞在作祟。

例子2:关于学习观察颜色这件事

不同颜色居然看成同一个颜色?

不同颜色却看起来很像,有可能是光线造成,也有可能是使用者必须学习去观察才知道的。日本的 JR 跟 Metro 系统,有着完整且细腻的视觉辨识系统。设计师理想中的情况是,我们将每条路线定义成不同颜色,可以让使用者更容易学习辨识路线。

但实地走访过东京的地下铁跟 JR,常常会发现跟错指示,才发现是潜意识辨认错文字或是颜色。我自己遇到过的经验是,在新宿站想要找都营大江户线时,因为在改札口看到了同样粉红色的标志,原本已经要哔卡进去,才发现那是京王新线的 IC 入口标志。

△ 新宿驶的改札口前,有两个同为粉红色的引导指标

所以说,高龄者或是天生视觉锥细胞有缺陷的人对于颜色无法清楚辨认外;大部分人可以借由学习来增强色彩辨识,除了可以对相似颜色进行更细节的判别外,也可以学着辨认不同光线(暖光、冷光)下造成的色彩差异。

但是,当我们在设计中,迫使用户学习、习惯我们制定颜色的意义。可能会在新手 onboarding 时造成适应上的负担,也有可能让他们在使用别的系统造成错乱。

3. 对于颜色被定义的意义各个文化、区域、种族都相同吗?

在不同文化之下,对于色彩的观察与运用也不一样,举个大家可能都有发现的例子,当你在不同城市旅游的时候,有没有发现不同城市的优先座颜色不一样?你能猜得出来,哪一个是台北捷运上优先座的颜色吗?

△ Image credit:wikipedia.org

当颜色在不同约定成俗下,有不一样的意义,又刚好缺乏文字或图像引导的时候,可能会让使用者解读成不同的意义。例如:红色具有热情、喜气、带来财运的意涵,但同时又具有危险的警示意义。

当设计师觉得红色可以引起使用者的注意,而把 button 设计为红色时,却可能让没看清楚文字的用户,认为按下这个 button 是危险的举动。

△ Image credit:photoAC

4. 光与影(明亮面跟阴暗面)给使用者的可操作暗示(affordance)一样吗?

新拟物化设计中假设了人在使用界面时,会运用与生俱来能判断光影效果的能力。这是真的吗?让我们来做个小实验:

为什么在台北车大厅席地而坐的人,会选择坐在黑色的棋盘格上呢?如果根据人类从大自然中所得到的可操作暗示来说,有阴影的地方可以提供人类休憩的功能,例如树阴下的阴影处。

△ Image credit:中央社、wikipedia.org

如果这样说得通的话,代表光亮的区域对人来说是可以行走、活动的地方;而阴影处则是休息与暂停处。

根据以上的推测,我们做个小实验,把车站中的 2 个不同区域的地面上分别涂上白色与黑色,来让受测者选出哪些区域可以暂停,哪些区域可以走动:

问题A:假设你要在车站的大厅等朋友,你会选择站在哪里等他呢?

假设:受测者会选 2,因黑色区域(影子)让人觉得可以暂停、休憩。

结果:符合假设

1:白色柱子前的白地面 32.5%; 2:白色柱子前的黑地面 67.5%

问题B:哪一边的楼梯是往上的方向呢?

假设:大家会选 1,因为黑色区域(影子)让人觉得可以踩上去。

结果:符合假设

1:白色立面+黑色地面 61.3%;2:黑色立面+白色地面 37.8%

由实验A、B可得证,虽然实验结果符合先前假设,大多数的受测者可从阴影判断要走哪条路,但还是有不少(30%以上)的受测者不认同。所以在用使用光亮阴影的设计暗示时,还是会遇到使用者感知的不同的问题。

5. 深度认知不同是导致判断物体距离的能力受影响,也就是所谓的视差。

新拟物化设计中,将界面组件以类 3D 的方式呈现,使用户在操作界面时必须去感知界面组件的远近以判断重要性,而在深度认知上有障碍的用户此时就会受到挑战。用户可能会遇到,不知道哪个组件才是浮在最上面、最重要的;若界面中的组件有三种以上的阴影深浅,会让用户在判断时要更花脑力判定物件在立体空间中的深浅。

总结

新拟物化风格中的光影表现提供了使用者人类最原始的操作意图:可操作暗示,是一个好的出发点,然而必须针对 APP 性质的不同而有所改良。在设计较走生活风格理念,而操作界面不复杂的 APP 时,非常适合用新拟物化风格来诠释:例如电子书服务、音乐软件;但在设计功能导向,且有大量信息化图表的界面,例如:移动网银,还是需要以扁平化的界面为主要信息架构,新拟物风格可能会是极少量界面元素中,拿来呈现生活中真实物的质感(例如:用户的信用卡)、或是作为亮点(例如:优惠卡片)的呈现方式,此类型 APP 中最重要的卡片与图表对于此种风格,一定要谨慎使用,必定三思三思再三思。

文章来源:优设    作者:Muse Chang

日历

链接

个人资料

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

存档