移动应用设计的最佳实践

移动应用现在是提供内容和服务的主流方式。但在热闹的移动应用市场,面对五花八门的各种APP,如何让你的APP受重视,脱颖而出得到用户的青睐?留白应该作为一种主动的元素,而不是作为被动的背景——Jan Tschichold温馨提示:创建最好的移动应用消息策略应该用不同的通知类型——推送通知,电子邮件,应用内通知和新闻源消息。多样化你的通知类型——你的通知工作应该完美协调,创造最佳用户体验。


移动应用现在是提供内容和服务的主流方式。但在热闹的移动应用市场,面对五花八门的各种APP,如何让你的APP受重视,脱颖而出得到用户的青睐?

移动应用设计的最佳实践

这里有7个UX设计提示,助你创造移动应用的极致体验。

1. 一个屏幕,一个任务 减少用户使用成本

每一屏只做一个有价值的动作,为了唯一一件事情。切记不要超过一次行为动作。这样设计可以让APP更容易学习,更易于使用,并更容易添加或在必要时进行构建。

以优步(Uber)为例。优步知道用户的使用目的纯粹是为了打车,APP不要用太多信息淹没用户。APP通过GEO数据自动探测用户所处位置,而用户只需要选择目的地就可以了。

2. 隐形用户界面 内容即为界面

移动应用设计的最佳实践 

专注于内容,删除不支持用户任务的元素。用户不再分散注意力,能更快的找到想要的内容。内容即为界面。谷歌地图是一个很好的例子,经过重新设计,谷歌删掉了没必要的控制板和按钮,谷歌说,地图就是界面。

3. 呼吸空间 使用留白来凸显重要内容

移动应用设计的最佳实践 

留白或者『负空间』指设计或页面布局的元素之间的空白空间,经常被忽略轻视。尽管很多设计师认为这是屏幕空间的浪费,但留白是移动应用设计的基本元素。

留白应该作为一种主动的元素,而不是作为被动的背景——Jan Tschichold

留白不仅负责可读性和内容优先级,它也在视觉布局中发挥重要作用。因此它可以改进UI并提升用户体验。

移动应用设计的最佳实践

图片来源:Material Design

在你的设计中遵循『少即是多』的原则。

4. 简化导览 使导览不言自明

帮助用户导览应该是每个移动应用的最高优先级。移动应用导览必须是可发现的,可访问的,占用屏幕空间少的。然而,移动应用的可访问属性是不容易做到的,由于小屏幕的限制和优先级的安排。

标签栏和导航栏非常适合拥有相对较少导航选项的移动应用。他们显示了所有主要的导航选项,只需要用户一个点击就可以从一个页面跳到另一个页面,太赞了。

移动应用设计的最佳实践

苹果APP Store中的标签导航栏

5. 单手操作 使您的设计符合更大的屏幕

Iphone6 和 IPhone6 Plus的发布表明屏幕尺寸会越来越大。

移动应用设计的最佳实践

人类手持手机的三种基本方式如图:

移动应用设计的最佳实践

人类握持手机的三种基本方式。由Steven Hoober研究发现

研究发现85%的被观察用户单手操作手机。下面的热成像图显示了在不同尺寸的IPhone上的大拇指的活动区域。我们能看到显示屏越大,可访问区域越小。

移动应用设计的最佳实践

拇指区域。根据Scott Hurff的观测研究

调整设计来提高用户体验是有必要的。尽量确保你的APP在大屏手机(比如iPhone 6 或 7)上可以轻松(且完整)地单手操作。将导航选项放在拇指范围内。

移动应用设计的最佳实践

图片来源:Dmitry Kovalenko

IOS的口袋应用,所有导航控件都在页脚,当你正常握持手机的时候可以轻松触及。

6. 让应用快速出现 别让用户等待内容

竭尽可能的让APP快速反应。在后台做预处理,这样会看起来响应很快。后台操作有两个好处——对用户不可见,并且在用户实际请求之前发生。一个很好的例子是在Instagram上传照片,只要用户选好了照片,在分享之前就开始上传了。

移动应用设计的最佳实践

当在后台上传照片的时候,Instagram邀请用户给照片贴标签,贴完也就上传完了。这样当你按下分享按钮的时候,照片立刻就分享出去了。

7. 明智的使用推送通知 在发送通知前请三思

用户每天被各种没用的通知信息轰炸,分散日常活动的注意力,彻底搞烦。烦人的通知是用户卸载移动应用的首要原因(71%的受访者)。

移动应用设计的最佳实践

移动设备要的是每条信息都有价值。不要为了吸引用户而发送通知。只有认为消息对用户有价值的时候才可以发送通知。

温馨提示:创建最好的移动应用消息策略应该用不同的通知类型——推送通知,电子邮件,应用内通知和新闻源消息。多样化你的通知类型——你的通知工作应该完美协调,创造最佳用户体验。

移动应用设计的最佳实践

资料来源:Appboy

根据优先级和内容选择正确的通知类型。

结论

