首页

为什么如今很多产品和服务给人支离破碎的感觉?

资深UI设计者

如果您想订阅本博客内容,每天自动发到您的邮箱中, 请点这里

不知道为什么,聪明的人常常会做出愚蠢的决定。我在之前的《The Curse of Knowledge Bias》文章当中,曾经提到过这个问题。很多人会因为之前他们所掌握的甚至依靠的知识而产生偏见,很多时候会倾向基于一个特定的指标来决定。

很多时候,我们忘记了生活中有很多事情是易于衡量的,而很多重要的事情,并不一定如此。两者之间的关联性并没有那么强。

在数字设计领域,我们倾向于探索事情的扩展性和性,这是数字设计本身的优势,但是这种思维方式也对商业世界产生了重大的影响。为什么?主要的原因在于商业本身要求赚到更多的钱,而快速和可拓展的模式怎么看都非常贴合商业的需求。相应的,大家在可拓展式的模式下,就不再追求高质量,在意的更多的是「能否扩大规模」。「它是可规模化的吗?不行?好的,下一个。」

你看,数字领域的东西就是数字领域的东西。它在算法指标上,在自己的模式下且有效地运作着,但是这种而机械化的模式通常是在自己的模式下才有效的。希望它与人类的现实无缝衔接并且自恰地运行,看似可行,实则问题多多。

大家对于创造更快、效率更高的机器都有着持续且狂热的情绪,在某些情况下也许是进步,但是在更多的时候,常常会带来不良的后果。这一切都始于公司想要快速构建产品,或者加速规模化的做法。「它具备扩展性吗?」「我们要始终保持!」这些语句成为了铁律,并且在铁律之下,所有人都期望得到不同的结果。清醒下来想想,这种粗暴且不顾一切的做法,就像用锤子解决生活中所有的问题。

我们专注于技术本身,这使得我们和人性渐行渐远。——Rory Sutherland

将问题肢解成为更小的部分,然后交由不同的部门,分开解决,最后合并到一起。

这种策略主要是从科技公司借用过来的,更准确的说是从数字开发领域学习过来的,他们使用这样的方法来改进产品的算法。你将一个大问题分解成为更小的块,将它交由不同的团队,这样大家在同期进行的情况下,可以提升进度,在一天结束的时候,大家再将各自完成的部分拼接到一起,粘合成为一个产品。很多问题,很多产品以这样的方式更快地完成了。

每个公司都在这么做,似乎是有效的,我们为什么不这样呢?

我同意,这确实有用。但是这里存在一个巨大的问题,就是解决问题的语境和背景。你正在做的事情很大程度上和需要解决的问题脱节了,很多人就像带着眼罩的马匹,跑得再快也是盲跑。

在这种局面下,所有人都只会局限于眼前的一小块的工作内容,而周遭的环境和内容不会去注意也没有精力去关注。接下来就会发生上图所示的情况,然后你需要削减内容来确保内容具备可扩展性。而在上图的案例当中,付出的代价是互动性。

很多问题其实和「数独」一样

也许你玩过数独,这是一种基于数学逻辑的有趣的数字游戏,它需要你综合考虑填写的数字,确保每行每列上的数字是完整自恰的。

通常,数独游戏会使用一个大的九宫格,每一格当中又包含一个小的九宫格,总体上呈现出来的是一个9×9的大网格。游戏会事先给你一部分数字,你需要填写剩下的一部分,确保每行每列当中都有数字1~9,而每个小的九宫格也要包含数字1~9,而每个数独拼图都会有一个唯一的答案。

这个游戏有趣的地方在于,你没有办法将数独整个拼图的一部分交给别人来做。因为只有纵观整个数独布局的人才能推算出唯一的答案,分给别人分开做最后再拼到一起,是解决不了的。我们实际所设计的产品基本上都不是简单线性的,在面对实际问题的时候,很大程度上和数独是相同的,要从更宏观更系统的层面上来看待问题,而不是将点赞按钮的重设计完全交由一个部门全权负责。

将一个问题划分为更小的部分,并且将不同的部分划归给不同的部门来思考和解决是一个「很好的办法」。这就像你在医院外科接受治疗的时候,身体被切成10个部分,交由10个不同的外科医生来给你治疗,最后再缝合到一起。

错误语境下的「正确行为」

这里所存在的问题不仅仅是在效率上,而且还在于方法本身。在这个事情当中,很多行为的方式是正确的,但是这些方式被用错了地方,用错了语境。

这就像一个传教士在一个前不着村后不着店的脱衣舞俱乐部去传教一样。传教本身没问题,但是这个地方真的不合适。

我们将问题划分为小块是没有问题的,但是这并不意味着在产品流程中一直就做这么简单的切分。有人说这样做大型的项目是很合理的,我同意。很多时候,问题的解决方案有很多,而且不同的解决方案也并非是非此即彼的,不过大家往往会选择一种而放弃另外一些。如果只是依靠纯粹的理性和直接的逻辑来解决问题,那么世界在很大程度上不会有真正意义上的进步。

一些超级理性的高管让产品走向了超级无聊的方向。——Gary Hamel

如果这个方法不对,那么我们为什么还要继续这么做?

首先,必须承认,这种方法是有效的,只不过这种方法下产出的产品是破碎的。并且,在很多时候,大家并不急于尝试更有创意的解决方案。

其次,个别机构,或者更具体地说是不少人,是在纯粹的理性驱动行为的环境下茁壮成长起来的。在多人团队当中,在各种委员会当中,在你所在的任何团体当中,大家都需要用合理的逻辑和理由来解释各自的行为。因此,组织机构在解决问题的时候,倾向于寻找逻辑最优解这样的东西。人们也更加倾向于将组织机构的运作方式和机器的逻辑等同起来。

做一些理性或者合乎逻辑的事情,就永远不会被解雇。但是你可能会因为做创意而被解雇。——Rory Sutherland

猎杀松鼠的故事

很多时候案例更有说服力。在18世纪,法国松鼠成灾,政府专门拨款想解决这个问题。如果有人猎杀了松鼠,并且将尾巴上交上去,就能够根据数量获取相应的奖励。这样来看,整体上是一个合乎逻辑的事情吧?可是,实际的情况是,法国政府所发放的奖励逐年上涨,可是松鼠的问题从来都没有得到缓解。事实上,大家发现这个情况还变得更糟了。政府慢慢才意识到,不少民众开始豢养松鼠来换取奖励,很多上缴来的松鼠并非是猎杀的。这是一个典型的不恰当奖励的案例。

人和机器的思维方式是不同的,对于机器而言,1+1=2,但是对于人而言,这个逻辑有可能是1+1=苹果。我们不仅会陷入有缺陷的思维方式当中,这些不恰当的方式甚至会引发错误的行为。

脱离语境的现状

其实,我最担心的是,我们按照机械直接的逻辑来解决问题,会引发不良的行为和不好的结果。很多解决问题的方法,缺少很重要的一块内容:那就是将人们的思考、决策的运作机制纳入到体系当中。当一个任务被分配给不同的人之后,每个人面对任务的时候都是管中窥豹,盲人摸象,看不到全局,相应的,每个人所面对的指标也都是琐碎的,并且有可能只会影响到当前微不足道的范畴。

由于产业和产业之间的天然壁垒,很多公司必须将特定的产品、模块或者服务外包给第三方,以降低成本,并且完善产品或者产业链。但是这种局面下,公司也没有办法在这些外包出去的领域上投入足够多的时间,自然也谈不上创新。很多品牌在多年以来都没有办法带来有意义的创新。完全分散的任务和小团队,最终受困于自己手头的一些小事情,比如来回调整点赞按钮的样式。

对于无用指标的奇怪痴迷

现代人对于消费电子产品非常痴迷,但是如果你仔细审视这个事情,会发现绝大多数人都受困于一些基本上没有什么意义的指标上。

早在1759年,亚当史密斯就在他的《道德情操论》当中,提到过人类对于一些无意义指标的沉迷的事情。

史密斯发现那些小工具爱好者都会非常沉迷「参数」,我们以业余摄影师来举例,你很少看到他们拍摄出真正让人觉得眼前一亮的照片,但是他们非常沉迷于画幅、像素、iSO范围,快门延迟等参数,对于某些厂牌的镜头参数或者相机指标非常之了解。这种状况在汽车、电脑、手机等领域的业余爱好者当中,也是相当普遍的存在。我们需要更好的技术支持,但是我们所探讨的指标,则往往意义不大。

Rory Sutherland 在他的一篇文章中分享了这样一个案例:

有一块机械表,平均一天时间内会慢2分钟左右,它的主人纠结于这一点,将它卖了,然后花了接近10倍的价格买了另外一块手表,新表大概半个月才会慢1秒。然而对于这个人而言,手表的功能仅仅是提醒他不会错过大的事情,大概知道当前时间,避免遭遇其他的不便。但是,手表本身准时不准时的事情让他纠结和焦虑了很久,相反他对于时间倒是不那么焦虑。他感兴趣的仅仅是手表的准时,是它本身的完美与否,而非时间本身。

「参数沉迷」是思维惯性

对于参数的沉迷,在关键的事情上可能会带来不好的影响。可是,即便是无法量化的「参数」,有的时候也会带来坏决策。Rory Sutherland 为此还分享过另外一个事情。

许多美国公司将客服部门的人员视作为公司账面上不应存在的「花销」,这也使得他们纷纷将自己的客服部门外包给印度。相应的,很多美国用户给隔壁楼的公司打客服电话的时候,会转接到印度,在一个口音不明的接线员的服务下,艰难地沟通,并且不一定能解决问题。

