说三道四技术文摘-感悟人生的经典句子
说三道四 > 文档快照

移动设计需摒弃的几大PC应用设计方法

HTML文档下载 WORD文档下载 PDF文档下载
移动设备与PC各自具有不同特征,设计移动应用时,照搬PC上应用设计方法,往往会带来糟糕的移动用户体验。如何结合移动设备本身特征,进行移动设计?有哪些PC应用设计思路应该避免?本文将给出答案。

伴随着移动大潮的到来,移动优先设计理念已深入人心。鉴于移动设备的特殊性,PC应用的设计思路往往不适于移动设计,但很多设计者不思变通,照搬PC应用的设计方法,造成所设计产品存在很多缺陷。Luke Wroblewski在《An Insider’s View of Mobile-First Design: Don’t Make These Mistakes》一文中指出了移动优先设计需要避免的几大错误,并分别结合实例给出了解决方案。

无论是用户、企业家,还是广告商,都喜欢涉足“移动”这个领域,因为移动产品时刻陪伴着我们,并可随时访问。但这一机会同时也面临着设计所带来的诸多限制:移动产品屏幕小,且通过触控来控制,所连接的网络参差不齐。鉴于此,Facebook、Google、PayPal及无数迅速投身于移动优先设计的创业公司也都意识到针对移动产品进行设计并不同于桌面PC。

针对桌面PC的设计思路往往不适于移动设计,但这些思想因根深蒂固而被随意使用。这正是本文分享移动设计中常见错误的主要原因。设计者、产品经理及企业家不仅要了解如何针对移动进行设计,同时也要以不同的思路来考虑移动设计。

在移动上,有时必须假装“请求事件已完成”

移动网络较互联网慢很多,这毫无疑问。没有什么比超长的登录时间更让用户灰心的了。Instagram的联合创始人Mike Krieger曾表示:“谁希望在等待的过程中继续等待呢?”

然而用户在移动应用上提交请求后时,往往需要继续等待。典型的PC处理过程是这样的:

● 用户在应用中提交某一请求;

● 应用向服务器发送信息,告诉服务器发生了什么;

● 服务器作出回应,并处理请求;

● 应用进行更新,以告知用户,他们的动作已成功完成。

……这是一个漫长的等待过程。

将之与Instagram移动应用的处理过程相对比:当用户喜欢或评论Instagram中的图片时,其结果会立刻显示出来。事实上,他们的请求仍在后台的处理过程中——但Instagram假设它已经成功,而避免了继续等待它返回实际的执行结果。 


设计者虽然无法加快网络速度,但可以给用户一种感觉,让他们感觉响应速度很快。

Instagram技术帮助我们解决了移动应用“Polar”中的早期错误。Polar允许用户收集、分享、投票某一调查。当用户在Polar上创建一个调查,上传其中的任何图片平均需要12秒。

在首个版本中,Polar会等到所在图片上传到服务器后,才会将整个调查展示出来。而在现在的版本中,我们选择了相反的做法:我们假设用户的所有调查都可成功创建于服务器上。只要他们创建了新的调查,就会马上显示在他们的Feed中。

实际上,我们在本地创建了临时的调查副本,并将它添加到前台列表中。该调查的临时版本完全可以正常使用:用户可对它进行投票与评论,我们确保一旦该调查在后台创建成功,这些动作可应用于此调查上。(为了确保该调查能成功创建,我们使用了很多后台处理程序,以保证它可存放于本地。在最后告诉用户发生错误之前,会多次向服务器发送请求。)

似乎增加了很多额外工作?确实。可以让应用看起来更及时,这还是很值得做的。这种情况下,快速的感觉可以掩盖掉现实中速度较慢的移动网络所带来的缺陷。

在移动应用中,显示加载过程往往更遭

很显然,速度代表着移动用户体验。因为移动网络作出响应往往需要一段时间,当加载、处理某事件时,移动应用往往会显示一个进度条或旋转指针(Spinner)。该做法似乎昭示着我们应该告诉用户,该事件需要花费一点时间。

这些指示器背后的动机很好,但对于用户来说,结果却很糟糕。为什么呢?因为这些过程指示器好像突出了用户需要等待这一现实。这正如盯着表、电梯按钮面板看,反而感觉时间过得更慢了。

具有讽刺意味的是,大部分指示器使用户专注于指示器本身——而非实际过程。情况应该反过来,让用户可清晰地感觉他们正向目标前进,而非只是在那里等待。

为此,当我们在Polar上使用“Web View”加载部分本地应用界面时,我们付出了很大的代价。(Web View犹如一个小小的内嵌Web浏览器,可以从服务器端获得页面,只有当所有页面加载完之后,才会显示在应用中。)为了让用户知道这些元素正被下载,我们增加了旋转指针以表示Web View正在服务器中检索(在一个应用中,我们使用了多个Web View)。但我们却得到了这样的反馈:“刷新、加载页面好像需要大量的等待时间;它似乎没有之前版本快速了。”

