首页

设计心理学-五架帽理论

博博

什么是五架帽理论

五架帽理论简称为LATCH原则,它定义了在好的组织性信息才能提升用户体验,使设计更易于理解、灵活和可维护。

它是怎么产生的

LATCH的概念最初由Richard Saul Wurman在他的设计原则和设计模式中提到,后来在他的《信息架构》的书中重新定义了五架帽概念。

LATCH即是Location位置,Alphabet字母,Time时间,Category类别和Hierarchy视觉层级组成,这五种方式目标都是通过高效的信息呈现来提升用户体验。

产品中怎么用

Location位置

理论上讲的是通过位置来组织信息,其实比较好理解,我们可以理解为你本人所在位置是一个坐标点,所有的信息形成都是围绕你的坐标点来组成的。

例如地图软件中你的当前位置不断变换,手机屏幕中不断加载出新的地标建筑,在一些游戏场景,例如绝地求生,随着你的位置变换,不同的建筑环境、人、道具等都会随着在你周围出现,当一些信息组成对用户非常重视时则会优先出现,比如驾驶过程中当前位置不变,地图会优先加载道路信息,其次是建筑信息(网络波动的时候比较明显)。

并且随着VR/元宇宙等技术,基于位置变换组织信息已经是非常重要的一环。

总结:通过位置结合时间能够给用户展示高效率的信息

Time字母

与字面意思一样,按字母顺序排列信息,当数据量很大时,它是组织信息的最佳方法之一,在产品应用中常见的就是像通讯录、目录等能够快速的定位到信息,通过这种方式延伸出其他场景的排序方式,例如电商产品中的侧边分类,就是利用英文字母的逻辑把商品类别进行分类,在一种就是按照时间的维度进行信息分类。

Category类别

当信息具有相同性需要排序的时候,使用分类的方式能够最快的提升用户筛选效率,在我们生活我们每个人都有分类的习惯,如电脑桌上会放置一些小物件或电子设备相关的,衣柜里统一都放衣服每一层放不同季节的衣服,每当我们想使用到某件物品时第一时间就能定位到它的位置。

在产品中使用最多的是分类和导航,例如同样的鞋子可以用品牌分类,也可以按照季节分类或者性别分类......音乐可以用流行、摇滚、民谣等等分类......

类别是该理论中比较关键的一环,它定义事物按照分类的方式能够让用户快速的查找信息组织。

Hierarchy视觉层级

上面位置、字母、类别都是提高信息查找效率,视觉层级与字面意思相同,当我们满足基本的查找效率后可以使用不同的视觉层级来凸显重要性。

例如在产品设计中可以从颜色、大小等方式来满足我们想要的层级梯度,让产品/用户的核心价值快速的让用户察觉到。

总结

上面只是对每条规则单独拆出来解析,实际中它们是可以共存的,如位置结合时间能够让用户第一时间看到重要信息,类别结合字母就出现了我们看到的通讯录,类别结合视觉层级能够让分类更加重要等。

五架帽理论最终目的都是为了提升用户使用产品时的信息效率,它的五条设计规则也是在产品设计中的必须要遵守的,为什么说要遵守,因为设计中我们可以仔细回想下,基本上每一个页面的诞生都与这五条规则相关,一但违背,这个页面的可用性或者美观就会有所缺失。


作者:爱吃猫的鱼___
来源:站酷

蓝蓝设计(www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的大数据可视化界面设计B端界面设计桌面端界面设计APP界面设计图标定制用户体验设计交互设计UI咨询高端网站设计平面设计,以及相关的软件开发服务,咨询电话:01063334945。

关键词:UI咨询UI设计服务公司软件界面设计公司、界面设计公司、UI设计公司UI交互设计公司数据可视化设计公司用户体验公司高端网站设计公司

银行金融软件UI界面设计能源及监控软件UI界面设计气象行业UI界面设计轨道交通界面设计地理信息系统GIS UI界面设计航天军工软件UI界面设计医疗行业软件UI界面设计教育行业软件UI界面设计企业信息化UI界面设计、软件qt开发软件wpf开发软件vue开发

 

设计心理学-峰终定律

博博

什么是峰终定律

用户在使用一个产品流程时的高峰体验和结尾体验。

用峰终法则提升用户在整个产品上或某个功能上的体验,需要先对用户在整个产品上或某个功能上的使用行为与想法进行分析,并绘制出用户的情绪曲线,根据情绪的峰值节点和使用流程的结尾,这两个“关键时刻”,进行体验上的重点打造。

它是怎么产生的

2002年的诺贝尔经济学奖得主、美国心理学家丹尼尔•卡尼曼经过深入研究,发现人们对体验的记忆由两个因素决定,即高峰(无论是正向的还是负向 的)时与结束时的感觉,这就是“峰终定律”。关于峰终定律有这样一个实验:让两组人员听相同时间的强噪音,然后一组停下来,另一组接着再听一段时间的弱噪音,就实际遭遇来讲,后一组比前一组受了更多的折磨,但是听到更长时间噪音的后一组的痛苦指数却要比前一组低很多,原因就是对于两组人员来讲,结束时刻的噪音给他们留下的感受最为深刻,因而他们的痛苦指数主要是由噪音结束时的刺激程度所决定的。在另 外一种情况下,令两组人员听相同时间的噪音,其中一组的噪音强度较高,另 外一组的噪音强度较低,但是其中某一时刻听到了极其刺耳的超强度的噪音, 结果就是,后一组的痛苦指数要高于前一组,尽管就总体而言,后一组所听到 的噪音强度要低许多。

这体现的就是感受过程中的“高峰”一刻的决定作用。依照峰终定律,高峰和结束时的体验主宰了人们这段感受的性质和强弱的 程度,而跟感受的总的比重以及体验时间的长短无关。也就是说,如果在一段 体验的高峰和结尾,体验是愉悦的,那么对整个体验的感受就是愉悦的,即使 这次体验更多的是痛苦或不愉快的感受。

需要我们记住

用户根据体验的高峰和结束来判断产品体验是否好坏,并不是根据用户使用产品的每一个节点感受的平均值来判定,我们可以理解为结果比过程重要。

就像我们看电影时,一个电影2小时前1小时都枯燥无味,突然中间有5分钟让你的情绪上升,此时你可能觉得这个电影还行,至少让你达到了情绪高潮,当你继续观看时电影片段又变得枯燥无味,突然最后10分钟和结束时出现了电影彩蛋,并且这10分钟的内容特别符合你的胃口,这时候你就会出现一种“嗯,这个电影不错,结局挺好”这样的心理暗示,此时会发现接近100多分钟的枯燥内容都被你忽略掉了,或者你也记得但是你默认了电影90%的枯燥。

产品中该怎么用

强化峰值

一些app里在用户购买成功后,将已购商品以一种具有仪式感的收藏卡形式展示给用户,给用户惊喜的体验,在盲盒星球内购买盲盒成功后会弹出卡片,把用户获得感拉满,在网易云音乐直播间内如果是新手用户就会弹出新人见面礼,通过视觉的表现形式把氛围拉拉满,当然还有一种反向峰值,当有一些产品进行抽奖时,如果用户未中奖会弹出情感化弹窗,对用户进行安慰降低用户的挫败感。

上面讲的偏向于业务弹窗,还有一种是功能性弹窗, 当用户使用某个产品流程时,这个流程可能通过多个维度才能到达最终的节点,在最后用户完成操作时通过情感化弹窗进行提示,又或者在版本升级时需要引导用户进行更新,使用情感化的表现,能够将产品与用户产生情绪共鸣,增加趣味性,提升体验。

降低负面峰值

当用户使用产品去完成目标时,突然中间步骤出现网络波动、网络断开等不可抗拒的因素,此时在页面中添加一些情感化设计,会缓解用户焦虑情绪,甚至可以在空状态中添加动效来提升趣味性。

我是这么做的

近期在工作中做了一个直播项目,其中的一个功能就涉及到直播抽奖,因为产品奖品比例较多且轮数也多,用户的中奖几率也比较高,所以导致用户在中奖后基本就退出直播间,因此在做设计的过程中为了避免这个问题,我在中间弹窗上做了优化。

通过情感的中奖弹窗形式来强化用户的感知度,在直播过程中提升兴奋感,提升用户观看的直播的欲望。

最后一定是终值

在讲一个案例,去年我们做一个刷题功能的体验优化,用户在刷题场景下会面对几十道甚至上百道题目,整个过程非常漫长,并且旧版的功能交互上并没有展示总共还有多少题的这个提示,用户在刷题过程中会非常焦虑,为了解决这个问题,通过这三个手段改进,1)我在刷题过程中以进度条的形式去实时告知用户刷题进度,减少用户焦虑,2)用户在最后几题的场景中会添加鼓励话语,强化用户峰值,3)在结果页面为用户展示直观的数据变化,强化用户的满足感,同时激励用户进行持续性刷题。

总结

用户只记得使用过程中体验高的场景和结束时的场景。
无论是在交互还是视觉上我们都可以利用峰终定律帮助用户达到好的使用体验。



作者:爱吃猫的鱼___
来源:站酷