奥美是 Rory 的客户之一,他有一次打电话到奥美的呼叫中心,他们的客服给人体验非常棒,乐于助人,知识渊博,充满魅力。所以 Rory 后来咨询奥美的人事,为什么他们的电话接线员能这么优秀。结果奥美的人事笑着回复他:「其实,我们给客服人员的回馈已经超出他们原本的价值。」

原来,对于做客服这一行的人而言,在美国本土想要找到足够好的工作,可能需要去很远的地方,才能找到工资足够可观的职位。而奥美的工作地点本身在某个大城市不远的地方,他们的客服来奥美工作根本不需要花费太多时间在通勤上。另一方面,他们的客服人员大多在公司待了几十年之久,这使得他们对于工作内容非常之精通。这样一来,在这些客服人员身上投注的时间、精力甚至花销,都不是成本,相反,这些客服人员成了公司成功的基石。

固然,将公司的客服部门转移到人力成本极为低廉的国家,比如印度,能够为公司节省很大一笔开支,但是实际上,这件事情给公司本身的业务所带来的负面影响也是持续的。

最终,这还是一个视角上的问题

Andre Malraux 在他的小说《Hope》当中,讲述了一系列关于西班牙内战期间的故事。书中有一个插曲,一位农民来到共和军,告知他们法西斯分子在树林中建造了一个秘密机场,不过农民自己是个文盲,他看不懂地图,但是他愿意做导游,帮共和军指路,去炸掉这个秘密机场。于是,他坐上了一架轰炸机,随着飞行员一同去寻找秘密机场。

农民熟知方圆几十公里内所有的村庄,山脉,河流,了解土地,也熟知庄稼的种植和生长。但是当他坐上飞机,把眼睛压在玻璃上尽力往下看的时候,他分辨不出来他生活过28年的村庄,不认识他每天走过的街道。Malrzux 在书中写道:「如果有人会因为找不到东西而死的话,那么这个农民肯定已经死过很多次了。」

飞行员已经把飞机的高度压到30米了,几乎贴地飞行,他试图让农民尽力按照他习惯的视角去看待地面的一切。森林中的树梢几乎舔拭着飞机的底部,农民的视野中的山林开始接近他在林间开车时候的视野,他最终找到了那个隐藏的机场。

一旦你以一个视角工作了30年,你会比其他人更难看到事物本身的另外一面。

更全面的视角

我知道,糟糕的企业文化,激烈的办公室政治,错漏百出的产品,并不是这种产品开发模式和思维方式所造成的,但是它在整个体系当中扮演了极为重要的角色,放大了问题。对于和可拓展性的痴迷,注定会在更长的时间尺度上,创造一个糟糕的产品,甚至带来一个糟糕的公司。

太多的公司和团队将人置于一个固定的位置,让他们在自己的工作循环当中待着,不让他们具备额外的视角。试想一个开发团队中,3个人只负责首页右上角的搜索框和过滤器的开发,他怎么会在意整个产品是否有更大的缺陷?

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

谈谈 iOS 11 设计中的几个 UI 设计细节

用心设计

如果您想订阅本博客内容,每天自动发到您的邮箱中, 请点这里

 

今天从 Apple 官网看了 iOS 11 的介绍,发现有不少的更新哦,比如控制中心、Siri、Live Photo 等等,总体来说都有很多不错的体验,不过本文不介绍功能,只说视觉界面。

在 iOS 11 的新 UI 界面中,重大更新的界面主要有 App Store,所以我从应用商店的UI设计也能看出一些大概细节。

图标:从线性改为面形

新版 Store 的图标从线性改为面形,图标也加入了圆角,看起来更加圆滑,同时和 iOS 10中的 iTunes 相关应用风格也统一了。

Icon 颜色比如来的线性浅了一点,这样做看起来就不会过重,所以大家在使用面形的图标设计时,颜色要把握好。

iOS 10 App Store

iOS 11 App Store

iOS 10 iTunes

卡片式设计

在新版的 iOS 11 界面,有不少的地方采用了卡片式/宫格式排列,卡片式的设计非常适合图文排版,并且在手机端有不错的阅读体验。

 Material Design 中也是很重视卡片式设计,所以日后可以多考虑使用卡片式风格。

 

 

 

大投影

当转为卡片式设计后,为了提升层级表现,界面也增加了大块投影,是不是和 Material 风格有点像?

小编细看了下, APP 在 iPad 的封面与手机端的尺寸不一样,一个是横,一个是竖(工作量又增加了……)

iPad 的封面是横的

iPhone 手机端封面(竖)

为了美观,而增加了人力成本,到底值不值?这个封面就像一个网站的文章封面图一样,一篇文章要做2张封面图,这不仅增加人力成本,还增加运维成本。

无处不在的圆角

圆,像曲线一样,有圆滑、活泼、动感、柔和的感觉,更容易让人亲近。亲和力有了,吸引用户就更多了,iOS 的圆角在不同 UI 上使用的圆角大小略有不同,这就是细节,看来 iOS 在圆角的运用已到了出神入化之境。

Material Design 虽然也存在圆角,但要么圆角在太小了,要么就是直角。

而 Windows 的扁平化,就是一块方形。

想做出让人亲近的界面?学会用「圆」也许是很大的秘诀。

蓝蓝设计www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 

产品设计中“+”功能的相关思考

用心设计

如果您想订阅本博客内容,每天自动发到您的邮箱中, 请点这里

 

日常工作中,有很多看似平凡的小细节,常被大家忽视,却影响着用户的真实体验。比如,前几天跟同事们针对产品设计中“+”功能所运用的场景、展开形式进行讨论,发现这是一个挺有意思的话题。

所以跟大家分享下,我的一些相关思考。

1. “+”的运用场景

我们常见的产品中,采用“+”功能的场景,大致分为两种:a.(上传)内容选项;b.(聚合)快捷功能。

a.(上传)内容选项

根据“+”的直观表意,大致也能猜到它的运用跟“添加”、“上传”某个东西相关。

比如:微博,点击“+”入口后,是选择所要上传的内容类型。(可以晒自己精修X小时后妈都认不出来的自拍、也可以晒逗比的小视频、或者老子就想搞一场直播)。

比如:下厨房左上角的“+”,点击后,是选择上传作品,或者创建菜谱的选项。

再比如:工具类产品:Google drive,dropbox、百度网盘、微云,点击“+”后,同样是选择上传不同文件的入口。

可以看出,这种情况下的“+”功能,多指“添加”、“上传”的含义,所承载的内容,是同一纬度下的不同选项。

b.(聚合)快捷功能。

众所周知,产品为了节省界面空间,同时避免过多功能给用户不必要的干扰,会选择把一些不常用的快捷功能收到二级展示。常见的产品中,他们选择把这些快捷功能塞进“+”里。

那么,你是不是觉得“+”功能跟“…”功能承载的内容是一样的?比如:乐趣首页右上角“…”,同样是对频率较低的功能的集合。

那为什么有的产品不直接用“…”,还是选择用“+”呢?

通过分析发现,“+”虽然也是聚合快捷功能的入口,但承载的功能有一个共性:都是围绕着用户主动打开、发起、新建…等操作进行的,因此用“+”更贴切。

比如:微信里的“+”,包含着:“发起群聊”,“添加朋友”,“扫一扫”,“收付款”,其实都跟“添加”有关。

比如:淘宝也是类似的处理方式。

再比如:爱奇艺的“+”,里面包含的也是跟“添加”,“上传”相关,像上传视频、扫一扫、我要直播….

反过来看“…”,它聚合的功能,大多是相互关联较弱,且没有主动添加、上传等含义的。因此,用一个相对模糊,没有指向性的符号诠释,更为合适。

由上可以看出,在这种情况下,“+”作为聚合快捷功能的入口,包含的是频率较低,且跟主动“新建”、“发起”、“扫描”等相关的功能。

 2. “+”的展开方式 

当用户触发界面中的“+”时,常见的展开方式有3种,分别是:a.气泡弹出框;b.动态栏;c.沉浸模式。

a.气泡弹出框

气泡弹出框,这个控件又常被称为Popover,一般是由一个矩形和三角箭头组成的弹出窗口,通过点击Popover内的按钮或者非Popover的屏幕其他区域可关闭。

比如,以微信为代表的“+”的展开方式,采用的就是Popover。一般用于聚合快捷功能。优点是触发“+”到Popover的距离很近,操作顺手,效率高(更像是导航的延伸)。

b.动作栏

动作栏,这个控件官方称之为Action Sheet,是用户触发“+”后,出现的一种模态弹出框,里面包含一组与当前情景相关的选项,一般用于上传内容选项

在iPhone屏幕上,为了便于单手持握时操作,Action Sheet通常占据屏幕底部区域。

比如:以Google drive、Dropbox为代表的产品,需要选择上传文件类型的选项。

在这个部分,同事们讨论有些争议点,在于:google drive 和 Dropbox或者微博,它们的加号本来就在底部,所以弹窗让用户感觉视线统一。

而有的产品“+”在上面,弹窗从底部出来,担心注意力切换和手指移动的路径比较长,显得割裂。

带着这个问题,我调研了下有类似情况的产品,会不会让人觉得不舒服。

后来发现,不会的。原因在于我们常用的、拥有10亿+用户的微信,发朋友圈时操作就是这样,而我们并没有感觉很割裂,反而已经习惯。