这么做,使用户更专注于该指示器,而非过程。

Google的Search应用注意到了这个问题,它将用户请求的页面从一侧滑动显示。该设计将加载指示器作为请求页面加载过程的一部分,从而让用户更加关注过程,给用户一种内容即将呈现的感觉。


让用户专注于过程的另一个方法是使用“轮廓屏”——先展示页面的空白版本,再逐渐地加载其中的内容。信息逐渐显示在页面中,会给用户一种所请求内容即刻可完成的感觉。


我们已经在应用的多个地方使用了该技术,删掉了旋转指针。这使得用户的注意力转移到内容加载的过程,而不是内容加载这个事实。

不要转移用户的注意力

在桌面中,会增加更多的链接、菜单和按钮,以方便用户与应用交互。但在移动应用中,我们需要重新考虑该方法。可显示大量用户界面控件、用户通过鼠标来操作的大屏时代已经过去。现在的移动设备屏幕很小,只有巴掌大小,却需要使用相对较大的手指进行输入。

我们不能仅仅考虑如何在小屏幕中增加更多的控制,现在,我们还必须考虑把这些动作放在哪里——用户在应用中花费最多流量的地方。

移动设计者应该将主要精力花费在用户的主要目标上,而不要让用户的注意力从主要任务上转移。

用户给调查投票是我们应用的核心功能,用户在投票页面停留的时间最长(平均每人每天会为40个调查投票。)我们知道,如果列表中的调查来自用户认识的人,该应用的体验将会更好。所以我们在应用的头部放置了明显的按钮,让用户可方便地找到Polar上的好友。

但结果却是很少有人使用该功能。后来发现,我们将用户的注意力转移到了其他地方,如寻找、邀请好友。

现在,当用户沉浸于投票过程时,在第20个调查处,我们会询问“你是否想在Polar中寻找你的好友?”该改变(删掉了头部的寻找好友按钮)使寻找好友的功能获得了很大关注。


从那时起,我们又利用该法设计了很多其他功能,包括设置喜好、请求评价应用等。将主要功能(为调查投票为Polar的主要功能)作为应用的主要部分,而不是很多功能中的一组,将会产生很大的不同。

总结

进行移动体验设计时,应避免使用在PC上进行应用设计时惯用的方法:

● 等待服务器回应,而不是假设请求已完成,将会成功;

● 当事件回应需要一段时间,专注于指示器,而非过程;

● 增加更多的界面控件,代替突出应用的主要功能。

为了避免这些及其他移动错误,我们需要用挑剔的眼光审视现有的最好实践,不要将PC世界完全照搬入移动领域,只采用适合移动的方法。

不只是避免错误,移动优先更要探索、分享、拥抱新的设计方法。(编译:陈秋歌 审校:夏梦竹)

原文链接: An Insider’s View of Mobile-First Design: Don’t Make These Mistakes