蓝蓝设计(www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的大数据可视化界面设计B端界面设计桌面端界面设计APP界面设计图标定制用户体验设计交互设计UI咨询高端网站设计平面设计,以及相关的软件开发服务,咨询电话:01063334945。

关键词:UI咨询UI设计服务公司软件界面设计公司、界面设计公司、UI设计公司UI交互设计公司数据可视化设计公司用户体验公司高端网站设计公司

银行金融软件UI界面设计能源及监控软件UI界面设计气象行业UI界面设计轨道交通界面设计地理信息系统GIS UI界面设计航天军工软件UI界面设计医疗行业软件UI界面设计教育行业软件UI界面设计企业信息化UI界面设计、软件qt开发软件wpf开发软件vue开发

一篇文章读懂交互设计7大定律

前端达人

在交互设计领域有很多经过时间检验过的定律及法则来作为设计的指导原理,它能够帮助产品设计者对界面上的各种视觉元素进行合理评估,从而发现一些使用过程中的可用性问题,还可以根据这些法则从界面的维度来改善操作效率和使用满意度。

 

我们在产品设计的过程中会经历非常多的决策阶段,大到一个功能流程的闭环设计,小到思考一个元素的最合理布局,在这些场景中,我们首选的解决方案当然是更适合当前功能特性和使用场景的方案,如果没有合适的方案或者在几种方案面前犹豫不决时,一般都会选择遵守设计规则和接近设计规则的那个方案,这些所谓的规则也是交互设计的基础理论和方法论,我们能否在工作中信手沾来并且灵活运用它呢?同时也为了将来能够掌握“舌战群猿”这门高级技能,我们还是要从打牢基础开始。今天就让我们回到起点,聊一聊交互设计的7大定律。

 

 

 

 

一、费茨定律

 

 

费茨定律是人机交互和人体工程学中人类活动的模型,它预测了从任意位置快速移动到一个目标位置所需的时间由2个位置的距离(D)和目标大小(S)有关。

 

此处有2个参数条件:

距离(D):既起始位置离目标位置距离越远,我们到达目标位置所花费的时间就越长。反之,离目标位置越近,我们所花费的时间就越短;

目标大小(S):即目标面积越大,我们定位到目标的所花费的时间就越短。反之,目标面积越小,精准定位到目标上的时间就越长。

 

 

1.生活中的“费茨定律”

汽车上的刹车踏板和油门踏板相距很近,并且刹车踏板的物理面积要比油门踏板大,这样可以使驾驶员能在相对最短的时间内把脚从油门踏板移动到刹车踏板上,从而最快最准确的触发刹车踏板,确保事故的发生率和减少事故的损伤。

这也就是为什么右脚正确的姿势是脚跟始终在刹车踏板下,加速时,以脚跟为轴,脚掌向右旋转至油门位置并轻踩油门,目的都是为了在最短的时间、最自然的行为下,快速触发安全操作。

相反,动漫城里那些赛车游戏的刹车踏板比油门踏板小很多,而且距离远,这又是为什么?这也正是应用费茨定律的高明之处,因为游戏中我们需要更快的速度去超越对手,在踩下油门踏板的那一刻,要让玩家达到用户体验的“爽”点,因此你会更容易踩到油门踏板,而且人身安全不会受到威胁。

 

 

这就是菲茨定律在不同场景下所起到的不同作用。设计起源于生活,在我们的界面设计中也是相同的道理。

 

 

2.界面中的“费茨定律”

费茨定律在产品界面设计中的主要作用是提高产品的可用性。更准确的说,它所提高的是产品可用性中的效率指标,帮助用户更快速的完成某个操作或任务流。

 

(1)距离目标位置尽量缩短,相关操作保持亲密性

 

a.多数产品在设计页面模态弹窗引导用户进行操作行为时,都会将操作控件放在固定的页面位置(一般居中或者处于页面底部)。但“抖音”的设计却让人眼前一亮:系统会判断用户进行触发时,手指与屏幕的接触位置,并将模态弹窗的操控按钮显示在离用户手指最近的位置。

 

随用户手部活动区域变化而灵活变更位置,使用户在进行手势交互的过程中操作动作能始终在手部的舒适区域内进行,是应对大屏时代十分友好的体验设计,也是该定律运用的比较好的设计点之一:既起始位置到目标位置的距离

b.比如QQ的登录界面,登录按钮的面积恰好比大拇指端的面积大一些(考虑到拇指点击的舒适感),而且按钮所在的位置无论是唤起键盘或未唤起键盘,始终都保持在拇指可触的舒适位置,所以根据前面的参数条件,此按钮的面积(S)及触达距离(D)均是最佳。

 

假设把登录按钮放在屏幕下方,虽然说拇指默认悬停的位置在屏幕的下方,此时距离登录按钮理论上是最近的,但是还要考虑后续场景:一是键盘唤起、二是与输入框的亲密性,因此有效触发登录按钮的行为是发生在后续场景中,所以放在距离输入框最近的位置才合理。

 

 

 

c.除了移动端之外,在PC端做后台表单设计时,我们经常把决策性按钮紧跟在表单下方,距离表单最近的位置,这也是为了缩短光标移动的距离,使操作项(要输入的表单)和决策项(提交/取消按钮)更具有关联性。

但是,该页面的内容过多时,则会把决策性按钮适配到第二屏以下,这样的做法也不友好,也就违背了该定律,所以PC端单页面长表单的决策按钮设计一般有2种处理方式:

 

 

 

 

 

思考:

那是不是所有的交互方式都需要考虑最近的距离呢?答案是否定的,正如前面电玩城刹车踏板的例子,菲茨定律的作用可以走向另一个极端。在界面设计中,可以有意识的将一些操作放在死角处,既相对不容易点击到、感知到的地方,这就是为了延长用户的感知时间,感知时间长即操作完成时间长,操作成本也就越高,从而减少误操作的可能性。

 

(2)目标尺寸大小要合适

 

a.目标可点击热区在合适的范围之内,越大越容易精准点击,越小则容易误操作和点击无效。在iOS人机交互指南中也规定了最小点击热区为44*44,就是为了保证每次点击都能够得到有效的反馈,防止因为操作热区过小而导致难以点击。这里可能有朋友会说“移动端当中存在文字按钮,这种是不是字号要放大呢?”,你多虑了,字号根据设计规范去设定就好,文字也可以让开发同学把点击热区放大,但是字号不变,这是2种不同的交互方式,一个是元素可见,一个是元素可触。

 

b.说到点击热区,就不得不提拇指在手机屏幕上的移动范围,根据研究表明,人们在使用手机的时候,75%的交互操作都是由拇指驱动的,而拇指默认悬停的位置恰好在屏幕下方,所以这里依然要考虑菲茨定律的作用,如果目标位置超过了拇指舒适的移动范围,操作成本就会无形中增加,比如手机在手掌中向右倾斜才能接近大拇指、需要拿出慵懒的左手才能点击到...

 

 

(3)屏幕的边界“无限大”,更容易触达

边界是非常明显的目标位置,它固定在屏幕边缘,在物理上限制了鼠标光标不能超过它们,不管你鼠标移动了多远,光标最终还是在屏幕的边缘蠢蠢欲动。所以可以利用设备屏幕的特点,将鼠标非常快速移动到边缘或角落,而不用进一步微调才能触发他,同时也不必担心鼠标滑过了操作区域,因为他会被屏幕边界挡住,这里就可以把屏幕边缘看作“无限大”,虽然位置在边角,但也可以快速触达。

 

 

屏幕的边边角角很适合放置菜单栏、按钮组及一些辅助性操作,比较有代表性的就是Mac系统的边界交互,他们把显示器边角和触控板的交互发挥到了极致,据说苹果公司已经为这个设计申请了专利。

 

 

 

二、米勒定律(7±2法则)

 

米勒定律(7±2法则)是交互设计中一个常用的定律。1956年美国心理学家乔治·米勒对短时记忆能力进行了定量研究,他发现人的短时记忆能力广度为7±2个信息块,记忆信息超过了该范围就容易出错。这说明人的大脑短时记忆容量约为“7”,并在7+2与7-2之间浮动,因此心理学家把这个神奇的记忆容量规律称为“7±2法则”。

 

由7±2法则我们可以得出,一般人接受新事物的记忆容量最多不会超过9。为了方便理解这个法则,我们做个示范,请读一遍下面的随机字母,然后移开眼睛回忆一下,看看你还能想起几个?

 

 

通常会想起5~9个,即7±2个,这个有趣的现象就是7±2效应。

 

米勒定律(7±2法则)适用于生活中的方方面面,比如设计一个相对复杂的任务:通过减少每个组块中元素的数量(不超过9个),当用户使用你的界面时,确保用户的大脑可以最大限度地记住这些内容,当项目列表变得很长时,可读性和易读性会变得很弱,就需要用户花费额外的时间来阅读或搜索。

 

 

1.生活中的“米勒定律”

这个法则不仅仅可以用于移动端和PC端的设计中,在生活中很多场景也可以用到,比如电话号、银行卡号、身份证号,我们总是喜欢把一长串数字拆分开来读写,目的就是降低记忆成本,提高信息的易读性,从而达到视觉防错的作用。

 

 

2.界面中的“米勒定律”

 

 

在交互设计中,我们可以经常利用米勒定律,来减少用户的认知负荷,提高信息的易读性,毕竟信息设计也是提高用户体验的重要一环。界面中的“米勒定律”主要强调的是信息与信息之间的组合模式。

 

除此之外,米勒定律还强调了在设计过程中预见性和适当规划的重要性,当你在不断为产品添加更多功能时,产品界面必须能够适应这些新功能,而又不会破坏原有的视觉基础,毕竟重建产品需要花费大量的时间和资源。

 

(1)分段记忆,信息分层

a.设计源自于生活,我们生活中的记忆方式也映射到了界面设计中,也就是把手机号码分为3-4-4的规则来记忆。我们可以做一个对比,数字A是没有分段的数字,数字B是通过空格分段隔开的数字,让你在3秒之内记住这串数字,你感觉哪组数字更利于你的记忆呢?很明显是数字B利于阅读和记忆。

 

 

就连我自己给别人发电话号码,或手写的时候也会分段隔开一段距离,用户体验无处不在(该死的职业病)。

 

b.分段记忆还可以用于文章排版,长文本很多人阅读起来非常痛苦,尤其是纯文字的、排版脏乱差的长文本,之所以看起来非常痛苦,是因为段与段之间没有留白,整个界面缺少呼吸感,信息与信息之间没有整合,所以阅读起来有较大的记忆负担,看的时候还经常串行,最后嘛也没记住。

 

写到这里相信大家也能感受得到,我通过公众号发布的文章,大段与大段、小段与小段之间都有留白,而且选择了舒适的字号、字间距及行间距,这些都是我在预览模式下检查了好几遍才定出的一套规则,同时重点文字都会通过颜色对比突出展示,目的就是为了帮助读者记忆和提高易读性,并且配图都会美化一下。阅读,也是一种体验。

 

(2)导航和选项卡通常不要超过9个

网页设计的一级导航通常不要超过9个,如果导航和选项卡内容过多时,可以通过聚合按钮来包容其他次要入口或子入口,这个做法在PC端最为常见,其设计原理也同席克定律。移动端的标签栏一般不超过5个、选项卡一般不超过7个,如果有更多的选项可以左滑查看其他,或者点击右边的“聚合按钮”查看更多。

 

用户使用导航是快速找到自己想要的内容,这种诉求一般非常急切,如果还不能快速的找到自己想要看的内容,很有可能会流失掉。所以,简化产品导航使它尽可能的少于九个会让用户对于产品的内容一目了然。

 

 

(3)系列位置效应

系列位置效应描述了一个物体在序列中的位置影响我们对它的记忆,主要有2种:

 

首因效应:相对中间位置,我们对一个系列最前面的物体的记忆力更清晰;

新近效应:相对中间位置,我们更容易对序列末尾的物体记忆更清晰。

 

也可以理解为我们的大脑倾向于回忆起列某件事的起始和结尾,最不容易回忆起中间的内容。生活中也有同样的效应,很多事情随着时间的流逝只记住了开头和结果,中间的过程最容易遗忘,你还记得与初恋的情书内容吗?肯定想不起来了吧,但开始怎么追他的、结果怎样,这些却历历在目。这种记忆特性也会映射到界面设计中。

 

比如商品详情页,它的阅读体验和产品重要信息从什么时候真正开始?又到什么时候结束呢?设计师应该如何布局详情页的开始和末尾内容呢?这些都是用户体验设计人员在设计时必须搞明白的关键问题。下面以Apple官网举栗子,整个详情页可以分为三大部分:开头、中间、结尾。

 

 

 

 

 

三、席克定律

 

 

希克定律是一种心理物理学定律。用户所面临的选择数量越多,做出选择所花费的时间就越长,在人机交互的界面中选项越多,意味着用户做出决策的时间越长。

 

 

 

我们在做设计时,应该思考“在不妨碍用户选择的情况下,如何提供较少的选项”。多而乱的选项会延长用户做决策的时间,甚至对一些“选择困难户”来说,会直接导致任务流失败。全部的选项没必要平铺出来,选项与选项之间一定有着某种联系,所以也可以对选项进行同类分组和多层级分布,这样用户使用效率相对会更高(排除选项均是独立和业务要求的场景)。

 

席克定律虽然给设计带来的是克制,但也不能用于极端场景,妨碍用户选择,以“强奸”的方式强迫用户遵照产品目标去选择,比如某产品退押金的流程设计,从发现退款按钮到“好像申请成功”的过程,你是不是暗自吐槽过?当然这里是站在用户角度去看待这个设计,如果站在产品角度去审视它,会发现它是一个产品、交互、UI三者配合非常棒的案例。

 

1.生活中的“席克定律”

 

 

 

 

下图有两个电视遥控器,在你第一次使用它们做出开/关机、切换频道、加减音量这些主要操作时,你会觉得哪个使用起来更效率?感知程度更强?很显然是图2,连老人用户都可以快速学会并做出正确的操作行为,而图1却需要我们花时间去研究这些按钮在什么位置,去看手指有没有对准按钮,因为它们太多太小了,甚至一些图标我都不明白是什么意思,有些按钮可能永远都不会去点击。

这就是席克定律在遥控器上的作用,虽然这个案例也可以套用在其他理论上,比如交互设计四策略(删除、组合、隐藏、转移),这就和我们做功能设计一样,功能层级也需要细分出:核心功能、辅助功能、边缘功能等,而核心功能一定是进入到产品内第一个发现的功能,且操作频率最高、能够解决用户主要诉求的功能,所以它的视觉优先级往往是最突出的,而在电视遥控器中,开/关机、切换频道、加减音量就是核心功能。

 

 

 

 

2.界面中的“席克定律”

在人机交互领域中,我们通常是如何运用席克定律来帮助用户增强感知和节约选择时间的呢?

 

(1)减少选项并提供默认值,方便用户选择

选项越多,用户决策的时间就越长,减少用户思考的时间就是减少操作时间和学习成本,优秀的用户体验就是让设备变的更聪明,让用户“不思考”就做出正确选择。这里的“不思考”就是无意识的行为惯性,比如常规的单选/复选框,用户一看就知道圆形是单选、方形是复选,根本不用思考就能通过薄弱的感知进行选择,因为这些早已植入他们的认知里。除此之外,我们还可以针对用户不同的使用场景精简选项,方便决策和降低误操作的概率。对于一个小模块来说,一般可选项不要超过9个,9个以上就存在一定的记忆负担,对于超过9个的,可以用一些交互来约束用户的行为,比如“展开/收缩”、分页、分步等等,这里在下面的“7±2法则”中会详细介绍。

 

(2)选项分类分层,信息区分主次

在菜单栏的设计过程中,我们可以将被选项进行同类分组和多级分层的设计,这样使用效率会更高,其次重点信息和推荐信息需要和普通信息在视觉上做区分,要有一个明显的对比,这样才能抢占视觉并在第一时间感知到。

 

如下图,试想如果把所有城市依次平铺在界面上,不依照热门、历史、国内/海外、首字母来分类,用户可能在选择地区上要花费很长时间,甚至是无从下手,直接进行搜索,而搜索的实际也是辅助功能。同时,我们做分步分层设计时,也应该合理的控制结构的广度与深度,因为每增加一个层级就意味着用户选择的成本增加,而广度太广又会导致用户在浏览上花费较多的时间。

 

 

(3)分步完成,分步显示

a.分解复杂流程:让用户一步步操作,而不是全部堆到用户眼前,这就是为什么强调一个页面只做一件事的原则,通过分步完成一个任务流,在操作感知上要比填写一大堆信息的压力要更低,同时还能降低其他信息给用户带来的干扰,帮助他们将注意力聚焦在该步骤当中。

爱彼迎中大部分录入项都是采用分步分页来完成的:

 

 

 

b.场景细分:当用户填写表单时,先展示较少的可填项,当填完最后一项或选择“其他”时,再展开剩余的表单,目的也是为了减轻大量表单给用户感知上带来的压力,由此来达到场景细分的目的。在录入场景中,能将信息整合为选项的,就千万别让用户输入,因为输入的时间成本较高,且容易出错,开放的输入条件也不利于统计一些数据,所以通过固定的选项来约束用户的行为。

 

 

 

 

 

 

四、接近法则(亲密性)

 

 

我们通常把位置相对靠近的事物当成一个整体:

同样都是圆,在视觉呈现上你会认为哪些是一组的呢?

 

接近法则的“权重”非常大,大到可以抵消其他法则,比如为上面的圆形添加颜色,甚至改变形状,我们也会把接近图形当成一个组:

接近法则也是格式塔理论中我们最为熟悉、最常用的一种法则,它描述的是观察者看到彼此邻近(空间或时间)的物体时,会将它们视为一个整体。在界面设计中,对信息的组织已经离不开这个法则了,他在界面中所体现的就是把相关的信息块组合在一起,不太相关的分离开,增强与区分元素之间的关联性,所强调的是空间和位置。接近法则产生于群组,它可以减少信息设计的复杂性,对引导用户的视觉流、便于用户对界面的解读起到至关重要的作用。

 

 

(格式塔理论是心理学中为数不多的理性主义理论之一,在设计中还有几个比较常用的法则:相似性、连续性、封闭性、对称性、主体/背景、共同命运等,这些我在后面的文章中会单独介绍,记得关注咯~)

 

 

1.生活中的“接近法则”

在我们小区的规划效果图中,标段与标段(区)之间通常会利用相对较宽的过道、绿植、围栏来划分它们之间的关系,从而增强人们的感知。类似的还有商场的店面布局,服装类、生活类、电子设备类等等。

2.界面中的“接近法则”

 

 

a.界面设计中的接近原则是对相似的信息及功能类别进行分组、布局。它在界面中的作用能够直接影响到用户与产品的视觉交流,借此引导用户的浏览及操作行为。因此,相关的内容和功能应该彼此靠近,而关联性较弱的应该保持距离。

 

其中最常见的就在列表页面,通过色块来区分大组与大组、分割线区分小组与小组,甚至现在有些产品抛弃了分割线,直接用留白来区分组与组。目的都是在视觉上通过组与组的区分来划分功能与功能之间的关联性,让界面变得更清晰,并且帮助用户在浏览页面时,能够清楚的感知到各个信息组之间的关系,也就是信息层次。

 

 

b.留白(负空间)在界面中发挥着至关重要的作用,因为它能够引导用户眼睛的朝向,并且可以用于区分视觉层次,有助于提高阅读体验。在日常设计中,我们面对信息比较少的,可以多使用留白来排版,根据信息之间的关系进行分类,让信息看起来更有秩序。

 

如果是面对较多的信息,也可以通过“块”来划分功能区域,下面就拿华润个人网银的界面举例,我们通过右图能清晰的看到功能组与功能组之间的关系(但是不得不吐槽居然把客户常用操作放在了第二屏的位置...)。几乎所有的界面设计都遵从了该原则,尤其是PC端。

 

 

 

 

五、泰斯勒定律(复杂性守恒定律)

 

 

泰斯勒定律又称复杂性守恒定律,该定律认为每一个过程都有其固有的复杂性,这个复杂性存在一个临界点,超过了这个点就不能再简化了,你只能将固有的复杂性从一个地方移动到另外一个地方。比如我们发现页面的功能是必须的,但当前的页面信息过载,那么就需要将次要的功能收起或者转移,但是你却无法删除他,只能想办法权衡。

 

这一观点主要被应用在交互设计领域,作为一名以体验至上的交互设计师在面对复杂需求、复杂场景、复杂流程、复杂页面的时候,如何在不影响业务和功能的情况下,保证用户的使用体验。而不是为了所谓的页面简洁、设计趋势,就自以为是的删除一些用户认为重要的东西,最终导致功能满足不了用户。

 

 

之前还听过不少UI设计师朋友抱怨过:“哎呀,猪头产品经理把这个页面的内容堆积成这样,什么都往里面放,到底懂不懂设计啊”,这种场景对于设计师来说几乎是每天要面对的,我们不能悄悄把产品经理的功能需求给简化(删除),而是应当主动与他沟通,看看这个页面的内容是否都必要,如果是因为业务目标、产品目标而导致该页面信息没办法简化,这就是考验我们设计师功底的时候了,看你如何把这些不可抛弃的信息组合起来,是信息分层呢?还是利用一些交互方式改变臃肿的流程呢?而不是一味抱怨,毕竟你是解决问题的产品设计师,如果你设计师都不花心思去处理它,用户在使用过程中就会花更多时间去完成任务。

 

所以...

 

针对一个任务流的复杂:

看是非常复杂的任务,而使用者在具体使用过程中往往关注或聚焦其中的一部分,所以可以通过将任务进行拆分完成,也可以分割成各个独立的简单任务,这是一种简化,当然也是一种复杂,因为拆分、分割本身就会更为复杂,这一点需要平衡,而在团队中起到承上启下作用的往往都是交互设计师,具体的处理方式要取决于交互设计师的经验和能力。

 

针对功能操作或信息传递的复杂:

“交互设计四策略”当中的“组合”使用可以解决这个问题(交互设计四策略即:删除、组合、隐藏、转移,这是最基本的设计理论,不知道的赶紧去百度),如将信息组织更便于理解、识别,将次要并繁琐的转移或隐藏,将没有必要的信息删除等,交互中有化繁为简之说,其实是归繁为简、删繁为简。归繁为简更多应该是组织、转移、隐藏。而删繁为简则更多体现在删除、移除不必要的说明、不必要的考虑,合理的删除才是产品设计过程中正确的减法。

 

改革式的复杂:

这种方法就是“破界”,突破现有的实现方式,利用新的规则、设备、技术把复杂转移出用户的眼睛(界面上能看到的),或者干脆直接简化掉,这属于技术上的创新。现实世界中有很多创新,最有代表性的就是信息传递的媒介演变过程:由信件→电报→电话→手机。但他们最终目的都是一致的:信息传递。

 

复杂经常存在,复杂度也是守恒的,但是我们至少可以做一些事情:对用户的视觉、触觉、听觉进行“减负”。

 

 

1.举两个生活中的例子会更容易理解

a.就拿遥控器来说,智能电视的遥控器界面比一般电视遥控器按钮要少,显得简约大气,没有密密麻麻的按钮阻碍着人用户的决定。按钮的减少也就意味着遥控器本身所承载的功能减少了,同时遥控器的操作复杂度也降低了,但并没有降低实质性功能,比如某些确定按钮全是一个键,这个键又让人明白了它承载着所有的确定功能,这样就不用到处找按钮了。

所以说,复杂度的降低是一个相对的概念,它不能直接简化功能,但是可以通过技术手段或交互手段去转移,从而提升使用体验,智能电视的遥控器就是把其他辅助功能的操作转移到显示器上。

 

b.手机系统应用的交互设计,在手机刚刚上市的年代,我们所熟悉的诺基亚、摩托罗拉、西门子等,基本上样式都差不多,显示屏幕+物理键盘。他们普遍存在的问题是结构比较复杂、物理按键几乎占用了整个手机的一半,感觉操作功能比视觉体验还要重要。当全触屏的智能手机问世后,革命性的改变了手持设备的设计思维,使其更注重用户的使用体验,而不是让用户把全部的心思花在了按键和寻找按键上。

 

改革几乎完全移除了物理按键,它被体验更好的屏幕按键所替代,全新的人机交互方式迅速让大众所接受,所以这种演变方式也体现了复杂守恒定律。

 

2.界面中的“泰斯勒定律”

在以用户为中心的交互设计过程中,交互设计用于简化用户层面的逻辑结构,而不可避免会相应增加开发的工作量,而此时体验设计的复杂会变成了技术实现的复杂,将用户使用产品的复杂转移到技术实现层面上了。当然复杂守恒的前提是已经不能继续简化,复杂是必须的时候。

 

就拿内容型产品中常见的智能推荐机制来举栗子,里面信息流的内容(除了置顶内容)每个用户所看到的都不是固定的,且都不一样,这些内容是根据该用户之前浏览的类别、当前地理位置、搜索痕迹、购买痕迹等维度综合计算呈现出来的,就相当于给用户“私人订制”的服务设计,我站在一名用户的角度看待这个交互设计感觉使用起来非常轻松,因为每次刷新信息流都会出现最接近我诉求的内容,而不需要我通过“筛选”功能进行手动设定。

 

但是,对于产品团队来说,实现这样智能推荐的交互方式,是一件落地成本较高的事,其中就包含了“吧啦吧啦”的技术手段。这就是将用户使用产品的复杂转移到技术实现层面上,从而降低了用户在操作过程中的复杂程度,提高使用体验。

 

 

假设:这里不做转移,让用户每次都通过“筛选”功能手动设定内容维度,虽然开发是不用做复杂的算法,但这种方案对于用户的操作成本是非常高的,也不符合内容型产品“沉浸式体验”的设计原理,关键是使用起来非常死板(产品不聪明,使用体验就差),因为他不会记忆用户在使用过程中的“习惯”,从而导致用户经常要去手动设定,所以用户的行为模式和心理模型被这种错误的交互方式带偏了,从浏览信息变为查找信息,丧失了资讯类产品的本质。现在看这种交互方式还真是革命性的,优秀的内容型产品都有这种技术。

 

 

 

六、奥卡姆剃刀原理

 

 

奥卡姆剃刀原理的核心思想为:“切勿浪费较多东西去做用较少东西同样可以做好的事——如无必要,勿增实体,即简单有效原理”。

 

 

在功能性页面设计过程中,在动手前就要养成先理解用户使用场景和行为的习惯。流程内的引导尽量弱化于主流程,流程外的内容,没有必要的不要增加,这一点其实很重要,简单的页面让用户一眼就能找到他们感兴趣的内容,使用户浏览更舒适,更能专心于你要表达的内容上。而复杂的页面会让用户找不到信息的重点,容易分散用户的视觉注意力,这些弊端加起来会影响用户使用的效率。不管是实体、视觉还是认知上,多余的设计元素,有可能造成失败或者引发其他问题。

 

同时这个原理也强调了在相同的条件下,如果有两种不同的方案,且没有条件做AB测试、灰度测试,应当优先选择更简单、更合适的那个,如果连前提条件都不同,那就根本无从对比。当下快节奏的移动互联网时代,每位产品设计者都需要在寸土寸金的屏幕上快速处理各自的需求,那么这个原理也会很实用。

 

这个原理还有视觉上的魅力,可以比喻成“修剪”设计中多余的元素、去除杂质,最后的设计将会更严谨、更纯粹,恰到好处的留白和清晰信息指引影响着用户在使用产品过程中的重要感受。而设计需要从开始的发散,最终回归到克制,因为你是商业属性的产品设计师。

 

 

1.生活中的“奥卡姆剃刀原理”

奥卡姆剃刀原理更像一种思维模型,是一种以结果为导向的思维模型,它比语言更具备完整理解事物的能力,但它不是定式,而是随着认知和研究的变化而变化。

 

 

2.界面中的“奥卡姆剃刀原理”

 

a.优先展示重要功能

处理复杂的功能和信息,最经用的方法就是将他们分类分层,从中提取出相对重要的功能优先展示,而相对次要的功能可以在视觉上弱化、在第二屏展示或者通过一些聚合按钮收纳进去,比如“更多”。毕竟用户来到你的页面中,一般都是来使用核心功能的,我们不应该一股脑的将所有功能都平摊到用户眼前。

 

b.减少点击次数,给予合理的选项

操作成本最低的使用方式就是当我们一打开产品的时候,我想要的就全部搞定了,而不需要我进行任何操作,虽然这是对未来使用场景的一种设想。但足以证明用户是“懒惰”的,我们要满足他们“0”操作的欲望。以现在的技术而言,我们能做的就是减少不必要的点击次数,并给予合理且少量的选择,比如我们在表单里录入一个收货地址的信息,这么一长串文字你是希望用户去输入?还是去选择再输入?

为什么不能通过技术手段找到更高效的方案?就是判断在录入表单之前,粘贴板是否包含有省市等地区信息,如果有则可以自动补全到表单内,再让用户自行修改。这虽然是个锦上添花的功能,但有启示作用:把结果想在用户前面、做在用户前面。

 

c.“外婆”规则

如果年龄大点的用户也能轻松的使用你的产品,说明产品的可用性和易学性非常强。这里所指的“年龄大点”并不是真正针对老年人用户,而是通过该比喻来警示我们产品设计者,在塑造产品的过程中始终保持同理心,而不是“我认为”的设计,因为你是技术人员,你非常了解产品的功能和性能,而用户来自各行各业、各个层次,他们的认知和你的完全不一样,我们要做的就是符合大众认知的设计,“认知”可以是一个符合现实的任务流程、也可以是符合生活映射的图标、还可以是一眼就能看懂的提示文字:

 

 

七、新乡重夫:防错原则

 

 

用户在界面中发生的错误大部分是由设计和开发过程中的疏忽造成的,而不能认为是用户操作疏忽(不能认为用户是xx)。因此,在设计中非常有必要考虑防错机制,尤其是用户的操作具有毁灭性效果的功能时要有强提示和强确认,防止用户犯不可挽回的错误。

 

1.界面中的“防错原则”

a.比如在录入长表单中,前端与后端及时检测录入信息的有效性和正确性,而不是让用户填写完所有表单再点击提交按钮之后,再告诉用户哪一项录错了,这种反馈相对来说是非常迟钝了,虽然不会影响主流程的提交,但是会导致用户不能及时发现错误,需要重新回过头再录入、再提交、再报错,这样会严重影响使用效率。

 

b.我们经常无意间会输入错别字,这些错别字由于我们的记忆麻木很难找的到,甚至对于一些懒惰的作者来说,也不太愿意从几千几万个字符当中找到那一个错别字,如果就这样发布出去了,间接性也会影响用户的浏览体验,所以这也是一种错误,是信息上的错误,只不过它不影响任务流程而已。因此公众号后台最近新增了一个贴心的功能,就是在编辑文字信息时,发布按钮旁边(接近法则)有一个系统识别错别字的信息,如果有错别字,点击“查看”,可以定位到该错别字的位置,便于作者进行修改。

 

该功能所在的位置也正如前面的“接近法则”,放在发布按钮旁边,符合使用场景和认知:一是在发布前通常会检查;二是主操作按钮旁边更为醒目,从而引导编辑者去检查,减少错误,提高读者的阅读体验。

同时这种防错的交互方式也运用了前面“泰斯勒定律”中提到的“将用户的复杂转移到技术实现上”,这里就是将用户手动花时间检查文本的复杂场景,转移到“查看”按钮上,通过技术手段实现出系统帮助用户完成检查并定位的功能。

 

3个维度细分“防错原则”

在设计过程中,要注意从用户出发,开动之前脑袋里过一遍用户使用场景,预测到他们有可能发生错误操作,操作前友好提醒、操作中实时感知、操作后及时反馈。

 

 

操作前,提醒防错:

 

(1)详尽的说明文字,突出显示

主要是针对新用户或谨慎的操作说明,目的是为了正确引导用户学习使用。引导和提示的位置要突出,从而让用户容易感知到(比如离标题或输入区近一些),确保用户在操作前能注意到引导或提示信息。

如下图,如果不进行提示用户就不知道这个位置的录入机制和字数极限值是怎样的,等输入完再提示或者点击提交再判断是否有输入的时候已经晚了

 

(2)当结果不可逆时,询问用户让其知道操作的后果

在用户操作前及时给出正确且有效地引导和提示,有助于减少错误发生的可能性。对于比较重要的操作,需要通过二次确认减少错误的发生,这里指的二次确认有几种程度可以参考,我把他分为:轻度防错、中度防错、重度防错,如图:

 

(3)选项比输入更简单,并提供默认选项

用户出错的原因无非就是这4种:系统性能差、被界面误导、自己粗心大意、操作复杂的功能。就拿“操作复杂的功能”来看,用户操作的时间越长犯错的几率就越明显,所以,我们在做一些组件的时候,能让用户选择的就不让用户输入,宁可让他点击完成任务,也不让他输入完成任务,因为输入比点击的失误概率要大的多,操作成本也相对较高。

其次就是选项给用户提供默认值,尤其是用户需要做重复的动作,或者需要精确数字的时候,先提供一个默认值,然后让用户再修改它们。

 

操作中,实时感知:

 

(1)对用户的操作进行视觉化呈现,并及时回馈

对用户输入的信息进行实时检验,在下面这个案例中,当用户输入自己的邮件信息之后,即被告知用户这个动作的含义,到底是输入正确还是输入错误,而不是等全部输入完毕点击“确认”后才提示,实时状态能将错误扼杀在摇篮中。

(2)适当限制用户的某些交互操作

对一些可能造成错误的操作入口设置约束或直接禁止操作,从而避免错误的发生。举个例子:操作完一个模块内容,展开另一模块的同时收起上一个模块。填写过程限制用户某些操作,这样始终让焦点聚集在当前内容,在操作者的角度也不会因为内容过多而导致情绪波动。

 

操作后,及时反馈&友好引导:

 

(1)错误发生时,即使反馈错误并提供纠错帮助

错误反馈及时就能保证用户每个阶段的操作都能得到回应,避免因为一个小的错误就要修改关联的一系列内容的情况,提高完成任务的效率。反馈不仅要指出有错,还要指出错在哪里,反馈文案要准确、友好(文案呈现方式是要和用户聊天,不要审问用户),这样便于用户了解错误的原因,方便下一步的修改。另外在用户提交操作之后,也需要及时反馈是正确or错误,因为这里有种叫“心理犯错”的因素,是用户对自己操作不自信的表现,你不及时告诉他操作结果,他可能会担心一小会呢。

(2)允许用户犯错,并支持操作可逆(既撤销以前的指令)

iPhone手机的还原功能,可以在用户出错时将多种功能设置快速还原到原始状态。还有常见的:删除相片、删除邮件、因异常情况退出的文稿编辑等,这些极端操作都有对应的草稿箱、垃圾箱、下次进入提醒是否还原等逆操作来挽回用户的错误。

 

 

 

虽然这些法则被认定为标准,但从实际项目出发,它们只是起到了参考和启发作用,并不能完完全全指导项目,作为交互设计师的你:

 

1、千万不能照本宣科,任何法则只有亲自做过以后才能深有体会,在我们产出的过程中可以多联想一些理论知识,这样既能巩固基础,还可以让我们的设计有理有据,帮助你自己做出设计评审;

 

2、不要迷恋任何的设计法则,因为你所产出的东西最终还是要考虑到落地和商业性,有些设计方案虽然违背了设计理论,但是他适用于产品现状和用户层次,这种情况我们就不必太过于维护职业操守了(这位设计师一根筋),毕竟不是每个产品团队都有足够的开发资源去协助设计师“微调”的。切记:设计服务于功能、设计服务于产品、设计服务于商业;

 

3、这些设计法则就相当于我们日常生活中的“常识”,它们每一个的背后都蕴含着很多优秀的案例和设计思考,你不得不学,否则会被人家认为不专业,这对设计师而言是一种侮辱。同时,掌握基础理论也是能力进阶的必经之路,它能够提高设计决策时的效率。

 

希望对你有所帮助~

 


 

蓝蓝设计(www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的大数据可视化界面设计B端界面设计桌面端界面设计APP界面设计图标定制用户体验设计交互设计UI咨询高端网站设计平面设计,以及相关的软件开发服务,咨询电话:01063334945。

关键词:UI咨询UI设计服务公司软件界面设计公司、界面设计公司、UI设计公司UI交互设计公司数据可视化设计公司用户体验公司高端网站设计公司

银行金融软件UI界面设计能源及监控软件UI界面设计气象行业UI界面设计轨道交通界面设计地理信息系统GIS UI界面设计航天军工软件UI界面设计医疗行业软件UI界面设计教育行业软件UI界面设计企业信息化UI界面设计、软件qt开发软件wpf开发软件vue开发



作者:h梓暄
链接:https://www.zcool.com.cn/article/ZMTA0NDU3Mg==.html
来源:站酷
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。

从单车上锁聊聊任务链路优化设计的思路与技巧

ui设计分享达人

起因˜
最近突然喜欢听着小曲蹬着车子,不过我没有自行车,所以就选用了大众款蓝色哈罗单车,不过有意思的是发现整个用车体验跟原来有了不少变化,除了车的外观差异,更让我印象深刻的是还车时只需要在手机上进行操作即可,不知道大家是否还记得原来的还车过程,这里我帮大家回忆一下;
从单车上锁聊聊任务链路优化设计的思路与技巧
 
 
这个过程本身没什么问题,但实际上匆匆忙忙的大家忘记手动上锁还车时有发生,并且当你想起来的时候,手机上也只能干看着扣费,还得折返回去进行锁车。本人更离谱,有次打开手机发现忘了手动锁车,一看行程,已经被人骑出去老远啦~
 
但这次不再需要手动上锁来还车了,整个锁车还车已经借助物联网技术将操作集成到手机上进行了,这意味着像我这种时常忘记手动锁车的人有了更好的选择,现在忘了锁车还能在手机上亡羊补牢,考虑到最终骑行事件是在手机上完成闭环的,忘记上锁和离开后无法上锁也就一下解决了,这便是技术应用与交互链路优化设计的美妙之处!
 
当然,如果你已经养成了手动锁车好习惯,你可以继续选择手动上锁款,刚好最近也在做一些交互链路优化的活儿,索性就我自己的工作场景,展开聊聊这用户体验优化必备能力项的一些思路方法吧~
 
任务链路优化有何价值˜
一般来说做交互链路优化的核心价值或是目标就那么几个;
一、更好用
即更加高效便捷好用的意思,这短短三个字就直接包含了大家常挂在嘴边的易用性、可用性啥的了,好的交互就应该是尽可能的为用户提供简单好用的交互,举个例子,近期在使用阿里云Flow的流水线,期间我也用过其他家的CI/CD服务,相比之下我觉得阿里云Flow的流水线编排反馈就做的更胜一筹,“更方便”加一分
从单车上锁聊聊任务链路优化设计的思路与技巧
 
 
二、更准确
意味着为用户提供正确的服务、流程、功能、组件、信息反馈乃至视觉效果,为的是提升产品的可理解与易用性,从而达到降低学习成本提升效用,减少跳失率或出错等负面情况
从单车上锁聊聊任务链路优化设计的思路与技巧
 
 
三、提升意愿
嗯!花费那么多心思让产品体验变得更方便更准确就是为了提升用户的使用或付费意愿,算是任务路径优化设计的底层价值吧。
从单车上锁聊聊任务链路优化设计的思路与技巧
 
 
阶段流程与焦点
整体我们可以划分为优化前、优化中、优化后三个阶段,对应到三个阶段中,对应的工作流程基本由问题定位、优化目标、方案构思、方案验证、持续改进构成,然后根据阶段与流程我会把相关的优化焦点与链路优化的关系交代清楚,算是清晰一下链路优化工作整体思路与每个阶段的工作事项。
从单车上锁聊聊任务链路优化设计的思路与技巧
 
 
优化前的焦点
以我们B端SaaS产品的优化设计为例,焦点可以简单的锁定在
用户、产品、业务场景
三大层面,我们会关注这三个因素中带来的反馈来找到和定位问题,最终解决掉用户痛点或是触成业务目标,具体点可以拆分出以下焦点事项;
目标用户
需要关心产品目标用户的特征,他们是收益的来源也是市场构成的部分,作为产品的经理或业务设计师,肯定是对预期的目标用户有所了解才对,特别是初期型产品;
当积攒了一定用户量后,就会开始关注基于数据或定性研究得到的用户画像信息,并通过这些更准确的用户画像来了解目标市场和进行业务设计决策,而不只是对着市面上竞品抄作业罢了。
这过程中你至少要弄明白五个问题;
1、用户的需求是什么?
2、用户使用的场景跟行为大致如何?
3、我们的用户有何偏好或特征?
4、用户通常还会用到哪些竞品?
5、用户有哪些反馈值得注意?
 
服务体系
主要是产品本身的服务体系或业务逻辑相关,前面提到了用户画像或分层的一些概念,
实际上现在的互联网产品中,服务体系或是用户角色都不会很单一,用户角色、权益身份、服务场景等等都有差异,设计前的差异化背景或权重厘清就很重要,至少要清楚当前优化的服务线路是为那些人,他们有哪些差异、有哪些状态情景、有哪些交互要兼容或避错。
从单车上锁聊聊任务链路优化设计的思路与技巧
 
 
业务场景
我们关注产品、关注用户,同时也关注他们之间发生了什么样的化学反应,所以业务场景必定是本阶段中的一大焦点,通过业务场景可以洞察到更多用户实际遇到或潜在的痛点,以及线上线下等环境带来的微小差异性,至于如何实践了,我们可以通过观察不同类型的用户是如何使用产品,或是与用户对话分析来获取优化指引,哪里用户卡住了或是吐槽了那就表明有优化空间,这应该算是任务链路优化的基础焦点了吧。
实际业务场景中我们常关注的点
1、用户:用户本身有什么特征属性值得我们关注?
2、情景:用户出于什么背景原因或目标在什么时机进入该场景?
2、行为:用户进入场景后要做什么或做了些什么?是否做的顺畅?
3、结果:用户是否达成目标?未达成或达成受阻的原因是什么?
4、反馈:用户吐槽或建议了些什么,我们获取了哪些有效的改善讯息?
 
优化中的焦点
这个阶段中,我们的主要工作可以概括为分析问题、解决问题、验证问题,其中焦点可能会比较多,这里我挑了一些说一下;
需求分析
结合前面阶段中的场景化来还原问题是什么情景下怎么发生的,产生了什么样的负面影响,这很重要,我们需要知道用户的业务诉求是什么,造成出错原因是什么,产生了多大的影响,以及用户期望的是怎样,然后就是如何更好的满足用户诉求,同时保障企业的利益,这就是需求分析要做的事情;
交互媒介
主要是考虑复杂且涉及多方媒介的业务场景,要思考这些媒介或端怎么配合用户完成任务,以什么样的形式进行交互。就例如哈罗单车的,不仅是要经过手机的交互,还有单车的传感器与数据交互等,事实上一套完整的服务正是由这些媒介之间的不断交互,才使得哈罗的租赁服务可以如此灵活,所以在整个服务流程中让媒介之间更智能、自动、高效的完成衔接与交互,就成了必要的焦点了,如果说你认为这是多余或无效的部分,那么很有可能说明你所处在的产品服务构成还不算复杂,但这不能否定掉交互媒介的重要性。
这个过程中,你至少要清楚服务完成要经过哪些端、那些人、哪些条件、哪些信息构成。
从单车上锁聊聊任务链路优化设计的思路与技巧
 
 
信息构成
几乎进行任何服务都离不开特定的构成信息交互;
图:举个最简单的例子,晚上你来到街边摊,想要一份烤冷面,那么你除了要掏钱以外,你还要跟老板确认口味、加料、价格这些信息,这些就是构成任务进程的信息,这些信息可以通过问答式确认,也可以提供招牌信息给食客确认
从单车上锁聊聊任务链路优化设计的思路与技巧
 
 
总之将这些信息更简练准确的进行交互或传达,就能实现任务链路的优化,事实上应用程序本身就是由各种各样的信息交织在一起所构成,所以
“做任务链路优化不仅是减少操作步骤而已”
 
业务模型
可以简单易懂的帮助我们理解和消化业务,以及更好协同,面对复杂的任务流程,可以更好的表达或梳理业务概念与全局结构,在做复杂的任务优化时,就不容易被局部问题牵着鼻子走,而忽略其他影响面,说的直白点,就是这个业务的整体过程你脑子里要有个概念,制作方法其实就是将各个业务或任务拆解成多个单元的形式,并将单元之间的包含或层级关系表达出来
从单车上锁聊聊任务链路优化设计的思路与技巧
 
 
研发能力
需要考虑技术实现的周期与成本,即开发是否可以实现,需要研发多久,要投入多少成本,我相信产品经理都会关心这个问题,其实就是投资回报率与可行性的问题,产品生产研发的本质是赚钱不是亏钱,不是吗?
例如说你看见了一个很酷炫的交互效果,也准备应用到自家的产品中,但实际开发的难度大不大,要投入多少时间精力,这个酷炫的交互又能带了多少产品收益?所以研发实现能力在方案设计的过程中还是要考虑的。
 
测试反馈
方案落地前,进行一定的内部测试或评审是很有必要的,介于还没有完成开发上线,可以在优化方案出来后通过Demo的方式找人进行测试反馈,一般自测走查只是第一环,有不确定的一定要拉上其他人一起研讨评审一番,如果要找人测试的话,其实只要设定好合适的任务与目标,还原出真实用户碰到问题的任务过程即可,接着就是观察测试者是如何使用Demo的,你的新方案是否奏效我想你知道怎么去衡量,就不赘述了。
 
优化后的焦点
优化后阶段我们主要关注是否优化了个寂寞,是不是又优化出了新问题,优化后还有哪些收尾工作,关联的需求池与迭代规划怎么安排。
数据采集准备
当一个方案被投入到生产环境中,我们却无法得知是否比旧的方案更好,这种情况是很糟糕的,故我们在新的方案推出的同时,一定要保障有办法收集到有效的用户反馈,这个过程我们可以是采用AB测试、数据埋点监测、灰度采样、用户使用性测试等,这都是我们实际工作中采用的有效手段。
效果对比
始于数据采集,采集后自然是与原始版本的效果进行比对,确认新的版本是有效可靠的,能被用户认可采纳的,同时也能发现新的问题反馈,这需要进一步的跟进与规划,这是个重点环节。
需求规划
原始问题是否圆满结束,是否有新的问题待解决,是否需要分批开发上线或验证,调整后其他部分是否需要配合改造,这一系列问题将迫使我们持续改进,并将流程再一次的接轨到优化前阶段。
 
AI告诉我的焦点˜
从单车上锁聊聊任务链路优化设计的思路与技巧
 
 
关于优化流程的一些额外的发现
PDSA 或 PDCA
PDSA是指“计划-实施-研究-实施(Plan-Do-Study-Act&Amend)”,属于一种精益方法,常用于衡量变更的有效性,部分企业的专有云解决方案架构师也叫做PDSA,并且有对应的平台组织与PDSA执行流程。
从单车上锁聊聊任务链路优化设计的思路与技巧
 
 
PDSA这一流程可以灵活迅速的发起并验证效果,四个步骤分别如下:
从单车上锁聊聊任务链路优化设计的思路与技巧
 
 
而PDCA则是指“计划-实施-检查-行动(Plan-Do-Check-Act&Amend)”,检查主要就是验证效果是否有效,有效的则应用或标准化,没用的则继续改进,相比下,PDSA的内涵会更广泛些。
 
SDCA循环法是一个持续改进模型
SDCA是指“标准化-执行-检查-总结(Standardization-Do-Check-Action&Adjustment)”,跟PDCA有些类似,主要差异在于第一步骤;
  •  
    标准化(Standardization):识别和定义改进过程中需要标准化和优化的关键步骤和流程,例如软件系统的交互规范化、场景模块化、系统设计、流程统一等,亦或是产品客户端的操作手册、新手引导、统一操作流程、测试用例、准入门槛等标准化内容。
SDCA循环法的目标是实现持续改进,可以减少重复性问题再次发生、精简和标准化执行,形成可靠、准确、高效的结果,是一种结构化的迭代的方法,且适用领域广泛。
 
一些还不错的优化思路˜
针对任务链路优化工作的场景,以下我给出了一些常用的优化方法或工具,并酌情说明了使用场景与小型案例帮助掌握,当然了你也可能都掌握了这些,甚至有更进阶的方法或工具,那么也欢迎你补充或留言交流。
1、无前置轻快任务先行˜
其核心思想是在面对多个任务或配置项时,通过分析任务之间的依赖关系和优先级,将那些不需要前置条件、相对轻量级和快捷的任务优先处理,其优势在于能提高整体效率,还能让用户在完成前面步骤后获得一定的成就感,从而更有动力继续推进后续事项。
适用场景
适合复杂流程改造、复杂的表单配置相关、大量的事项处理场景、非线性的多任务处理场景等。
上手技巧
1、识别出没有前置条件的任务;
2、分析任务或事项之间的依赖关系;
3、优先处理轻快型的任务;
4、灵活的调整高优先级或是共通的前置事项;
从单车上锁聊聊任务链路优化设计的思路与技巧
 
 
当然也可以根据此原则将前置条件整合处理,这样在后续的任务路径中就可以减少相应的条件卡点,例如大量安卓应用第一次安装启动时就会向用户索要存储、录音、相机等基础权限,那么之后使用相关服务时,就不用触发授权窗口了,不过权限还是要遵循用户隐私政策法规哈。
从单车上锁聊聊任务链路优化设计的思路与技巧
 
 
2、渐进式交互˜
就是将复杂的任务进行拆分,通过循序渐进的方式一点一点完成任务,这样可以减少任务达成的门槛,让用户使用更顺畅,并且可以在过程中培养用户的意识,是任务链路优化的常见手段之一,也是游戏新手村屡试不爽的教学模式。这个方法的应用案例跟文章快被写烂了吧,这里就不展开了。
适用场景
该方法常常会应用到复杂的任务流程引导,如分步骤表单配置、功能进阶解锁、线性任务指导、新用户引导等场景。
上手技巧
1、制定核心的目标或任务链路,确保有效的渐进过程;
2、找准任务的先后关系或是难度级别;
3、注意引导过程的连贯性,要保持前后呼应;
4、采用简洁准确的引导提示,以及适宜的奖励或反馈机制;
5、结合用户的使用偏好或认知,要让推进的过程尽可能自然易用;
从单车上锁聊聊任务链路优化设计的思路与技巧
 
 
3、并行规划˜
通过规划使多个任务事项穿插或并行开展,本质就是任务事项的拆分管理与资源规划协调,通过使更多事项同时或尽早进行,来加快任务目标达成,以效率来推动任务链路优化的目的,也可以理解成是碎片化时间利用。
从单车上锁聊聊任务链路优化设计的思路与技巧
 
 
适用场景
多个任务待办且时间长短与参与程度有差异时;
多个任务流程进行且涉及审批、协同、传输、自动进行等情况时;
上手技巧
在资源规划协调时,可以通过时间、状态两方面下手,重复的、自动的、久等的、卡点的可以考虑先行,然后再处理其他琐碎事项即可,反正当你事项多,又想省下时间提升效率,就一定考虑下这个方法;
从单车上锁聊聊任务链路优化设计的思路与技巧
 
 
4、群体划分˜
即我们常说的用户分层,通过提供差异化的服务或任务路径来对应不同的用户群体,以减少无效或干扰的流程操作,为目标用户提供更好的体验质量与业务场景偏好满足等。
适用场景
业务用户群比较丰富,不同角色的任务场景差异较大,需要更沉浸或专业的交互时。
上手技巧
对不同类群体用户进行访谈或任务场景测试;
厘清用户群体与对应任务目标的差异性;
区分不同角色之间的权限差异;
规划不同的任务的功能诉求与边界;
从单车上锁聊聊任务链路优化设计的思路与技巧
 
 
5、技术创新˜
通过科技技术的应用,可以为用户带来更多的便捷与新鲜感,特别是具备商业属性的技术,会更快地成熟与普及,然后影响到更多人的生活方式。这个过程可以概括为“科技-认知-应用-习惯-直觉”,就像现如今的扫码支付、人脸识别、指纹解锁一般,不仅在各种领域都有了应用,并且你一看到相关信息,直觉就会引导你该如何操作。
适用场景
在当前技术实现还不够优雅或是遇见过更好的技术应用时,则可以考虑去应用新的技术或是与当前业务做融合创新。
上手技巧
了解行业技术创新应用;
多看看大厂公司的技术解决方案;
看看行业技术科技大厂的官网动态;
找找是否有适用于自身业务的普惠技术方案;
从单车上锁聊聊任务链路优化设计的思路与技巧
 
 
6、约束与枚举˜
面对各种复杂的操作、选择、输入输出时,尽可能的枚举出选项或模板,这样用户操作会更规范也不容易困惑,对于那些用不了或有特殊含义的内容则通过样式、组件、提示等进行合理的约束,避免任务流程出错,也帮助用户识别与理解,例如报错信息就要约束用红色反馈,电话号输入就要约束为数值输入等,事实上这应该是交互设计师的基本功吧。
适用场景
这个是我个人一直以来认为人机交互工作中的根基,适用于绝大多数需要进行组件交互或行为交互的场景。
上手技巧
厘清交互过程中涉及哪些信息内容;
不同信息内容适用哪些交互组件进行;
交互内容是否有任何格式约束、内容模版或是注释说明;
交互过程中哪些是被允许那些是不被允许的;
交互过程的状态扭转是否完善和有效避错;
从单车上锁聊聊任务链路优化设计的思路与技巧
 
 
7、5why分析法˜
一个老生常谈的方法,可以帮助我们深入问题和洞察底层含义,用法就是面对问题不断的追问为什么,在任务链路优化中,主要可以帮助我们分析和定位问题根因。以过滤伪需求为例,面对老板提出的需求,如果你不去深入一下,你就不会明白做这个需求究竟是解决什么痛点的,那么做出来以后,这个需求就有可能出现没有解决老板痛点的情况,甚至可能出现新的问题,因为这个需求本就是伪需求。
适用场景
适用与大多数复杂问题或需求的分析场景,主要是对需求或问题不够清晰
上手技巧
连续追问;
从单车上锁聊聊任务链路优化设计的思路与技巧
 
 
 
8、场景化分析˜
简单讲就是在解决或优化任务链路的时候,带上人物、目标、行为、环境、时间诸多因素综合性思考,形成一个更完善而真实的洞察环境,以帮助获取更多有价值的优化信息,此前有出过一期关于场景化思维的专栏文章,写的比较详细,有兴趣的可翻阅一下:
从单车上锁聊聊任务链路优化设计的思路与技巧
 
 
9、ESIA分析法˜
ESIA是企业流程优化中比较出名的方法,但也不仅限于企业流程优化,其核心理念就是减少流程中非增值活动,以及调整流程的核心增值活动。由消除-简化-整合-自动化(Eliminate-Simply-Integrate-Automate)四个步骤构成,只看名字好像有些理论派或假把式,但拆开后的一些具像化步骤或方法还是有用的,作为一款优化工具或流程思路我是认可和采用过的,就像是“CRAP设计原则”一样,高大尚的字母缩写名下却藏着朴实无华的好东西。
「注释:CRAP设计原则 = “亲密性、对齐、重复、对比”设计四大原则」
「注释:CRAP设计原则 = “亲密性、对齐、重复、对比”设计四大原则」
 
适用场景
流程优化或链路优化的发力点挖掘时。
上手技巧
这个方法我有一个小口诀,大伙儿可以参考下“去掉多余的、留下能懂的、排成有序的、减少人工的”
小案例
我们的代码脚本工具升级,从客户创建到脚本配置执行的复杂版本,到简化的极速版本发布,其中整合了用户主流的脚本工具诉求,然后消除了复杂冗长的配置过程,简化了操作门槛或功能复杂度,并创建了多条主流自动化的极速版本来支持业务,反馈和数据都有了明显转好
 
10、ECRS“分析法˜
是工业工程学中程序分析优化的四大原则,主要由取消-合并-调整顺序-简化( Eliminate-Combine-Rearrange-Simplify)构成,其实不必纠结这些分析法的刻板步骤或叫法,多看一些你会发现万变不离其宗,作为优化思路或策略,找到合适的方法并灵活的施展其实更重要,没有人说必须要按照这些分析法按部就班。
从单车上锁聊聊任务链路优化设计的思路与技巧
 
 
  •  
    取消( Eliminate):首先是根据规模、阶段或目标,考虑哪些是可有可无的,或价值有限的,能换掉的就换掉,能去掉的就去掉。
  •  
    合并( Combine):在不影响最终目标与质量的前提下,根据某些属性,将多个工序进行合并或融合。同时也要考虑融合后的体验与兼容性,如若不然就不要强制合并了。
  •  
    重排( Rearrange):即将相关的工作流程或内容进行新的顺序调整重组,以满足更合理更流畅的结构,例如减少了流程往返操作的不便、先易后难的配置表单。
  •  
    简化( Simplify):不是取消或减少而已,而是经过以上工序后。将剩余的或整体进行简单化、完整化、便捷化、智能化处理,可以是新技术应用也可以是交互方式的调整不等。
 
任务链路优化的思路或方法肯定还有诸多,例如《简约至上》中提到的删除、组织、隐藏、转移的应用等等,这里不再列举了,实际上掌握或了解几条比较实用的就差不多了。
 
一些还不错的分析工具˜
都是一些比较日常辅助工具,只是希望在大家的优化工作中能够提供一些帮助,如果你已经熟练掌握这些工具的应用,那就请忽略这部分哈,请直接前往最后的篇章总结吧。
整合分析类 ˜
○思维导图:可以快速帮助我们对信息进行树结构化与逻辑整理,并且可以结合图文以及功能图标等来完成管理及计划,能够将业务或功能框架快速显现出来,是很好的辅助工具之一;
从单车上锁聊聊任务链路优化设计的思路与技巧
 
 
○矩阵表格:可以很方便的将信息进行罗列与比对分析,在一些信息介绍或数据分析时常常会用到;
从单车上锁聊聊任务链路优化设计的思路与技巧
 
 
○服务蓝图:可以将完整的服务过程绘制出来,能够包含人物角色、前后台关系、阶段过程、状态扭转、交互触点等;
从单车上锁聊聊任务链路优化设计的思路与技巧
 
 
○体验地图:可以将服务、目标、用户、交互、反馈进行阶段化整合分析,本身是挺好的工具,只是设计师作品集中的用点儿虚,但不影响自己拿来实用;
从单车上锁聊聊任务链路优化设计的思路与技巧
 
 
○泳道图:可以根据时序对流程进行可视化,可以很好的传达职能部门或是角色之间的交互过程,也可以细分交互媒介、服务终端等因素之间的关系;
从单车上锁聊聊任务链路优化设计的思路与技巧
 
 
○流程图:主要就是围绕一个事件的开始到结束过程的流程可视化,流程图可以系统化的梳理业务逻辑与交互链路,泳道图也仅是流程图的一种,相信大家都很熟悉了,就不过多赘述了;
从单车上锁聊聊任务链路优化设计的思路与技巧
 
 
○鱼骨图:是一种根因分析工具,有头有尾有分支,像鱼骨,常用于定位问题发生所导致的根因,也可以用来制定任务目标进程的管理;
从单车上锁聊聊任务链路优化设计的思路与技巧
 
 
 
○状态机:一种针对事件状态扭转关系的流程图,用于描述系统的状态和事件,以及事件引发系统在状态间的转换过程,有点像是一系列的if语句,在中后台的系统设计中常常会有需要梳理状态的情况发生;
从单车上锁聊聊任务链路优化设计的思路与技巧
 
 
○业务框架:业务框架主要是一种将业务过程和活动进行组织和分类的方法,具有较大的颗粒度与较强的全局性,常用于表达业务框架单元之间的组成与活动关系。而业务模型主要是指业务概念关系的可视化简图,前文的流程图、泳道图、状态机等等都可以是业务模型;
从单车上锁聊聊任务链路优化设计的思路与技巧
 
 
监测洞察类 ˜
○交互自检:主要用于交互设计的查缺补漏跟避错,同时在交互链路自检的过程中是可以主动发现问题,并验证优化是否可行或合理;
从单车上锁聊聊任务链路优化设计的思路与技巧
 
 
○使用性测试:也叫做可用性测试,是对优化结果或Demo进行测试检验的过程,通过模拟真实的任务操作过程以达到洞察、探索、比较、效果验证等目的;
从单车上锁聊聊任务链路优化设计的思路与技巧
 
 
○A/B测试:常用于方案之间的效果比较或验证,通常都是借助工具引流获取一批真实用户的测试反馈,是一款真实有效的验证手段,不过方案之间的差异不宜过于悬殊;
从单车上锁聊聊任务链路优化设计的思路与技巧
 
 
○数据漏斗:像任务链路这种多线程或是节点较多的事件,单薄的点击率或转化率的作用是很有限的,这时候就需要在相关任务节点上布满更多的埋点,将用户流量与数据转化的情况用漏斗视图表现出来,然后就可以针对任务链路进行分析或比较了;
从单车上锁聊聊任务链路优化设计的思路与技巧
 
 
最后˜
本次主要是分享了对应优化工作中的一些技巧与方法,对于文章我很清楚看完和消化需要很多耐心与时间,这不像视觉作品来的那么接和轻松,写到这里已经大几千字了,最后铺一张框架大图帮那些看完脑袋空空的同学回顾一下;
从单车上锁聊聊任务链路优化设计的思路与技巧
 
 
 


作者:泡泡_PAO
来源:站酷
 
 

 

蓝蓝设计(www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的大数据可视化界面设计B端界面设计桌面端界面设计APP界面设计图标定制用户体验设计交互设计UI咨询高端网站设计平面设计,以及相关的软件开发服务,咨询电话:01063334945。

关键词:UI咨询UI设计服务公司软件界面设计公司、界面设计公司、UI设计公司UI交互设计公司数据可视化设计公司用户体验公司高端网站设计公司

银行金融软件UI界面设计能源及监控软件UI界面设计气象行业UI界面设计轨道交通界面设计地理信息系统GIS UI界面设计航天军工软件UI界面设计医疗行业软件UI界面设计教育行业软件UI界面设计企业信息化UI界面设计、软件qt开发软件wpf开发软件vue开发

 

如何为用户提供正确的键盘输入类型?

博博

Android和iOS系统都设计了针对特定表单字段的指定键盘输入类型。但大多数开发人员未能在他们的代码中指定正确的键盘输入类型。这会导致移动设备上的表单完成效率变慢。本文以Android平台为例。
一、输入类型并不总是“文本”
大多数开发人员错误地将每个表单字段的输入类型设置为“文本”。这存在问题,因为每个表单字段的输入并不总是纯文本。通常都有一些字段要求输入带有数字或字母和数字组合的信息。当用户尝试填写这些字段时,他们应该看到一个数字或字母和数字组合的键盘。
不幸的是,当每个字段的输入类型都设置为“文本”时,它会强制用户使用文本键盘来输入数字或字母和数字组合,输入时举步维艰,不是误点,就是需要频繁切换,输入体验十分糟糕。
因此,请务必为每个表单字段指定输入类型,以便系统能够显示相应的键盘。除了指定输入类型,我们还应指定相关行为,例如输入法是否提供拼写建议、是否将句子的首字母大写,以及是否使用“完成”或“下一项”等操作键替换“回车”。
输入类型、行为、操作键整理如下:
如何为用户提供正确的键盘输入类型?
例一. 邮箱地址字段
表单要求用户提供他们的邮箱地址是很常见的。当我们将输入类型设置为“邮箱地址”时,它会为用户提供一个针对邮箱地址输入的键盘。这个键盘不仅显示字母,还可以显示“@”和“.”,用户可以轻松地输入他们的邮箱地址。
如何为用户提供正确的键盘输入类型?
例二. 姓名字段
英文名是专有名词,英语中专有名词的第一个字母要大写。我们将输入类型设置为“人名”,并且设置单词首字母大写。用户无需对英文字母进行大小写切换。
如何为用户提供正确的键盘输入类型?
二、每个键盘对输入类型的反应可能不同
案例一:登录页面的密码输入
钉钉将密码框输入类型设置为“密码”。假定密码为 z0h0a0n0g。
  1. 百度输入法显示密码键盘,完成密码输入仅需点击 9 次。
  2. 搜狗输入法显示文本键盘,用户需在字母和数字之间切换,完成输入需点击 17 次。也支持长按第一行的字母输入数字。
  3. 微信输入法显示文本键盘,完成密码输入需点击 17 次。不支持长按字母输入数字。
如何为用户提供正确的键盘输入类型?
 
案例二:登录页面的手机号输入
钉钉设置电话号码键盘右下角为“下一项”按钮。
  1. 百度输入法的键盘右下角显示“回车”,用户完成手机号输入后需手动获取密码文本框焦点。
  2. 搜狗输入法的键盘右下角显示“下一项”,用户完成手机号输入点击下一项,密码文本框自动获取焦点。
  3. 微信输入法的键盘右下角显示“下一项”,用户完成手机号输入点击下一项,密码文本框自动获取焦点。
如何为用户提供正确的键盘输入类型?
三、Input Type 助力产品输入体验的提升
通过应用 Input Type 你可以正确的为每个文本字段设置特定的输入类型,以及看到每个输入类型(以及输入类型的组合)如何影响键盘。
我最初开发此应用是为了促进工作中跨部门高效协同,但我希望通过此应用能够赋能给更多的人,提升协同效率的同时更好的提升产品输入体验。你可以在这里免费下载:
https://www.pgyer.com/vT29
Input Type这个工具需要安装在安卓手机上,如果没有安卓手机可以电脑上安装一个网易MuMu安卓模拟器就可以用。
应用截图
 
作者:交互设计师张楚
来源:站酷

蓝蓝设计(www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的大数据可视化界面设计B端界面设计桌面端界面设计APP界面设计图标定制用户体验设计交互设计UI咨询高端网站设计平面设计,以及相关的软件开发服务,咨询电话:01063334945。

关键词:UI咨询UI设计服务公司软件界面设计公司、界面设计公司、UI设计公司UI交互设计公司数据可视化设计公司用户体验公司高端网站设计公司

银行金融软件UI界面设计能源及监控软件UI界面设计气象行业UI界面设计轨道交通界面设计地理信息系统GIS UI界面设计航天军工软件UI界面设计医疗行业软件UI界面设计教育行业软件UI界面设计企业信息化UI界面设计、软件qt开发软件wpf开发软件vue开发

雪球金融社区平台表情图标升级全纪录

博博

在社区平台语境里,表情无疑是很重要的组成部分。一套丰富且定位准确的表情可以帮助用户更清晰地表达自己的感受,增进沟通的准确性,同时增添社交互动的趣味性,拉进用户之间的距离。带有平台特性的表情更能彰显平台自身的独特性。
雪球作为金融社区平台,表情自然也是重要的元素。我们通过数据调研,发现雪球社区互动中表情的渗透率达到18%,表情的使用率比较高。而现有的表情年久失修,存在几个比较明显的问题,首先视觉风格陈旧辨识度低;再有,表情中原本存在一些股票梗的表现力较弱,画风不够有趣。第三,雪球诞生了新IP“呦呦”,非常适合在表情中应用来推广雪球品牌特性。
基于以上背景我们展开了对于表情翻新改版的项目。
 
XDC干货|雪球表情升级全纪录
 
 
现状&问题
通过对当前状况进行系统梳理,我们发现了一些存在的问题。
 
XDC干货|雪球表情升级全纪录
1.设计风格陈旧,不易识别表现力弱:
目前线上雪球表情风格老旧,视觉表达不符合当下设计潮流趋势;由于表情是白色在行文中表现力不足且不易被用户识别,因而趣味性表达的作用不够凸显。
XDC干货|雪球表情升级全纪录
2.缺乏股票基金场景的情绪表达
社区场景中有大量的股票基金的讨论和相关内容的情绪表达,而目前表情体系中缺乏此类表达或表达不够生动。
比如「关灯吃面」和「割肉」,在行文中一眼能识别到视觉主体是表情脸,而“吃面”和“割肉”的语义没有生动的体现出来;还比如「跳水」又太具象和写实,少了表情的趣味性。
XDC干货|雪球表情升级全纪录
3.没有将雪球的新IP融入表情
雪球诞生了新的IP“呦呦”,表情的体系非常适合融入IP向的内容,将IP表情化也更利于IP的推广和品牌的传播。
XDC干货|雪球表情升级全纪录
 
 
 
XDC干货|雪球表情升级全纪录
视觉风格探索
1.雪球用户特征
设计风格需要根据平台用户特征进行确定。开始设计之前,我们先看看雪球用户大概是什么样的。
XDC干货|雪球表情升级全纪录
雪球的主要用户为男性且集中在30-50岁左右,所以在视觉表现上尽量避免女性化或低龄化的风格。
2.视觉风格探索
风格确定
旧版的表情苍白,虽然细节很多但在行文中难以识别,本次改版重要任务之一是改版新的视觉风格。emoji是最被用户熟知的表情体系,我们决定新版向传统黄脸emoji表情靠拢。大方向定了,但还需要确定视觉感受符合雪球的emoji。最后在两种视觉风格中我们选择了视觉感受偏中性、风格扁平的这个方向,这个风格和雪球用户特征更契合。
XDC干货|雪球表情升级全纪录
提升辨识度
表情在交流中作为非文字的“语言”,其辨识度至关重要。表情在行文中的尺寸相对较小和单个文字差不多,那么如何保证在文字中依然能一眼读懂表情?
在对表情整体风格的把控下,需要通过对细节的打磨和反复实验,得出更有辨识度的设计方案。保持视觉扁平,尽量使用简洁的几何图形,加强颜色对比度,减少颜色数量,放大表情特征。通过以上手段有效的提升了表情的一致性和在行文中的辨识度。
XDC干货|雪球表情升级全纪录
 
 
 
XDC干货|雪球表情升级全纪录
发现股民讨论语境下的“梗”
本次表情升级除了对现有表情进行改造升级,还针对雪球社区特色进行挖掘。
1.挖掘“梗”
前面我们说到雪球用户是集中在30-50岁左右的男性,那么这类人群在社区中有怎样的表达特点呢?
通过观察我们发现,在面对股市的波动和不确定性,雪球用户更喜欢用幽默诙谐的论调来调侃市场以宣泄心中的无奈和负面情绪,同时在波动面前展现出一种坚韧和自嘲的心态。我们可以在这种“戏谑调侃”中挖掘可以视觉化的情绪和表情。以此作为本次表情升级的一个重要方向。
戏谑调侃的表情有哪些呢?我们挖掘了当下网络社交流行的表情包和热词。回想一下我们是否也经常使用类似“地铁老人看手机”“黑人问号脸”等网络热图来表达内心的复杂情绪呢。
XDC干货|雪球表情升级全纪录
在变幻莫测的股市中,面对现实的无力和不确定,祈福求平静成了股民表达情绪舒缓心情的一种方式,比如“敲木鱼”“祈求大涨”等仪式感的情境以表情的方式呈现,也能一定程度上引起用户的共鸣。
XDC干货|雪球表情升级全纪录
2.让表情“淋漓尽致”
  • 微表情尽显“内心戏”
一个表情里往往蕴含不只一种情感,短暂而难以察觉的面部变化最能传达个体真实的情感状态,一个眼神、嘴唇微动等细微变化,常常表达出个体内在的真实状态。
在设计“大哭”这个表情时,我们挖掘到大哭背后可能是某种“绝望”,那么观察下人们绝望时最大的面部特点是不是空洞的眼神和僵硬的脸?用这样的微表情和大哭结合在一起,感受大哭情绪的同时也传递了绝望的内心戏。
XDC干货|雪球表情升级全纪录
  • 赚了、亏了一目了然
股票社区中涨跌是永远的话题,市场的涨跌背后牵动着的是股民们真金白银的账户。“亏大了”和“暴富”这两个表情很生动的表达了用户盈亏的两种处境,但原有表情的视觉表达过于保守和隐晦。要让用户一眼看到就产生共鸣,红绿色是最直观的涨跌信号,我们把这种语义和表情结合,“亏大了”除了表情沮丧还得加点绿色烘托氛围,“暴富”的喜悦中再加上红包加持情绪。
 
XDC干货|雪球表情升级全纪录
  • 戏剧化表达
在某些极端情绪上我们还尝试打破旧表情的禁锢,用更加生动夸张的方式呈现。比如“绝望”,只靠面部表情似乎无法充分的表达,所以我们营造了简单的环境和肢体动作, 一个瘫在墙角双目无神的小黄脸,绝望的形象跃然纸上。
XDC干货|雪球表情升级全纪录
3.股票专属“梗”
雪球社区里有一些独特的表情,比如“关灯吃面”,它是雪球老用户传承的经典梗;还有诸如跳水、割肉、抄底、满仓等股票术语梗也颇受欢迎。升级优化这类表情的同时我们小开脑洞在原有基础上增加了“好基友”等新梗,让股民表达更丰富有趣。
XDC干货|雪球表情升级全纪录
 
XDC干货|雪球表情升级全纪录
IP表情化
去年雪球诞生了自己的IP“YOYO”,此次表情升级正好可以将IP表情化,在平台应用和传播。
YOYO所代表的品牌语义
1.福禄寿:因其原型是驯鹿,取福禄寿之意,代表财富;
2.温暖陪伴&服务感:驯鹿具备天生的陪伴和服务感,与雪球强调的品牌服务感相契合。
XDC干货|雪球表情升级全纪录
YOYO品牌语义表情化
根据YOYO的两种品牌语义,我们分别开脑洞。
哪些意向和财富相关呢?我们找到“锦鲤”“招财猫”“金元宝”,这些元素和表情相结合形成财富类表达;那么陪伴和服务感我们使用“抱抱”、“打call”这类温暖鼓励意向的肢体语言来和YOYO结合传达。
XDC干货|雪球表情升级全纪录
 
 
作者:雪球设计中心XDC
来源:站酷

蓝蓝设计(www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的大数据可视化界面设计B端界面设计桌面端界面设计APP界面设计图标定制用户体验设计交互设计UI咨询高端网站设计平面设计,以及相关的软件开发服务,咨询电话:01063334945。

关键词:UI咨询UI设计服务公司软件界面设计公司、界面设计公司、UI设计公司UI交互设计公司数据可视化设计公司用户体验公司高端网站设计公司

银行金融软件UI界面设计能源及监控软件UI界面设计气象行业UI界面设计轨道交通界面设计地理信息系统GIS UI界面设计航天军工软件UI界面设计医疗行业软件UI界面设计教育行业软件UI界面设计企业信息化UI界面设计、软件qt开发软件wpf开发软件vue开发

 

向用户请求权限的正确方式

博博

 

权限的目的是保护用户隐私,那么在何时以及用什么方式请求用户权限会是比较合适的?本文将详细介绍Android的运行时权限模型,并展示设计一个UX来请求你的应用程序所需的权限,希望对你有所启发。
从Android 6.0开始,没有在安装时请求所有权限,而是引入了运行时权限模型,开发者可以控制应用何时以及如何请求权限。这如同你想邀某人出去约会,过早、过频繁或以错误的方式对你来说并不好。
本文我将详细介绍Android的运行时权限模型,并向你展示如何设计一个UX来请求你的应用程序所需的权限。权限的目的是保护用户的隐私,但当你请求权限时,你是在要求用户放弃一点隐私,因此,你需要提供明确且平等的利益以换取访问。运行时权限允许你在用户更了解你请求权限的原因和授予权限的好处时选择合适的时间请求权限。Android实现它们的方式使得以正确的方式请求它们变得十分重要。
运行时权限模型有利于保护用户的隐私,当你的应用程序请求权限时,Android会显示一个对话框让用户接受或拒绝它,第一次请求权限时对话框不会显示“不再询问”复选框,只会在用户至少一次拒绝权限请求后显示它,你可以检查之前是否被拒绝过,并明智的决定在何时提供更多教育。
向用户请求权限的正确方式
从Android 11开始,如果用户在使用应用的过程中多次拒绝某项特定的权限,那么在你的应用再次请求该权限时,用户将不会看到系统权限对话框。该操作表示用户希望“不再询问”。
你无需过度防御,例如在实际请求权限之前你始终通过预许可(预授权)来衡量用户授予权限的可能性,本质上是请求两次,这种双重提示可能是不必要且烦人的,你可以通过在正确的时间以正确的方式询问来达到同样的效果。
Material Design分解了在两个维度上请求权限的不同方法。首先权限对你的应用程序的运行有多重要?其次,你请求它的原因有多清晰?根据这两个因素,建议你采用不同的方法来请求权限。
向用户请求权限的正确方式
预先请求权限(Ask up-front)
如果某项权限对应用程序运行至关重要,并且显而易见为什么需要请求它。例如日历应用,拒绝日历权限会使应用程序无法运行,并且用户显然知道日历应用的用途以及请求日历权限的原因,因此
不需要用任何不必要的解释来打扰用户,只需在用户首次启动应用时立即请求它即可。
向用户请求权限的正确方式
预先教育(Educate up-front)
如果某项权限对应用至关重要,但请求它的原因不是很清晰。例如信贷应用,为了准确评估用户的信贷资格、偿还能力和防范反欺诈,通讯录权限、通话记录权限、位置权限对于风控而言非常重要,建议请求权限之前对用户进行教育。
向用户请求权限的正确方式
使用场景中请求权限(Ask in context)
如果应用中的某项次要功能需要权限,但请求它的原因很清晰,建议你在使用场景中请求权限。例如笔记应用允许用户使用语音或音频创建笔记,那么很明显为什么此功能需要麦克风权限,无需过早的请求它,以免用户负担过重,最好等到用户尝试使用该功能时,因为用户更有可能允许符合其预期的权限请求。
向用户请求权限的正确方式
结合使用场景进行教育(Educate in context)
如果应用中的某项次要功能需要权限,并且请求他的原因不是很清晰,建议你结合使用场景进行教育。例如笔记应用允许用户与朋友协作,那么请求联系人权限可能是合理的,但它不是显而易见的,当用户调用该功能时,解释应用获得联系人权限后可为用户提供哪些好处,比如自动填充邮件地址,然后才请求联系人权限让用户授予它。
向用户请求权限的正确方式
处理权限请求遭拒情况
通过使用正确的方法,用户应该清楚应用请求权限的原因以及应用获得权限后可以为他们提供哪些好处。然而,这并不意味着用户一定会授予权限。如果用户拒绝了权限请求,建议采用以下做法:
  • 在应用界面中突出显示因为没有获得特定权限而受限的功能所在的具体部分,例如在原本用于显示该功能的结果或数据的位置显示一条消息,让用户知道因缺少权限而无法使用该功能,帮助用户在权限和功能之间建立心理联系。
  • 不要阻止界面显示,不要全屏警告消息,让用户根本无法继续使用应用。即使在权限请求拒后,应用也应尽可能提供最佳的用户体验。例如即使麦克风使用权限请求遭拒,仍应全面提高文本功能的易用性。
  • 用户可能已经选中了“不再询问“复选框,应用可能会在用户未看到权限请求对话框的情况下受到拒绝,此时应用应该提供一个链接,链接到设备设置中用户可以打开权限的具体位置。
尽量减少权限请求
在应用中声明权限之前,请先考虑是否需要这样做,或者是否有替代方法可以在应用中支持该功能。因为如果应用声明权限,那么每当用户使用需要运行时权限的功能时,应用便不得不中断用户的操作,请求相应权限。然后,用户必须做出决定。如果用户不能理解您的应用为何请求特定权限,可能就会拒绝授予该权限,甚至卸载应用。
下面介绍几个可以在不声明任何权限的情况下实现的用例:
拍摄照片/录制视频
Android为应用提供了相互通信的功能,让你可以将任务委托给其他应用。例如,如果你希望允许用拍照,但它不是应用的核心部分,可以考虑使用Intent请求相机应用拍摄照片并将其分享给你的应用,这样就不需要CAMERA权限。
自动输入动态短信验证码
双因素身份验证流程中,动态短信验证码作为第二校验因素时,使用SMS Retriever API(短信检索器)可以让应用自动执行用户身份验证,不需要用户手动输入验证码,不需要READ_SMS权限。  
 
作者:交互设计师张楚
来源:站酷
 

 

蓝蓝设计(www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的大数据可视化界面设计B端界面设计桌面端界面设计APP界面设计图标定制用户体验设计交互设计UI咨询高端网站设计平面设计,以及相关的软件开发服务,咨询电话:01063334945。

关键词:UI咨询UI设计服务公司软件界面设计公司、界面设计公司、UI设计公司UI交互设计公司数据可视化设计公司用户体验公司高端网站设计公司

银行金融软件UI界面设计能源及监控软件UI界面设计气象行业UI界面设计轨道交通界面设计地理信息系统GIS UI界面设计航天军工软件UI界面设计医疗行业软件UI界面设计教育行业软件UI界面设计企业信息化UI界面设计

软件qt开发软件wpf开发软件vue开发

如何为用户提供正确的键盘输入类型?

博博

Android和iOS系统都设计了针对特定表单字段的指定键盘输入类型。但大多数开发人员未能在他们的代码中指定正确的键盘输入类型。这会导致移动设备上的表单完成效率变慢。本文以Android平台为例。
一、输入类型并不总是“文本”
大多数开发人员错误地将每个表单字段的输入类型设置为“文本”。这存在问题,因为每个表单字段的输入并不总是纯文本。通常都有一些字段要求输入带有数字或字母和数字组合的信息。当用户尝试填写这些字段时,他们应该看到一个数字或字母和数字组合的键盘。
不幸的是,当每个字段的输入类型都设置为“文本”时,它会强制用户使用文本键盘来输入数字或字母和数字组合,输入时举步维艰,不是误点,就是需要频繁切换,输入体验十分糟糕。
因此,请务必为每个表单字段指定输入类型,以便系统能够显示相应的键盘。除了指定输入类型,我们还应指定相关行为,例如输入法是否提供拼写建议、是否将句子的首字母大写,以及是否使用“完成”或“下一项”等操作键替换“回车”。
输入类型、行为、操作键整理如下:
如何为用户提供正确的键盘输入类型?
例一. 邮箱地址字段
表单要求用户提供他们的邮箱地址是很常见的。当我们将输入类型设置为“邮箱地址”时,它会为用户提供一个针对邮箱地址输入的键盘。这个键盘不仅显示字母,还可以显示“@”和“.”,用户可以轻松地输入他们的邮箱地址。
如何为用户提供正确的键盘输入类型?
例二. 姓名字段
英文名是专有名词,英语中专有名词的第一个字母要大写。我们将输入类型设置为“人名”,并且设置单词首字母大写。用户无需对英文字母进行大小写切换。
如何为用户提供正确的键盘输入类型?
二、每个键盘对输入类型的反应可能不同
案例一:登录页面的密码输入
钉钉将密码框输入类型设置为“密码”。假定密码为 z0h0a0n0g。
  1. 百度输入法显示密码键盘,完成密码输入仅需点击 9 次。
  2. 搜狗输入法显示文本键盘,用户需在字母和数字之间切换,完成输入需点击 17 次。也支持长按第一行的字母输入数字。
  3. 微信输入法显示文本键盘,完成密码输入需点击 17 次。不支持长按字母输入数字。
如何为用户提供正确的键盘输入类型?
案例二:登录页面的手机号输入
钉钉设置电话号码键盘右下角为“下一项”按钮。
  1. 百度输入法的键盘右下角显示“回车”,用户完成手机号输入后需手动获取密码文本框焦点。
  2. 搜狗输入法的键盘右下角显示“下一项”,用户完成手机号输入点击下一项,密码文本框自动获取焦点。
  3. 微信输入法的键盘右下角显示“下一项”,用户完成手机号输入点击下一项,密码文本框自动获取焦点。
如何为用户提供正确的键盘输入类型?
三、Input Type 助力产品输入体验的提升
通过应用 Input Type 你可以正确的为每个文本字段设置特定的输入类型,以及看到每个输入类型(以及输入类型的组合)如何影响键盘。
Input Type这个工具需要安装在安卓手机上,如果没有安卓手机可以电脑上安装一个网易MuMu安卓模拟器就可以用。
应用截图
应用截图

作者:交互设计师张楚
来源:站酷

蓝蓝设计(www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的大数据可视化界面设计B端界面设计桌面端界面设计APP界面设计图标定制用户体验设计交互设计UI咨询高端网站设计平面设计,以及相关的软件开发服务,咨询电话:01063334945。

关键词:UI咨询UI设计服务公司软件界面设计公司、界面设计公司、UI设计公司UI交互设计公司数据可视化设计公司用户体验公司高端网站设计公司

银行金融软件UI界面设计能源及监控软件UI界面设计气象行业UI界面设计轨道交通界面设计地理信息系统GIS UI界面设计航天军工软件UI界面设计医疗行业软件UI界面设计教育行业软件UI界面设计企业信息化UI界面设计

软件qt开发软件wpf开发软件vue开发

从产品创新到品牌体验,设计究竟有多重要?

前端达人

在当今激烈的商业竞争中,企业成功的因素多种多样,其中设计是否成为决定性因素备受争议。从产品创新到品牌体验,设计的影响力逐渐凸显。本文将深入探讨设计在商业领域的重要性,并剖析其如何塑造企业形象、影响产品销售以及提升用户体验。

 

1. 设计与产品创新

产品创新是企业保持竞争力的关键之一,而设计在这一过程中扮演着重要的角色。通过独特的设计理念和创新的外观,企业能够突破传统,吸引消费者的注意力。例如,苹果公司凭借其独特的产品设计,成功地将智能手机从功能性产品转变为时尚潮流的代表。

 

2. 设计与品牌形象

品牌形象直接关系到企业在市场中的地位。设计不仅仅是产品外观,还包括标志、广告、包装等各个方面。一致、有吸引力的设计能够加强品牌认知度,形成独特的企业形象。例如,可口可乐的标志设计一直以来都是简洁而具有辨识度的代表,为品牌树立了强大的形象。

 

3. 设计与产品销售

消费者在购买产品时通常会首先被外观所吸引,而设计正是影响消费者购买决策的一个重要因素。产品设计的吸引力可以直接影响销售情况。一款外观精致、符合消费者审美的产品更容易赢得市场。因此,企业在产品设计上的投入,往往能够在销售层面获得回报。

 

4. 设计与用户体验

随着消费者对产品体验的重视不断增加,用户体验设计变得愈发关键。用户友好的设计能够提高产品的易用性,增强用户满意度。无论是软件界面还是实体产品的操控,设计都直接影响着用户的感受。互联网公司中,用户体验设计更是被视为至关重要的一环,因为一个良好的用户体验能够促使用户更加愿意持续使用产品。

 

结语

在当今商业环境中,设计不再是简单的装饰品,而是企业成功的关键因素之一。从产品创新到品牌形象再到用户体验,设计在多个层面发挥着重要作用。企业若要在竞争中脱颖而出,就需要认识到设计的战略价值,并将其纳入业务发展的核心考虑之中。在这个创新迅猛的时代,或许真正能够决定企业命运的,就是那个看似微小却能够改变一切的设计元素。

蓝蓝设计(www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的大数据可视化界面设计B端界面设计桌面端界面设计APP界面设计图标定制用户体验设计交互设计UI咨询高端网站设计平面设计,以及相关的软件开发服务,咨询电话:01063334945。

关键词:UI咨询UI设计服务公司软件界面设计公司、界面设计公司、UI设计公司UI交互设计公司数据可视化设计公司用户体验公司高端网站设计公司

银行金融软件UI界面设计能源及监控软件UI界面设计气象行业UI界面设计轨道交通界面设计地理信息系统GIS UI界面设计航天军工软件UI界面设计医疗行业软件UI界面设计教育行业软件UI界面设计企业信息化UI界面设计、软件qt开发软件wpf开发软件vue开发

B端产品 | 如何快速建立业务&产品认知

博博

先说结论:是很好的“答疑期”,但帮助有限,学会问问题,同时接纳自己暂时不懂的情况。
 
在入职后,一般会有业务方向、研发背景、设计思路、产品使用流程等方面的培训讲解。但即便同事讲的不错,对于刚入职的我们来说,也很难短时间内消化掌握,并直接应用到设计工作中。
 
在这个时期,有三点建议:
  1. 找关键词
  2. 虚心请教
  3. 提出问题并给出方案
 

日历

链接

个人资料

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

存档