同样,iPhone自带的“提醒事项”App,也是这样处理。

后来看了规范发现,iOS确实意识到在iPad上,如果继续将Action Sheet显示在屏幕底部,如果频繁操作使用会比较累。因此,做了特殊处理。而手机屏幕上以底部为主,同时点击空白区域取消的操作,也是系统用户所熟知的。

总的来说,操作栏适合承载同一纬度下的内容选项,同时,就算“+”在顶部,采用底部动态栏,体验上也是没问题的。

c.沉浸模式

沉浸模式,指的是当触发“+”时,用户在全局蒙层上进行功能操作,同样适用于上传内容选项。

优点是拓展性更强,体现在:1.提升收益;2.品牌认知;3.内容运营。

1.提升收益

比如:微博,采用沉浸模式,下面是上传不同状态类型的入口,上面可以增加广告收入。

再比如:微云,在沉浸模式下,可以植入自己的“会员”广告,从而提升会员转化。

2.品牌认知

比如:有道云笔记,在顶部的空间内,宣传自己的品牌slogn:“记录,成为更好的自己”,是一种品牌情感化的传递。

3.内容运营

像“好好住”,它们在这个页面加入“话题”运营推广。从而给UGC内容模块带节奏。

大多数产品都想营造社区氛围,建立用户关系,从而增加用户粘性,提升产品留存。

但要想拥有浓厚的社区氛围,首先要有内容、才有人愿意看、才有人在里面互动。

现实问题是,有很多用户有想发状态的心,但不知道发啥,从而放弃。因此,我们应该作出相应的引导。

比如,“好好住”在发布环节,增加话题运营“#每天一张生活日常#”入口,就是解决刚才说的“用户不知道发什么”的问题。运营同学想点子、造话题、带节奏,从而提升用户的发布量。

因此可以看出,“沉浸模式”,对于那些有拓展需求(收益、品牌、运营)的产品更适用。

不知道你有没有发现,相比国外,国内采用这种“沉浸模式”的产品偏多。或许在中国这个互联网竞争如此激烈的大环境下,大家不愿意放弃任何一个能够运营或留住用户的机会。 

总结  

总的来说,在常见的产品中“+”功能的运用场景有:(上传)内容选项、(聚合)快捷功能;它的展开方式可分为:气泡弹出框(适合承载快捷功能)、操作栏(适合容纳内容选项)、沉浸模式(容纳内容选项的同时,拓展性更强)。其实,交互形式没有好坏之分,只有哪个更适合自己的内容需求和产品目标,正如Louis Sullivan所说:“形式追随功能”。

小tips:日常工作中有太多类似“+”这种,看似一个不起眼的小功能,被大家忽略。我们习惯性看一下竞品,拍脑袋决定方案。

但是,慢慢你会发现,只有深挖和分析这些所谓的“小细节”,才能知道别人这么做背后的原因、才能举一反三的去运用、才能更好的兼顾统一性和拓展性,而不是停留在浮于表面的模仿。

蓝蓝设计www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 

一篇文章读懂数字化驾舱智慧出行

ui设计分享达人

数字化驾舱近来大热,数字化驾舱的组成元素包含哪些以及又有哪些驾舱相关的新技术出现?在这里,MOMOUX带你读懂数字化驾舱。

让设计更具有趣味性的5大TIPS

用心设计

如果您想订阅本博客内容,每天自动发到您的邮箱中, 请点这里

 

这是一个创新的年代,如果你的设计千篇一律,哪对用户来说,这是很乏味的作品。所以在满足设计需求的同时,我们可以加入一些趣味性的东西,比如方案、声音、交互细节、图像等等,让页面更加有趣。

这里有5个提高设计更有趣味性Tips,欢迎大家在设计项目中尝试。

一. 就是不能好好讲话

通过夸奖、傲娇的语气满足用户虚荣心及好奇心

文案的趣味化,简单有力,看似不经意,但却是最直白的幽默。像下图小红书的随机点赞设计,每次点赞的提示不同,有的是夸奖、有的是暖心告白、有的是引导用户继续点赞…这样的设计,因为有惊喜感,所以激发了用户的好奇心,并不断点赞尝试。

而网易云音乐的Mac安装包提示文案:「你的Mac终于拥有最佳音乐App了!」不讨论产品好坏,这句文案就一语双关,既夸奖了自己产品好,也夸奖了用户有品。

用「机智」的话有情感的引导用户

下面的两个场景是我们最熟悉不过的聊天页及注册页。左边是主打微社交的Nice,在没有消息的时候它不是生硬的提示0条消息,而是很好的结合了自己产品的微社交调性,委婉的告诉用户你是不是应该主动些?而不是被动的等待。从情感上用户会觉得更放松也更容易接受这样的建议。

右边是same的注册页,通常注册页都枯燥而冗长,为了避免用户产生负面情绪,Same这里的性别选择文案是:女生果然总是对的!男生有时候也是对的!在填表产生抗拒心理的时候出现这样讨好的文案,谁还会有什么负能量呢?

文案说他想领便当了

对于开玩笑要有一个度,像作到飞起的手机端网易云音乐的推送文案:「你这么爱听歌,一定活的很难过吧」。虽然可能说的是实话,但是没人愿意听这样的大实话,所以对于一些相对玻璃心的用户来说会觉得受到了嘲讽,这样的文案就容易起到反向作用。

△ 微博评论截图

二. 扁平里的写实派

模拟真实场景,让用户感受细节的用心

这里更像是拟物化行为的设计,模拟真实的使用场景。将我们在日常生活中习以为常的小细节,融入到页面细节的设计中去,被用户发觉时应该会会心一笑吧。这也最能体现设计师的观察力及对细节的把控力。像iOS的手电筒开关设计和飞行模式的设置就是这样的,手电筒开关的时候,上面的小按钮也会跟着开和关,飞行模式的开关则有一个向右的飞行路径,并不是生硬的出现然后消失。

对模式化的元素注入性格,增加新鲜感

这里还是拿Same举例,通常我们用的p图软件的滤镜,一般是以色彩给人的直观感受来命名的。而Same的每个滤镜有自己的名字、性别、出生年月甚至的表情、性格(据说每个原型是来自他们团队的设计师),这样的设计确实会让人觉得:「诶!有点意思,跟外头那些妖艳滤镜果然不一样呢!」

三. 玩不腻的小彩蛋

打破常规,吸引用户注意

对于熟悉的行为我们会产生枯燥的情绪,然后随之会忽略。当在熟悉的情境下,出现了意想不到的小彩蛋,必然会增加用户印象,提高用户注意力,并产生积极愉快的情感。像Facebook的聊天表情,在输入时长按,就会变成超大的表情,好比在说给你一个大大的赞、给你一个大大的爱心……这样的设计,真的是会玩到停不下来 。

情理之中意料之外,增加用户印象

我们都知道的格瓦拉,在线选座时遇到一些院线热映,选座状态会变成电影的主角头像 ,这对用户来说是一种加深印象的预热,要比默认选座状态更有代入感。

最美有物,是一款销售设计师产品的平台,印象最深刻的是喜欢与不喜欢的表态设计,他的主张是找到同样品味的人,所以这里的小动画就做的细腻又有趣,将不屑和喜欢表达的淋漓尽致,比起正常的点击即高亮,更能表现用户的情绪、产生共鸣。

贴心设计,让用户产生好感

使用金融类软件时,最怕的是没钱,更怕的是有点钱刚点开App旁边有人过来了, 这时候匆忙关闭显得很不自然。微众银行的滑动隐藏资产的设计很好的解决了这个问题,保护了私密性的同时操作起来也不会显得那么尴尬,这样真正的替用户考虑的设计怎么会不让人产生好感?

四. 不如一起玩游戏

用激励的方式满足用户虚荣心与攀比心

通过设计一些有挑战性的小游戏,让用户参与进来,可以激发用户的好奇心以及攀比心,在完成任务的过程中满足用户的存在感、归属感及参与感,游戏的设计也是这里面互动性最强的一种设计,也是最有趣味的。Nice就使用了收集徽章的方式来鼓励用户发图片、使用功能等,对用户是激励的同时,并可满足用户在其好友跟前的攀比心。

奖励化,让用户有存在感与归属感

Same平台的早安、晚安打卡功能,会随机赠送给用户一首歌,打卡这件事一方面对于平台来说提高了用户留存,另一方面对喜欢音乐的用户来说则找到了归属感与存在感,会觉得有这么一个平台是懂他们的。

下面两个利用奖励化机制提升参与感的例子来自腾讯先游。

第一个是贴热。用趣味选择题的方式让枯燥的签到变得有趣起来了。

第二个是游戏体验建议收集。其实通俗点就是产品体验反馈、帮助产品优化流程等,但是这里变成了领取任务,并且有相应的奖励,提升了用户参与感的同时满足了用户的归属感,因为奖励机制会让用户觉得自己的建议会有可能被采用,而不是反馈了就没有然后了。

五. 制造点声响

不同感官的刺激来增加产品印象及代入感

声音的提示可以起到未见其人先闻其声的效果。声音作为操作行为的一种反馈,提示用户的同时,增强代入感。比如微博国际版客户端,在发送状态时,小飞机飞出去的时候会伴随着:「嗖」的一声,让用户有一种发送成功的确定感。而Mac系统截图行为,则伴随着像裁切纸张一样的「咔嚓」声来提示截图成功,就非常的具有代入感。