要记住,设计一个移动应用最重要的事情是确保它有用且直观。如果APP没什么用,对用户没有使用价值,没有人有任何理由使用它。如果APP有用,但是需要耗费大量时间和精力,用户不会学习如何使用它。良好的UI和UX设计则能解决这两个问题。

谢谢!

 

原文作者:Nick Babich

原文地址:http://babich.biz/mobile-design-best-practices/

译者:Nodar

译文地址:微信公众号『湾区记译』

本文由 @Nodar 授权发布于人人都是产品经理,未经作者许可,禁止转载。

原创文章,作者:Catherine,如若转载,请注明出处:https://www.iamue.com/26453/

(0)
CatherineCatherine
上一篇 2017-05-14 14:52
下一篇 2017-05-14 16:46

相关推荐

  • 阿里国际UED小二亲授“有效”视觉传达 — 新零售时代,打好2018年内容营销的开局基础!

    如今商业已经进入新零售时代,流量红利已经过去。要让消费者感兴趣并购买商品,不能再靠简简单单堆叠商品信息和低价促销吸引消费者,而是要在内容上精耕细作,达到信息的有效传达。而人获取的信息八成是来自于“视觉”,所以可想而知,在如今内容爆炸的时代,视觉营销能有效帮助商业提升转换效果,成就更好的销售额。阿里巴巴国际ued团队欣频据第三方预测,2018年,84%的营销内容都是以视觉图像的方式来呈现。我的个人观点,未来品牌的视觉营销会呈现情感化、个性...

    2018-01-31
  • 多媒体H5:移动端最简单的动画制作方案

    了解和使用多媒体制作H5已经成为前端工程师的必备技能。

    2017-05-10
  • APP切图命名规范:介绍一种通用的命名规则

    今天菜心要分享的内容是关于切图命名的规范,由于最近正在总结这一部分内容,所以拿出来和大家一起分享探讨一下。组件_类别_功能_状态@2x.png模块_类别_功能_状态@2x.png

    2017-05-10
  • Axure神器:用母版打造模块化设计【UXRen原创】

    作者:Petrel(UXRen社区Axure金牌讲师,资深交互设计师) Axure原型的制作过程中,你一定遇到过这样的问题,出现在不同页面的功能模块,如果你是通过复制粘贴来完成的,那么当该模块发生变动需要修改时,麻烦就大…

    2017-08-04
  • 交互设计就业前景怎么样?

    交互设计师/用户体验师 5年内22倍增长需求。在我几年前选择交互设计这个专业的时候还没有什么人知道是什么。还是蛮有趣的,就是想尽一切办法让用户满意。国内以前只有浙江大学才有这个专业,现在应该很多大学都有了…

    交互专题 2016-10-25
  • 初感避孕套用户体验反馈

    其实初感明白,很多朋友都徘徊在到底要不要代理初感这款产品上,很多的朋友都在问初感长的啥样的?以及初感避孕套的价格是多少?初感避孕套怎么样,好不好用?初感避孕套的效果如何?初感回头客多不多?今天我就把我自己的亲身体验分享大家!初感长啥样?下面就是初感的包装图和套子的实物图:高大上的包装盒,简便易撕的小袋子!初感的价格到底是多少呢?来看看初感安全套与市面上各大品牌的价格对比:通过这张图可以看到,初感安全套不仅比那些大品牌的安全套价格便宜,而...

    2018-02-12
  • 草稿箱的交互设计

    作者:宋孝方,交互设计师,现负责虾丸校园app的整体交互设计。 转载自微信公众号:大宋(id:songxf0827) 转载请联系作者。 由于移动端设备的限制,文字的编辑成本高,在PC上很容易完成的事情,移动设备上来做可能…

    2015-09-10
  • 几何动图采集,设计师数学能力大爆发!

    原文作者:Adam Plouff 分享自微博:@Victoria_ia   哎呀妈呀,我要去补习一下几何学了。  

    2015-07-08
  • 移动端图片阅读—交互设计分析

    ↑点击上方蓝字,加个关注吧~↑今天老冰给大家分享一个移动端图片浏览的交互方式这个APP的阅读教程中,一共介绍了四种交互方式,左右滑动翻页浏览,上下滑动阅读更多,下拉放大图片,侧划查看时间线以往资讯。在这里并没有介绍左滑,有人问,左右滑动不就是左滑吗?其实,并不是,当你位于第一张图片时,也就是现在左滑已经没有内容了,此时你的左滑便有了刷新的作用,不同于其他(很多app刷新都是下拉刷新),这也是值得称赞的地方,它通过自己的交互思维,产生了自...

    2018-01-30
  • 利用github预览axure发布的文件

    目的github不仅仅可作为一款代码开源库平台及版本控制系统,百度百科对其定义为私有或开源软件项目管理平台,今天在此向不会使用Git的同学们普及下利用github预览Axure发布的原型文件。准备阶段1、github desktop。下载地址:https://desktop.github.com/2、 github账号。注册详情:https://blog.csdn.net/p10010/article/details/51336332下...

    2018-05-04