IDG李丰:在中国,创业公司最好是一个One Man Company Google Drive新增“保存到Drive”按钮功能 可自行添加 腾讯CDC创始人唐沐加盟小米 总经理陈妍接任 老板我想辞职:因为小米100万元征集一张壁纸 移动周报:GitHub上最火的Android开源项目 免费才是王道:盘点开发者须知的25个免费数据可视化工具 Pivotal获通用电气1.05亿美元支持 或将改变大数据和物联网的游戏规则 大掌门与阿里云和解:云生态系统呼之欲出 刘有涛:恩信科技云计算大潮中扬帆起航 Cloudera释放Impala 1.0:与Hadoop完全整合,各方面完爆Hive 云通讯平台:让你的应用会说话 触宝用户过亿,CEO王佳梁常说的词是“创新” 全国电脑健康日启动 360搭建电脑维修开放平台 C语言实现归并排序 360石晓虹:针对移动Apps的DDoS攻击将成重大威胁 更社交化:谷歌将推出Google Play平台服务 C语言对磁盘文件进行快速排序 传Google已关闭短信搜索服务 PayPal首席安全官:靠密码验证身份即将寿终正寝 DRM你又赢了:其API纳入HTML5标准 豌豆荚王俊煜:洗白白其实是一个计划外的产物 抢Google等巨头生意,纽约大学小伙挖掘并出售自己数据 noBackend:前端优先的开发模式 C、CPP const 详解 三星5G技术获得突破性进展 未来传输速度可达10Gbps 5月14日:1984年美国社交网站Facebook创办人Mark Zuckerberg出生 Chartkick:一行代码即可绘制出漂亮的图表 用友UAP将打造开放平台 建应用商店销售企业级应用 共享软件营销:如何将你的产品推向海外 谷歌使用Debian Linux作为GCE的默认操作系统 大数据?别唬人了!我们真的需要盲目烧钱追求大数据吗? 那位大虾帮我看一下这断代码(JSP高分请教) 帮帮忙啦,哪位同志用过mscomm控件做点对点拨号通讯的 AspRunner是个不错的辅助编写ASP页面的工具,请问哪里有破解下载的啊?谢谢了! 在vc#中如何删除目录下的所有文件? 急 关于分级菜单 求救,如何在注册表中得到一个硬件设备(如猫)的驱动文件名称? 一个难题,希望高手能解决,急切等待! 关于网络状况测试的问题 新手上路,问一个很初级的问题,呵呵。。。 请问如何实现在同一个窗口中的自动跳转? 为什么不能调用类? 关于SQL语句求助 如何在asp和asp.net里面共享信息 溢出错误,麻烦来看看! 知道汉字的国标(gb?)码值,如何显示汉子,急求救!!!! 在SQL2000怎样建立全文索 Cannot start SQL Server Agent 能用case when 举一个例子吗?如果工资>1000 职务='处长',如果工资<1000 职务='科员' 如何将从xml文件中读取的文本在网页上保持格式的显示? sql语句求助!1 有宁波考高程的吗?有参加班的吗? 水晶报表问题???高手请进!!!!!! 使用openquery建立视图。急!急!急!急!急!急! 小问提 交个朋友 Blob类型的字段为什么不能做为Lookup或Calculated字段 有谁知道Any to Icon 的 注册码 怎么实现不同文件中的变量互访? ICS 的FTP控件问题:怎样建目录,我这样做不出错,但是就是建不出来: 数据库出错 怎样将weblogic7和MS sql 2000连接起来? sql语句求助! 关于文件关联的问题,不是那么简单的哦.!!!!!! 一个MM每天回家后做的事 [贴图] 我需要得到记录集中的一条记录 关于MODEN的问题 如何编写Delphi的DLL为C++Buider调用? 我将数据库连接作为一个bean封装,怎么样在sevlet中引用它? 源文件,修改?? 我该怎么做? IIS为什么不能解析中文? Exchange怪问题,求救求救...... 请问VB写的ActiveX DLL,其中的函数如何声明为导出函数?在线等待!! 寻求组件上传多图片源代码 很菜的问题!各位帮帮忙啊!在线等。。 请推荐一本软件工程的书。 我的计算机一接通电源就开机,在98系统中关机显示屏熄灭后风扇仍然旋转,不知是什么原因? 如何在某个页面实现自动跳转??? 紧急求救,我的机器崩溃了。帮帮我啊。!!!!!!!!!(在线等) 改变DW某些内容颜色问题 drearwear ultradev4 在连接数据库最后'确定'键没有作用???? 已知二次函数y=x^2+2x+a(a>0),当m=x时,y1说明理由,答案是y2>0 物理观察报告 格式 范例 求证cb|co=cd|ca 划线处|AB|表示AB相乘后的矩阵的行列式吗 生活中的光的调查实践过程,及实践报告 A+B=C D+E=FA FG+H=GH GF=_______.A.24B.28C.21D.18A,B,C,D,E,F,G,H stand for 0 to 9 .can you work it out A+B=C D+E=FA FG+H=GH GF=_______.A.24 B.28 C.21 D.18 已知a^2=(e-f)^2+(d-g)^2 b^2=e^2+g^2 c^2=d^2+f^2 用a,b,c的代数式表示1/2×(de-gf) 每日观鸟一小时 1000字作文 关于左手定则的问题.帮帮忙!很简单的!一根竖直圆圈导线,电流逆时针流,可以判断圆圈里是【点】场,圆圈外是【叉】场,之后怎么判断这圆圈怎么转啊? 左手定则的使用问题.请问:1,磁感线怎样穿过手心,斜着还是垂直?2,当磁感线强度B与电流I不垂直时,左手定则怎么用?为什么我无论怎样做,都不能使磁感线穿过掌心的同时四指又指向电流方向? 数学几何里除了数量关系,还有什么关系 外媒曝查尔斯不想当国王 王位或将越代美媒:中国能成为生物技术领域领导者吗美霸主地位逐渐丧失 “去美国化”引争港媒:华人强烈抗议“杀光中国人”言论俄外长与联合国叙问题特使讨论筹备叙问联合国-阿盟叙特使称伊朗应参加叙问题法国正式要求美国停止监听行为 希望低中国养老困局难解 老人:不知十几万够求同存异破壁垒 两岸携手打造中华文化日本欲解禁武器出口 妄图“一箭三雕”美媒:中美日竞争转向拼经济 争亚洲“37.3℃ 昨现今年最高温“大暑”时节重在祛湿生津买古币被骗杀人 少年潜逃6年自首骗苗圃苗木补偿款萝岗两村官相继受审便民服务哑儿亲睹父烧母 挥泪为父递求情信张槎崛起未来已来日本试图再次冲击“入常”信息速递如此蹭车不怕摔?惠州供电局组织500人驰援海南
备案号:鲁ICP备13029499号-2 说三道四 www.s3d4.cn 说三道四技术文摘