最后,我会以我比较熟悉的游戏平台项目,简单总结一下各种置入趣味设计的方法:

可以尝试从文案的方向进行优化,比如将搜索游戏提示语:「未搜索到某某游戏」变成:「诶,你刚才可能输入了假游戏,不如再来一遍?」。

融入一些激励化的小游戏来增强玩家互动,提升用户品牌感知等。

设计与品牌风格统一的有趣反馈动画,或在适时置入声音作为彩蛋,增加整体的趣味氛围。

而不论是以上哪种手段,在使用之前都要认清,趣味设计都是设计上的一种锦上添花,增加趣味需要在满足产品功能的前提下进行,不必为了有趣而强行有趣。在设计的过程中也要多思考下是否可以做更多深入的细节优化,反复推敲,最适当的场景中融入细腻的情感化设计,让趣味成为我们设计的点睛之笔。

蓝蓝设计www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 

掌握这5个关键点,零基础也能建立信息架构

资深UI设计者

如果您想订阅本博客内容,每天自动发到您的邮箱中, 请点这里

什么是信息架构?怎么理解用户体验五要素?本文用大量的案例和插图帮你轻松掌握这个基础知识。

今天想要跟大家聊一聊关于 UX 和 IA 的话题。其实在写今天这次分享的题目的时候我修改了很多次,为什么会修改很多次?这要从我在 medium 看的一篇文章说起,这篇文章的标题是《6 Tips How to Apply Information Architecture in UX Design》,翻译过来的意思是在用户体验设计中如何建立信息架构的6点建议。

当时读完文章,虽然觉得文章里讲的一些散碎的概念迷迷糊糊可以理解,但这些概念就像盖房子的砖块一样,我完全不知道这些砖块该怎样才能盖成一栋大楼,或者我就站在楼下而因为自己视野有限完全不知道这栋大楼到底长什么样子,所以因为这个原因我一直苦恼于该如何去清晰的表达想要分享的内容,思来想去决定这次分享不能仅仅是我对某篇文章的翻译,想要弄清楚这篇文章到底在讲什么,先要弄明白文章里的知识,当我们了解清楚了这些信息之后再来理解这篇文章就会轻松容易得多,下面就将我总结出来的内容分享给大家。

一、UX & IA

UX 即 user experience,译为用户体验。

IA 即 information architecture,译为信息架构。

他们的关系可以简单理解为良好的信息架构是用户体验的基础。

我们平时听到了太多关于用户体验的东西,大家都以为用户体验就跟交互设计差不多。我之前确实也是这么理解的,但是最近发现我的这个想法是有些过于片面了。

我们可以把用户体验的工作分解成五个组成要素,分别为战略层、范围层、结构层、框架层、表现层。

它们都是自下而上起作用的,每一个层面都是根据它下面的那个层面来决定的,所以表现层由框架层来决定,框架层则建立在结构层的基础上,结构层的设计基于范围层,范围层是根据战略层来制定的。每一个层面的决定都会影响到它之上层面的可用选项,信息架构只是用户体验结构层的一部分而已。

二、什么是IA

IA 即 information architecture,解释出来就是合理的组织信息的展现形式。

主要任务是为信息与用户认知之间搭建一座畅通的桥梁,是信息直观表达的载体,通俗点说就是信息架构不仅仅是设计信息的组织结构,还需要研究信息的表达和传递。

这么说也许还有些抽象,举个简单易懂的例子:

我们来看这个商场的平面解析图,通过这个图我们可以很清楚的了解商场的结构,从而快速定位自己的位置还能顺利找到自己想要购买的产品。信息架构对于一款产品来说就相当于商场的平面解析图,就像现在我们看到的这幅图一样,商场的每一层都有相对应的分类区块来指导消费者。试想如果一个商场没有对商品进行有序的分类,那么我们在逛商场的时候就很难顺利挑选出自己所需要的商品,面对各种无序且数量繁多的商品我们一定会崩溃,这样的情况对于男士来说绝对是场灾难,但对于女性来说也许会是一个充满未知探索的挑选过程吧。

但不管怎么说在这里设计师需要做的就是规划好这些楼层信息层级,主要做的工作就是:分类、层级梳理等。简单的说就是规划好每一层有什么商品,同一层商品怎么分布等等信息。

所以在互联网产品设计中:设计师梳理信息架构,其实和刚才说的梳理商场楼层架构的概念是差不多的。

三、IA的作用

一个好的信息架构一定是会满足两个维度的需求,即用户需求和产品目标。

从用户的角度出发它可以让用户在一定的信息规划下更容易找到自己想要的「东西」。

从产品目标角度来看它能通过「信息架构设计」去教育、说服、通知用户。

所以用最简单的两个字来说其实信息架构就是在做分类。

再回到刚才那个例子想一想,把商场里的商品分类其实对于我们产品而言就是在给我们产品中的信息分类,以方便用户能更好的使用我们的产品,而不会想要把产品卸载,从而使产品达到易用好用想用的目的。就跟我们逛商场一样,当我们能够根据指示顺利买到自己所需的商品的时候我们就不会因为找不到我们想买的商品而失望的离开商场。

那么问题来了,我们该如何进行信息架构分类呢?也就是信息架构的分类方法是什么呢?

四、IA分类方法

这里给大家介绍2种方法,从「产品目标」出发我们可以采用「从上到下」的分类方法;从「内容和功能需求分析」出发就可以用「从下到上」的方法进行分类。下面来跟大家分享一下这两种方法的具体做法。

刚才说了从上到下是以产品目标即战略层出发的分类方法,所以最开始就是先从最广泛的、可能满足决策目标的内容与功能开始进行分类,然后再按逻辑细分出次级分类,这样的「主要分类」和「次级分类」就构成了「一个个空槽」,将想要的内容和功能按顺序一一填入即可。

我们以微信为例:首先根据产品目标将「主要分类」即一级架构分为「最近会话(微信)」、「通讯录」、「发现」和「我」;然后再进行「次级分类」分类,比如「发现」下再分「朋友圈」、「扫一扫」、「摇一摇」等等;最后将相应的功能(如朋友圈feeds、发朋友圈、朋友圈消息等)填入到相应的「朋友圈」分类中。

这样就像是先有了大概的框架我们再根据这些框架往上面加东西的感觉是一样的。

接下来我们再来说一说从下到上的方法:

刚才说了从下到上是由范围层驱动从产品的功能和内容层面出发的,所以我们就要先把已有的所有内容,放在层级分类中,然后再将他们分别归属到较高一级的类别。这种分类方法其实就是在做「归类」。

其实从下到上的信息架构方法也包括了主要分类和次级分类,但它是根据对内容和功能需求的分析而来的。先从已有的资料开始,我们把这些资料统统放到级别的分类中,然后再将它们分别归属到较高一级的类别,从而逐渐构建出能反应我们的产品目标和用户需求的结构。

具体工作中我们可以将所有的功能点用一张张卡片写下来,然后让目标用户参与到信息分类中,并反馈相关分类标准作为我们产品设计师去梳理信息架构的参考。实践过程中,更需要设计师或者产品经理本身有一定的信息筛选、梳理、分类的能力,进一步通过用户测试去检验分类的信息传达有效性。

其实就好像我们日常生活中收纳衣服,我们会根据不同标准去收纳,比如我们可以根据季节分类,也可以根据颜色分类,或者是根据款式分类,每个人都会有不同的分类习惯,所以这里归结到工作中才会让目标用户参与到信息分类中,毕竟我们的产品是服务于用户,所以还原用户使用习惯和使用心理也是我们同样要注意到的,这样可以给我们提供一些有效的分类信息帮助我们更好的做出清楚的信息架构。

当然这两种方法都有一定的局限,从上到下的架构方法有时可能导致内容的重要细节被忽略,而从下到上的方法则可能导致架构过于的反应了现有的内容,因此不能灵活地容纳未来内容的变动或增加,所以在实际运用中是需要我们将这两种方式结合起来灵活运用。

这两种方法虽然有不同的视角但其实最终目的都是让我们的产品易用好用最终达到想用的目的,所以让这两种方法对接、交汇、融合之后得出的结果才应该是我们理想中的产品信息架构。

五、影响IA的因素

刚才提到用户体验的5个层级是自下而上对其上面一层起作用的,信息架构位于用户体验要素第3层结构层,刚才说了结构层的设计基于范围层之上,所以这里遇到的影响因素我们还要返回到范围层面去寻找,范围层又包含两个维度,功能和内容,在从范围层到结构层这个过程中我们会遇到很多影响因素,所以把这些影响因素总结起来我们还是要从用户层面(内容)和产品层面(功能)两个维度来理解。

从用户的角度出发,理解能力、操作习惯、目标内容使用频率等等这些都会成为影响因素。

从产品角度来看,产品的核心价值、主线功能、特色功能等才是影响信息梳理的因素。

这两个层面当然也不是完全割裂的,在做信息架构的时候可以先从一个层面出发得出一个结论之后再用另外一个层面去验证得到的答案,然后再不断优化在验证过程中遇到的问题。

不同人会有不同的分类结果,因为根据不同情况我们所需要关注的侧重点会有不同,我们根据不同的影响因素会得出不同的答案。每个人都会得出不一样的分类结果,没有哪个结果是完全正确或者说是完全相同的,就像数学中的排列组合一样,内容越多我们得到的结果就会越丰富,但是这些结果当然不是全都合理的,所以就需要设计师根据自己的经验结合产品层和用户层的需求找到合理的解决方案。我们都知道在产品设计中想要设计出来一款完美不需要迭代优化的产品几乎是不可能的,所以我们能做的只能是结合各方面的影响因素和自己的经验理解一直优化产品让它接近于完美的状态。

