第一站 - 轻松上网从此开始!

上网第一站

当前位置: > SEO >

移动端产品设计完全指南(3)

时间:2018-03-06 10:05来源:我来投稿获取授权
以下内容来自网络或网友投稿,www.swdyz.com不承担连带责任,如有侵权问题请联系我删除。投稿如果是首发请注明‘第一站首发’。如果你对本站有什么好的要求或建议。那么都非常感谢你能-联系我|版权认领
可预测性是用户体验设计的基本原则。当事情按照用户预计的方向运行时,用户会有强烈的控制感。在PC上,用户可以使用鼠标悬停来判断该元素是否可以

  可预测性是用户体验设计的基本原则。当事情按照用户预计的方向运行时,用户会有强烈的控制感。在PC上,用户可以使用鼠标悬停来判断该元素是否可以点击或有交互,但在移动设备上,用户只能通过点击来判断是否为交互元素。这就是在移动端,要着重考虑按钮等交互元素设计的原因。如何能让用户清晰地感知该元素为按钮?应该将按钮和非交互的UI元素在外观上做明显的区分。

  2.2. 请正确使用“返回”按钮

  不正确的使用“返回”按钮会带来很多问题,用户点击“返回”键是想回到上一页,要避免用户点击“返回”直接回到首页的情况。好的设计应该是让用户更容易返回和修正误触,当用户清楚他们可以通过“返回”再次查看填写的表单或者选择的选项时,用户会更轻松地前往下一页。

  2.3. 有效的错误信息

  出错是情理之中。有时是用户误触或者误操作,有时是程序自身运行错误。不管是怎样的场景,错误和其解决方案都对用户体验产生巨大影响。给用户提示无用的错误信息,而不是告知用户正确的处理方案,会造成用户体验上的挫败感,甚至造成用户流失。

  以Spotify的错误页面为例,这个页面并没有告诉用户错误是如何产生的,也没有告诉用户如何解决,那么用户就会很困惑:“现在我能做些什么呢?”

  

移动端产品设计完全指南

  Spotify的错误页面只有“出现错误”字样,无任何解决方案

  不要寄希望于用户的技术娴熟,能自己解决问题,要用简单明了的话术告知用户发生了什么。错误信息应包含以下内容:

  出了什么错,可能的原因;

  为了修复错误,接下来用户要怎么做。

  3. 界面的无障碍设计

  无障碍设计指设计方案应支持各类人群的使用。考虑下失明、失聪或其他残障人士应如何使用你的App呢?

  3.1. 照顾色盲人群

  全球的的色盲或者色弱人群占比4.5%,弱视人群占比4%,盲人占比0.6%。我们在设计产品时很容易忽视这部分用户,因为大多数产品经理和交互设计师都没有遇到这样的问题。

  有一个简单的例子,App中表单填写的成功和错误提示分别用绿色和红色,但这两种颜色是色盲或色弱人群最难区分的。很多产品在表单填写处提示“红色标记字段是必填项”,虽然这是一个细节,但是如果设计成下图的方式,那对色盲人群来说就是个灾难。

  

移动端产品设计完全指南

  色盲用户无法区分红色突出的字段

  颜色可以被用作传递信息,但不应是传递信息、表示动作、提示或辨别视觉元素的唯一视觉手段,在使用颜色的同时,还应使用其他的视觉符号以确保任何用户都能够清楚认知界面信息。

  

移动端产品设计完全指南

  同时使用标签、icon和颜色传递信息

  3.2. 动效是可选项

  一些用户习惯于关闭操作系统设置里的动画效果,当用户已经选择关闭动效时,App应尽可能地屏蔽掉其中的动效。

  4. 导航栏设计

  导航栏设计应该是App设计中优先级最高的工作之一。如果用户找不到功能或者内容入口,那即使App的功能再酷、内容再优质,也无济于事;另外,如果花费过多时间和精力去设计产品的导航架构,也可能会适得其反、失去用户。导航的设计标准应该是让用户自然、直观地使用App,无需任何解释或帮助信息就能完成所有的主线任务。

  4.1. 使用标准化的导航组件

  最好使用标准化的导航组件,比如iOS中的tab bar和Android中的抽屉导航栏(navigation drawer),大多数用户都习惯于这两种导航模式,即使首次使用App,也会比较容易上手。

  

移动端产品设计完全指南

  Android的侧滑菜单(图片来源:Material Design)

  

移动端产品设计完全指南

  iOS的tab bar(图片来源:Ramotion)

  4.2. 不要混用导航模式

  当选定了一种核心导航模式后,请不要夹杂其他的导航模式。避免出现同一个App中既有tab bar又有navigation drawer的情况。

  4.3. 导航栏可见

  正如Jakob Nielsen所说,认知比记忆更容易。始终保持操作和选项可见,能最小化用户的记忆负载。导航的位置应该清晰显著,保证随时可用,而不是只在用户必须使用时出现。

  4.4. 标注当前的位置或层级标题

(责任编辑:admin)
织梦二维码生成器
顶一下
(0)
0%
踩一下
(0)
0%
------分隔线----------------------------
发布者资料
第一站编辑 查看详细资料 发送留言 加为好友 用户等级:注册会员 注册时间:2012-05-22 19:05 最后登录:2014-08-08 03:08
栏目列表
推荐内容
分享按鈕