现在我们来思考一个问题:为什么微信朋友圈这么高密度使用的功能要放到二级菜单呢?

微信的创始人张小龙是这样解释的:

  • 微信是个社交软件,核心功能是社交,是沟通,是好友,所以一级菜单只能跟这个相关。(产品功能层面)
  • 当朋友圈为二级tab 时,扫一扫,摇一摇,附近的人,漂流瓶,购物这些功能的曝光度就会下降,不利于微信功能的拓展。(产品功能层面)
  • 也许会造成各个模块分配不平衡,而且发现里的功能与其他模块的功能属性混在一起也许会不恰当,微信为了不让用户被过多的信息打扰把公共号打包放在一起,那么朋友圈随着联系人增多,分享动态也会增加,而且内容都是一些生活中的琐事,多少也会像公共号一样打扰到用户。(用户角度)
  • 设计并不是对用户有求必应,而是应该在产品发展战略的指导下平衡各功能。如果将朋友圈提升为一级入口,很明显微信的社交分享功能将得到强化,那么相应的其他功能将会被弱化,这与微信链接一切的发展战略是相违背的。(产品层面)

保持主干清晰,枝干适度。产品的主要功能架构是产品的骨骼,它应该尽量保持简单、明了,不可以轻易变更,让用户无所适从。次要功能丰富主干,不可以喧宾夺主,尽量隐藏起来,而不要放在一级页面。

举这个简单的小例子供大家了解信息架构这个概念,体会一下如何用一个更全面更发展的眼光去看待产品结构这个抽象的问题。

总结

要在 UX 中建立良好的 IA 我们需要特别注意的5个关键点:

  • 在建立信息架构之前确定产品目标(战略层)
  • 进行用户研究预测用户对产品可能产生的反应(范围层)
  • 合理运用认知心理学原理预测用户对产品可能产生的反应(结构层)
  • 根据产品信息结构去规划导航(框架层)
  • 注意视觉层次在内容的视觉表现中的重要作用(表现层)

所以我们绕了一大圈来看,在 UX 中建立良好的 IA 的5个关键点其实最后还是回归到了用户体验的5个要素。再回到刚开始分享提到的那句话,从上到下表现层是由框架层来决定,框架层建立在结构层基础之上,结构层基于范围层,范围层根据战略层制定。这里每一个层面都是根据它下面的那个层面来决定的,相当于把用户体验要素每一层需要做的事情从另一个维度又解释了一遍。

当然这里要注意一点,这些层级都不是完全割裂的,如果你要求每个层面的工作在下一个层面可以开始之前完成,那样一定会导致你和你的用户都不满意的结果,而相反的,应该规划好你的项目,让任何一个层面中的工作都不能在其下层面的工作完成之前结束。这里最重要的一条是,在我们知道基本形状之前,不能为房屋加上房顶。 不管我们是在这5个层级的哪一层,我们不能忘记的就是要把这些连成一个整体去理解,他们一定是相辅相成互相影响的。

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

关于页面打开的交互方式,这篇堪称最全面的总结!

资深UI设计者

如果您想订阅本博客内容,每天自动发到您的邮箱中, 请点这里

本篇文章分别从页面打开方式的类型、当前页打开&新开页面、弹出框三方面对页面链接打开方式进行了探讨,给大家提出一些意见以供参考。

页面打开方式作为链接产品路径的基础,在设计的过程中,或多或少都会遇到选择的困扰,尤其是产品功能复杂,层级较多时,如何让用户按照自己的意愿清晰的浏览信息,保持操作连贯性,是值得体验设计仔细思考与分析的。

近期在所负责的设计项目中,团队对链接操作的打开方式产生了分歧,借此机会整理了一些案例与资料,就这个问题进行分析探讨,也给遇到同样问题的同行一些参考意见。

一、页面打开方式的类型

网页中可操作的链接,主要有按钮、icon 以及文字链接,设计中常用的打开方式则主要有以下三种:

1. 当前页打开

点击操作链接后,在当前的浏览器页面中进行内容显示与操作。

2. 新开页面

点击操作链接后,在浏览器中新开一个独立的标签页面,进行内容显示与操作。

3. 弹出框

点击操作链接后,在当前的浏览器页面中,弹出一个小尺寸的对话框,进行内容显示与操作。

二、当前页打开 & 新开页面

首先来说说最具争议的新开页面&当前页打开。在 HTML语言中,target目标有「target=_blank」和「target=_self」两种属性,分别代表「新窗口打开」和「当前窗口打开」,下图是这两个参数的属性描述。

从这两个参数的属性上来看,「当前窗口打开」是系统默认的处理方式。这个打开方式在国外的网站中实现方式比较统一,用户也形成了一致的习惯,但国内的形式则不尽相同,以至于一直颇具争议,不同类型网站之间、同一网站不同场景之间也没有一个明确的规则标准可供大家学习和参照。

针对这个问题的讨论,可以听到两种不同的用户声音,并且都站在各自的角度阐述其道理。

举个例子,我们以同类型网站(淘宝和亚马逊)的打开处理方式进行对比,来看一下用户习惯、功能场景对链接打开方式选择的影响。

首先,我们确定一致的功能场景:用户从首页中根据各种筛选条件,查找到心仪的商品。来看一下两个网站的处理方式:

可以看出基本是两个极端,差异非常明显,再来看个有意思的现象,亚马逊中国的商品搜索方式竟然又和淘宝一致了,难道链接打开方式的差异竟是中外用户习惯的差异?

这确实占了很大一部分原因,那么造成这种差异的原因主要有:

  • 早期的 W3C标准不支持 target=”_blank”(HTML语言中,在新窗口中打开链接)的属性,国外互联网普及也比国内早,于是用户慢慢养成了习惯。
  • 默认当前页面打开让国外用户觉得更有「礼貌」。如果用户想新开页面,可以鼠标中键、按住ctrl点击链接或者右键新窗口打开,此时用户更有选择权,可以自己决定打开方式;如果默认新开页面,则让用户失去了选择权。
  • 早期国内互联网发展较为浮躁,网站想通过新标签页打开方式,提高PV。
  • 国内网络普及晚,部分用户尤其很多老年人不习惯甚至或许不知道,页中有个后退前进按钮、面包屑可用,新开页面便于他们的操作。

那么,淘宝中所有的页面打开方式都是新开吗?不是。像「我的收藏」、「已买到的商品」、「购物车」等功能页面就是当前页打开。

同一个产品内部,如此区别设计的原因我认为有:

  • 用户的目的较为明确,查找对象确定。(用户想要查看的对象是确定的,如购物车中的产品,用户有明确的目标,找到链接打开页面即可,不像搜索查找商品,需要一步步缩小范围甚至比对查看)
  • 链接入口常驻在网站的信息栏,用户可以随时切换,操作方便,且不存在重新输入的成本。

关于这两种打开方式,到底哪种操作更顺畅,确实难分高下,就跟「确定和取消哪个在左,哪个在右」是一种性质的问题,没有好坏之分,关键是要看在哪种场景下使用更合适。

新页面打开适用的场景:

  • 页面内容没有关联性,且从逻辑上没有从属关系,相对独立。如:产品中的外链。
  • 存在多页面「比较」的操作,需要经常切换。如:淘宝商品详情。
  • 需要保留住前一页的操作不丢失。如:知乎上过滤出来的结果列表。
  • 功能分支存在穿插,当路径发生交叉时,最好新开页面。如:产品内部的跳转链接,导致信息关联的层级发生改变。
  • 具有辅助功能的操作。如:使用文档(PDF、图片等)需要来回参照。

当前页打开适用的场景:

  • 流程性的功能页面,前后操作存在关联和影响。如:下单支付、按步骤新增。
  • 同一层级内容间的操作。如:tab栏的切换。
  • 同一路径中的操作,用户当前的操作会对主页的内容产生影响。如:编辑一个配置,用户操作完,会回到当前页查看结果。
  • 用户具有明确目的性的操作,当前页有利于锁定用户注意力。如:淘宝中「我的收藏」。

以上是结合功能场景进行的选择侧重,如果就「用户体验」一定要分出个高下,我个人还是比较支持默认「当前页打开」,从体验角度分析,「当前页打开」略胜一筹的主要原因有以下两个:

  • 尊重用户的决定。当前页打开,将更多选择机会留给用户(鼠标中键、按住ctrl点击链接或者可以右键新窗口打开),一个具有良好用户体验的产品,在用户做操作的时候,总是能让他们按自己的意志做出决定。网站对每个链接强制打开新页面则剥夺了用户的选择权,因为不同的人有不同的浏览习惯和使用需求。
  • 体验一致。保持一致体验的设计才能让用户产生信任感与安全感。当用户在操作界面元素的时候,可以顺畅的知道、理解,并且能预料到将会发生什么,不会被分神,也不会被打断。任何违反这个原则的设计都将会演变成一种「以设计方意志为导向」的设计,而不是「以用户为中心」的设计。

小结

当我们不知道两种方式如何选择时,或许「不强制用户」才是最好的体验。因为我们面临的用户多样,电脑操作熟悉程度多样,因此不同用户对于打开方式的习惯也具有多样性,这个是设计者无法揣测和调查清楚的。

在「两害取其轻」的情况下,在当前窗口打开链接,不失为一个选择,尊重用户自己的决定,让用户对交互界面自主可控。

三、弹出框

弹出框(弹层)又叫模态对话框,是指在用户想要对当前对话框以外的应用程序或内容进行操作时的提示方式。它一般覆盖在整体页面之上,避免了页面跳转。

弹出框通常是为了显示一个单独的内容,在不离开整体页面的情况下有一些互动,提供信息和交互。

如下图知乎中的「写想法」,用户可以快速的在弹出框中记录个人想法,记录发布后,很顺畅的回到之前的路径上继续操作,便捷,操作思路清晰。

△ https://www.zhihu.com/

现在很多产品中的新增、创建,也都会采用弹出框的交互方式,当然前提是在弹出框中编辑的内容不是很多,此时弹出框不仅承载了信息编辑的功能,还可以作为上下文的跳转,帮助用户衔接路径。

如 iconfont 中的新建项目,用户新增后,页面会直接跳转到新的项目空间。

△ http://www.iconfont.cn

弹出框适用的场景:

  • 内容简单,没有复杂的操作,且具有临时性。如:新增一个收货地址,进行简要的输入编辑。
  • 更为详细的辅助说明,是对当前内容的快速扩展。如:缩略图,点击放大查看。

因此,弹出框可以较好的实现上下内容层叠的感知,不打扰用户的主路径,同时作为页面承载元素和用户操作的补充,起到承前启后的作用。

总结

本文结合这三种链接打开方式的页面交互关系,进行适用场景举例,并总结每种方式的优缺点,方便在设计中更好的根据不同的场景选择合适的页面打开方式。

当然,以上总结也是基于我个人的理解与经验,没有统一的用法和标准,在具体设计实践中,仍要靠设计者的直觉和经验来进行综合考量与判断。

作为体验设计师,如何规划用户浏览路径,是个需要严肃对待的命题。没有绝对的好与坏,但一定要结合产品类型、场景、目标用户等进行具体问题具体分析。

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

总结页面打开的交互方式,很全面!

用心设计

如果您想订阅本博客内容,每天自动发到您的邮箱中, 请点这里

本篇文章分别从页面打开方式的类型、当前页打开&新开页面、弹出框三方面对页面链接打开方式进行了探讨,给大家提出一些意见以供参考。

页面打开方式作为链接产品路径的基础,在设计的过程中,或多或少都会遇到选择的困扰,尤其是产品功能复杂,层级较多时,如何让用户按照自己的意愿清晰的浏览信息,保持操作连贯性,是值得体验设计仔细思考与分析的。

近期在所负责的设计项目中,团队对链接操作的打开方式产生了分歧,借此机会整理了一些案例与资料,就这个问题进行分析探讨,也给遇到同样问题的同行一些参考意见。

一、页面打开方式的类型

网页中可操作的链接,主要有按钮、icon 以及文字链接,设计中常用的打开方式则主要有以下三种:

1. 当前页打开

点击操作链接后,在当前的浏览器页面中进行内容显示与操作。

2. 新开页面

点击操作链接后,在浏览器中新开一个独立的标签页面,进行内容显示与操作。

3. 弹出框

点击操作链接后,在当前的浏览器页面中,弹出一个小尺寸的对话框,进行内容显示与操作。

二、当前页打开 & 新开页面

首先来说说最具争议的新开页面&当前页打开。在 HTML语言中,target目标有「target=_blank」和「target=_self」两种属性,分别代表「新窗口打开」和「当前窗口打开」,下图是这两个参数的属性描述。

从这两个参数的属性上来看,「当前窗口打开」是系统默认的处理方式。这个打开方式在国外的网站中实现方式比较统一,用户也形成了一致的习惯,但国内的形式则不尽相同,以至于一直颇具争议,不同类型网站之间、同一网站不同场景之间也没有一个明确的规则标准可供大家学习和参照。

针对这个问题的讨论,可以听到两种不同的用户声音,并且都站在各自的角度阐述其道理。

举个例子,我们以同类型网站(淘宝和亚马逊)的打开处理方式进行对比,来看一下用户习惯、功能场景对链接打开方式选择的影响。

首先,我们确定一致的功能场景:用户从首页中根据各种筛选条件,查找到心仪的商品。来看一下两个网站的处理方式:

可以看出基本是两个极端,差异非常明显,再来看个有意思的现象,亚马逊中国的商品搜索方式竟然又和淘宝一致了,难道链接打开方式的差异竟是中外用户习惯的差异?

这确实占了很大一部分原因,那么造成这种差异的原因主要有:

  • 早期的 W3C标准不支持 target=”_blank”(HTML语言中,在新窗口中打开链接)的属性,国外互联网普及也比国内早,于是用户慢慢养成了习惯。
  • 默认当前页面打开让国外用户觉得更有「礼貌」。如果用户想新开页面,可以鼠标中键、按住ctrl点击链接或者右键新窗口打开,此时用户更有选择权,可以自己决定打开方式;如果默认新开页面,则让用户失去了选择权。
  • 早期国内互联网发展较为浮躁,网站想通过新标签页打开方式,提高PV。
  • 国内网络普及晚,部分用户尤其很多老年人不习惯甚至或许不知道,页中有个后退前进按钮、面包屑可用,新开页面便于他们的操作。

那么,淘宝中所有的页面打开方式都是新开吗?不是。像「我的收藏」、「已买到的商品」、「购物车」等功能页面就是当前页打开。

同一个产品内部,如此区别设计的原因我认为有:

  • 用户的目的较为明确,查找对象确定。(用户想要查看的对象是确定的,如购物车中的产品,用户有明确的目标,找到链接打开页面即可,不像搜索查找商品,需要一步步缩小范围甚至比对查看)
  • 链接入口常驻在网站的信息栏,用户可以随时切换,操作方便,且不存在重新输入的成本。

关于这两种打开方式,到底哪种操作更顺畅,确实难分高下,就跟「确定和取消哪个在左,哪个在右」是一种性质的问题,没有好坏之分,关键是要看在哪种场景下使用更合适。

新页面打开适用的场景:

  • 页面内容没有关联性,且从逻辑上没有从属关系,相对独立。如:产品中的外链。
  • 存在多页面「比较」的操作,需要经常切换。如:淘宝商品详情。
  • 需要保留住前一页的操作不丢失。如:知乎上过滤出来的结果列表。
  • 功能分支存在穿插,当路径发生交叉时,最好新开页面。如:产品内部的跳转链接,导致信息关联的层级发生改变。
  • 具有辅助功能的操作。如:使用文档(PDF、图片等)需要来回参照。

当前页打开适用的场景:

  • 流程性的功能页面,前后操作存在关联和影响。如:下单支付、按步骤新增。
  • 同一层级内容间的操作。如:tab栏的切换。
  • 同一路径中的操作,用户当前的操作会对主页的内容产生影响。如:编辑一个配置,用户操作完,会回到当前页查看结果。
  • 用户具有明确目的性的操作,当前页有利于锁定用户注意力。如:淘宝中「我的收藏」。

以上是结合功能场景进行的选择侧重,如果就「用户体验」一定要分出个高下,我个人还是比较支持默认「当前页打开」,从体验角度分析,「当前页打开」略胜一筹的主要原因有以下两个:

  • 尊重用户的决定。当前页打开,将更多选择机会留给用户(鼠标中键、按住ctrl点击链接或者可以右键新窗口打开),一个具有良好用户体验的产品,在用户做操作的时候,总是能让他们按自己的意志做出决定。网站对每个链接强制打开新页面则剥夺了用户的选择权,因为不同的人有不同的浏览习惯和使用需求。
  • 体验一致。保持一致体验的设计才能让用户产生信任感与安全感。当用户在操作界面元素的时候,可以顺畅的知道、理解,并且能预料到将会发生什么,不会被分神,也不会被打断。任何违反这个原则的设计都将会演变成一种「以设计方意志为导向」的设计,而不是「以用户为中心」的设计。

小结

当我们不知道两种方式如何选择时,或许「不强制用户」才是最好的体验。因为我们面临的用户多样,电脑操作熟悉程度多样,因此不同用户对于打开方式的习惯也具有多样性,这个是设计者无法揣测和调查清楚的。

在「两害取其轻」的情况下,在当前窗口打开链接,不失为一个选择,尊重用户自己的决定,让用户对交互界面自主可控。

三、弹出框

弹出框(弹层)又叫模态对话框,是指在用户想要对当前对话框以外的应用程序或内容进行操作时的提示方式。它一般覆盖在整体页面之上,避免了页面跳转。

弹出框通常是为了显示一个单独的内容,在不离开整体页面的情况下有一些互动,提供信息和交互。

如下图知乎中的「写想法」,用户可以快速的在弹出框中记录个人想法,记录发布后,很顺畅的回到之前的路径上继续操作,便捷,操作思路清晰。

△ https://www.zhihu.com/

现在很多产品中的新增、创建,也都会采用弹出框的交互方式,当然前提是在弹出框中编辑的内容不是很多,此时弹出框不仅承载了信息编辑的功能,还可以作为上下文的跳转,帮助用户衔接路径。

如 iconfont 中的新建项目,用户新增后,页面会直接跳转到新的项目空间。

△ http://www.iconfont.cn

弹出框适用的场景:

  • 内容简单,没有复杂的操作,且具有临时性。如:新增一个收货地址,进行简要的输入编辑。
  • 更为详细的辅助说明,是对当前内容的快速扩展。如:缩略图,点击放大查看。

因此,弹出框可以较好的实现上下内容层叠的感知,不打扰用户的主路径,同时作为页面承载元素和用户操作的补充,起到承前启后的作用。

总结

本文结合这三种链接打开方式的页面交互关系,进行适用场景举例,并总结每种方式的优缺点,方便在设计中更好的根据不同的场景选择合适的页面打开方式。

当然,以上总结也是基于我个人的理解与经验,没有统一的用法和标准,在具体设计实践中,仍要靠设计者的直觉和经验来进行综合考量与判断。

作为体验设计师,如何规划用户浏览路径,是个需要严肃对待的命题。没有绝对的好与坏,但一定要结合产品类型、场景、目标用户等进行具体问题具体分析。

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

论打造用户体验和数值系统,你得看看游戏类产品

用心设计

如果您想订阅本博客内容,每天自动发到您的邮箱中, 请点这里


互联网产品有很多种,比如电商类、工具类、资讯类、财经类。但在看过很多产品之后,作者发现论产品体验,最强的是游戏类。当然游戏做为一种特殊的产品,有时候不会被列入以上类型,且游戏的产品经理一般被叫做游戏策划以及数值策划,分别负责不同的内容。

一、为什么说游戏的产品体验很好?

之所以这样说是因为游戏类产品有一个特点即它是没有用的,或者说它的唯一用途就是好玩。这样有一个问题便显而易见了,即对于大多数产品来说用户体验好是锦上添花的事情,而对于游戏类产品而言,这可能是唯一的卖点以及生死线。

举几个例子来说明:

  • 单位或者学校的官网,相信用过这些的人都会发现它们是多么的难用,而且很多年从不更新,但是你没有得选,只好使用它;
  • 微信以及 QQ 也是同理,虽然不是必选,但是以其覆盖率来讲,大多数人依然无法选择不使用它们。因此微信有足够的理由不全力以赴,腾讯完全可以将精力和人力投入到更加赚钱的网游领域。当然,最近新型社交软件(抖音、快手)的崛起似乎是给了腾讯一定的威胁,让它不得不再次严阵以待;
  • 而抖音和快手就得好好做了,必须足够好玩以及新奇,毕竟这并不是刚需,如果没有足够好的用户体验完全可能被删除。毕竟删除了他们对于用户而言几乎没有任何不便,还能节省不少时间;
  • 那么再进一步呢,再进一步就到了游戏类产品。游戏类产品的刚需性更加弱,而且还被全社会妖魔化,最近 steam 入华不利,以及孩子跳楼怪绝地求生又将它推向了风口浪尖。让不少人不得不呼吁「管管孩子,救救游戏」。

通过上面几个例子不难看出,随着刚需的减弱以及依赖性的降低,产品对于用户而言不可替代性就越低。比如单位或者学校的官网哪怕做成非图形界面,恐怕员工和学生都得自学了接着用。而游戏则不然,不仅面临着用户随时可以放弃的情形还得时刻注意政策动向。

因此即使不去使用产品,我们也不难猜出游戏类产品的用户体验必须非常好才行。毕竟只有有依靠的产品才能够做到有恃无恐,而游戏类产品则是时刻在刀尖上舞蹈,用户和政策都不敢得罪,必然得绞尽脑汁才能生存下去。

人都是有惰性的,一旦有恃无恐将没有多少人和公司愿意继续创新,毕竟你没得选。

二、以崩坏3为例谈谈用户体验

1. 从侧面展示其用户满意度

为何选崩坏3呢?原因很简单,因为它的推广模式以及用户体验都是一流的,不仅做游戏,而且 CG,漫画,周边同步推进。选择了3D萌风格后又通过哔哩哔哩这一平台进行了推广,对用户的了解之深入让人佩服。

b站的推广对于崩坏3而言,绝对是最好的选择可能都没有之一。原因很简单,两者用户重叠度太高了,且 b站专门有崩坏3类似的模块MMD 3D。当崩坏3到达b站后,up主们则自发的开始了宣传,例如热门中的第四位就是崩坏3的内容。

如果搜索崩坏3的经典角色 CG女王降临,可以得到如下结果:

仅前面几个视频的播放量可能就有近300w,而且是精准用户的300w次播放,其宣传的成功不难理解。当然这里你可能要问了,不是谈用户体验嘛,说这些和用户体验有什么关系。

其实是有关的,通过下面这张图很容易从侧面反映出用户对其热爱的程度。

这些视频全都是用户自制的,这种热爱是很切实的。试想当初最火的魔兽世界上映,很多人穿着联盟或者部落的衣服去电影院不就是对游戏最大的认同吗。

这里也是一样,你会为一个你不喜欢,用户体验差到崩溃的产品花费几天甚至一个月的时间去做它的周边视频吗,所以其优秀其实是毋庸置疑的。

2. 分析其用户体验

这张图片即该游戏的欢迎界面,接下来让我们细细来分析其用户体验点好在哪里。

上图即为游戏界面展示,仅一个界面就有很多点设计来增强用户体验。

  • 感叹号:代表了可以领取的奖励,大家领取奖励的时候是开心的,所以就给了最醒目的标志;
  • 波纹效果:次一级的提示,表示该功能下有可以做的事情,算是任务发布;
  • 收起功能:点击可以收起,然后截一张图,截图如上上图所示,很完美的效果,用户有炫耀的心理,所以可能会将其发朋友圈或者作为桌面,增强传播。当然这里不玩游戏的人可能不好理解,其实有的角色是非常难获得的,加上皮肤价格会很高,用户有足够的动力去炫耀;
  • 拍照功能:如上上图所示,可以对图像进行拍照,虽然也可以截屏,但确实是很贴心的功能;
  • 和看板娘对话:这样的做法并不少见,即给产品一个人设,增加用户的认同感,比如小冰等,这里的看板娘对话根据角色的不同而不同,甚至有的用户会为了看不同人物的对话而去收集人物,在增强用户体验的同时也增加了用户购买欲,一举两得;
  • 全屏VR:画面并不是静止的,如果手机旋转,图像会移动,给人手机屏幕后的场景是真实场景的感觉,虽然幅度不是很大,但还是有一定的 VR感的。

当然其优秀的用户体验点完全不止这些,作为一个体积3G多的程序有许许多多的界面,但介于游戏和产品的逻辑还是有区别的,就不展开继续讲了。但有一点是值得注意的,即整个游戏的任何界面几乎都是在用心去做,将用户体验做到了。

三、以崩坏3为例谈谈数值系统

数值系统顾名思义就是一个产品的数值设计,比如:得多少积分用户可以升级,在搞活动的时候是否应该赠送 VIP,如果赠送了 VIP 多久比较好,VIP 应该有哪些权限,如果各种等级的 VIP 功能是不同的,那么一个级别应该差多少。

以上仅仅是产品的数值体系,而游戏的数值体系就更复杂了,比如:游戏货币的产出量以及回收机制,维持整个游戏世界的装备价值以及金币价值,防止产生通货膨胀。

产品和游戏有这样的区别很正常,毕竟产品只是提供一种服务,而游戏更像是打造一个世界,要考虑的东西在一定程度上和现实世界有相似之处,比如:交易方式、税收、货币体系、资源体系、玩家社群、不同势力的实力均衡。

现在让我们来简单分析,当然我们只分析在产品中也存在的数值体系,毕竟相信本文的读者都是产品人而不是游戏迷。

1. 崩坏的VIP体系

VIP体系对于企业而言是非常重要的,因为这是企业收入最主要的来源之一。

所以诱导充值是所有企业都必须面临的问题,那么大多数产品有哪些套路呢,一般有以下三个常见方式:

  • 首冲优惠:第一次充值会比较便宜,降低用户付费门槛,而当用户真的使用过 VIP 之后,再回到非VIP 就比较难了,可能将一个本来不想充值的用户转化为 VIP用户,即由奢入俭难;
  • 连续包月:不少用户懒于去取消掉这个功能,对于那些对价格不敏感且摇摆不定的用户而言,让他们通过连续包月进行消费是不错的策略;
  • 活动赠送:完成一定的任务,赠送VIP,理由和首冲优惠很相似,都是降低用户进入门槛。

现在让我们再来看看崩坏3是如何设计其 VIP体系的。

初始奖励非常丰厚:让用户忍不住想要充值,如上图所示,只需要充值非常少的钱,就可以获取以上奖励,而这些奖励非常不错。这点最大的意义在于让用户愿意去尝试充值,只要充值一次,以后就有可能继续消费。

限时购买:促销虽然老套,但却十分有用,这种倒计时总能够刺激用户的消费欲望。

月卡系统:很有意思的系统,充值一次之后可以每天都领取奖励,而效果是直接购买奖励的十倍。但只有每天不断的进行领取才能够达到获得奖励的目的。这种模式其实就是用日活换金币,虽然用户节省了钱但却必须每日登录才能够获取这些金币。

类似的策略拼团也有使用,不过不是用日活换金币而是用用户换金币。

2. 数值系统

数值系统对于游戏而言是生命所在,史玉柱曾说过:我不担心别人抄走我的系统,因为数值体系他们抄不走。

崩坏3的数值系统就不提了,因为太过复杂,而且与产品相关性也不是很大。

对于产品而言,数值系统没有那么意义重大,但也需要很好平衡各方的利益,否则可能让产品迅速衰落。

一个简单的例子即会员该有多少权利,不同等级的会员权利应该如何区分。比如以视频网站为例,假设有两种级别的会员,大会员和小会员。那么用户就有三种,免费用户,小会员以及大会员。假设会员的作用是看高清视频,而视频的级别有五个,等级越高质量越好。

那么该如何设置他们的权限呢,可能的方式有以下几种:

  • 方式一:普通用户等级一,小会员等级二,大会员等级三;
  • 方式二:普通用户等级一,小会员等级三,大会员等级四;
  • 方式三:普通用户等级一,小会员等级四,大会员等级五;
  • 方式四:普通用户等级二,小会员等级三,大会员等级四;
  • 方式五:普通用户等级二,小会员等级四,大会员等级五;
  • 方式六:普通用户等级三,小会员等级四,大会员等级五。

当然一般的 VIP 肯定不止有视频权限,还会附带一些其他权限,比如可以有打赏用的币,可以有更好看的头像框,文字的颜色是可以选的等等。

不难发现,这将是非常复杂的一个体系,哪种体系都对一些用户有利,对另外一些用户不利,如何合适的定制产品的数值系统就是一个很复杂的问题。如果体系偏向免费用户,可能让付费用户付费意愿降低,如果偏向付费用户,可能让免费用户觉得没有存在感,直接离开。

四、游戏给产品的启示

用心做产品是有用的:如今流量获取非常困难,产品的成功很大程度上取决于是否有流量扶持。这对于产品人而言是比较沮丧的现状,毕竟辛辛苦苦做一个产品结果比不上某些巨头产品的一个入口有效。这种情况确实是存在的,但我们也要相信产品的优秀绝对不是没有意义的;

可以用日活换收益:现在的产品VIP系统大多都是充值后获得权限,但完全可以做以下这样一个策略。比如:视频网站的 VIP 是一个月15元,那么我们可以推出一个套餐,一个月只要5元,但是这个套餐有个条件是每天登录后第二天可以享受 VIP服务,如果用户有一天未登录,那么第二天就没有 VIP服务可以享受,这种策略其实就是用10元钱换取了一个用户的每日登录;

精准营销事半功倍:崩坏3在 b站的广告效果非常好,而且直接引起了 up主的关注,他们会再次创作内容对崩坏3进行推广。但如果将这个广告投到58同城呢,可能就没有什么意义了;

数值系统平衡各方:免费用户和付费用户的关系非常复杂,两者既有利益冲突又可能相互转化,因此做好平衡非常重要,不要得罪任何一方。




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

超好用的用户体验提升模型

用心设计

如果您想订阅本博客内容,每天自动发到您的邮箱中, 请点这里


用户体验一直是我们在产品设计中反复强调的问题,那么我们应该怎样提升用户体验呢?

经过项目中不断的探索与研究,结合几个方法论,我们整合出了一套用户体验提升的方法流程——用户体验提升模型。下面就来详细的介绍一下,希望能给大家帮助和启发。

先问几个问题?

  • 你知道你所负责的产品/设计方案的用户体验好还是不好?
  • 产品/设计方案体验不好时应该怎么做?
  • 这个产品/设计方案的体验具体有哪些问题?
  • 怎么优化出现的体验问题?
  • 哪些模块或页面的问题最迫切需要解决?先优化哪些?后优化哪些?

用户体验提升模型能很好的帮我们解决以上问题。

先介绍一下用户体验提升模型的流程:线上版本调研 – 协作启发式评估 – 问题分析整理 – 优化方案。

这篇文章也会以这个流程一一介绍。

一、线上版本调研

也可以是设计方案,我们采用了 SUS系统可用性量表进行调研,SUS 是评估产品可用性的一个花费少,但十分有效的工具。该量表包含了10条定向问题,每个问题均为5分,按强烈反对(1分)到非常同意(5分)评分。(各位小伙伴可自行网上查询系统可用性量表,有很详细的介绍,在这里不赘述了。)

最佳的方式是在线上直接上一个问卷调研来收集真实用户的反馈,然后对收集到的结果做如下算法:

  • 对于奇数序号的问题,将其得分减1;
  • 对于偶数序号的问题,将其得分被5减去;
  • 将所有问题的减法后得分加在一起,然后乘以2.5;
  • 计算出的结果即为我们产品可用性的得分。

1. 那么如何通过评分看出一个产品的好坏?

上图是一个评分参考,通过数据得出,系统可用性量表最终算出的评分达到70分左右,就可以比市面上一半产品可用性要好,也就是说这个产品的用户体验算是合格了。

但是系统可用性量表的评分结果是抽象的,这个分数只能让我们大概了解产品用户体验的好坏,在具体问题上却是缺失的,那我们知道产品评分较低时我们如何聚焦产品的优化方向呢?

二、协作启发式评估

1. 为什么是协作启发式评估而不是启发式评估?

因为启发式评估主要由几名交互专家以角色扮演的方式来完成设置的任务给出评估结果。优点是成本低、快捷,缺点也显而易见,一是交互专家团队中不一定有或者很少,二是可用性问题意见一致率很低,并不能很明确的指出为什么这是一个体验问题,有很多个人因素的主观见解。

因此我们决定用协作的形式来进行评估,而且不需要交互专家,可以是用户、测试、设计、产品、运营、商务等等,只要愿意参与测试,就可以。协作启发式评估以小组为单位,能够很好的整合出更多的问题,而且更准确。你说他们也不是交互专家,能起到好的结果吗?竟然都整理出方法了,那答案当然是能啊。

为什么能,因为整个评估过程中,我们是有的可用性原则来给予启发的,有了这套可用性原则,一秒变专家。

说到可用性原则,了解用户体验的都知道尼尔森的十大可用性原则,但是从1995年提出到现在,已经过去了二十多年,互联网世界已经发生了巨大的变化。在这样的情况下,尼尔森的十大可用性原则明显有些不那么符合或者说不能给出针对现今产品太全面的启发,所以,我们重新整理了一套可用性原则,这套可用性原则更针对现今互联网产品,基本可以覆盖到所有出现的用户体验问题。

我们称之为21条可用性原则。

有了这21条,可以让任何没有用户体验知识的人参与到协作启发式评估中来了,一秒变专家了。当然,这21条可用性原则我们也会迭代优化,目的是做到更符合现今产品、更全面的可用性原则。

2. 通过什么来确定的这21条可用性原则?

首先,我们都知道用户体验五要素,这已经是做产品设计的基本常识了。我们来看这五个层级对用户体验能产生影响的有哪些?战略层一定不会,如果一个产品立项了、已经上线了,一定是战略层成立了,如果战略层出现了问题那就要重新考虑产品要不要做或者是改变方向了。那么剩下的4个层级呢?范围层、结构层、框架层、表现层,其实都会出现用户体验的问题。那我们看看这几个层级所包含的内容,视觉呈现、界面设计、导航设计、信息设计、交互设计、信息架构、功能规格、内容需求,这样的话就有8个大类,然后我们通过多年的经验和对尼尔森可用性原则的理解,把可用性原则对应到这8个大类中,最后得到了这分类明确的21条可用性原则。

但是分了这8个类有什么用呢?读下去,你就会知道。

3. 具体方法

先说说调研的具体方法。我们以协作启发式评估的方法,组织好调研小组(8人以上,样本越多越好,反正最后还要去重),宣讲完流程方法和操作任务,就可以开始进行评估了。我们一般为了省时间,宣讲完就把表格发下去,让他们自己找时间完成表格,然后再收回来。

这个表格就是用户体验问题记录表。包括问题所在位置、对应的21条可用性原则、严重程度等级、问题描述。

三、问题分析整理

1. 收集了一堆问题之后应该怎么做呢?

通过小组会议讨论,把相同、相近的问题统一成一个,可优化的问题保留下来,不是体验问题的去掉,然后整理到一起,这就是整个产品存在的大大小小、各种各样的问题了。

接下来,我们引入另一个方法,就是用户体验八阵图。

这张用户体验八阵图的8个点是不是有些眼熟?没错,就是21条可用性原则里的8大分类,这就是上文为什么分为8个类的原因。中心向外为问题严重等级,依次为:小问题(1)、次要问题(2)、主要问题(3)、灾难性问题(4),一一应对到「用户体验问题记录表」中的「问题严重等级」。

2. 怎么使用呢?

首先,对记录表里的「问题位置」进行归类,以模块化区分,比如把登录注册流程做为一个模块,用一张八阵图来表示,最终把产品的每个模块都用一张八阵图来承载所对应的体验问题。

然后,把收集到的问题以「点」的形式点到对应模块的八阵图当中。

哪个模块问题最多?问题出现在哪个方向上?是视觉?还是交互?还是内容?哪些问题很严重需要迫切解决?一目了然。

四、优化方案

  • 通过 SUS系统可用性量表知道了产品的整体体验处于什么水平。
  • 通过协作启发式评估知道了产品的用户体验到底有哪些问题。
  • 通过21条可用性原则知道了如何避免出现体验问题。
  • 通过用户体验八阵图知道了哪些模块最迫切需要优化。

知道了这些,我们进行产品优化的时候还会不知道如何下手吗?接下来就要靠你自己了,你一定会做的更好。

当然,这套模型只能对线上产品的用户体验提升起到一定帮助,一个产品真的厉害还要从战略层一步步做起,我们需要去清楚的知道产品的目标是什么,我们能提供什么,我们想要去得到什么。对于产品的迭代,我们可以从使用人群(目标客户),主要功能(产品的服务方向),产品特色(与竞品的差异化),商业价值(盈利模式)上深入研究。



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

日历

链接

个人资料

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

存档