移动端交互设计:如何让手机运行快起来?
沉沙 2018-05-18 来源 : 阅读 1393 评论 0

摘要:移动互联网的发展迅速,我们都知道无论网页还是移动应用,响应速度都是最重要的体验指标之一,稍不留神应用就被用户判下了“死刑”,并且移动应用的网络环境不稳定,速度的体验显得尤为重要。其实速度优化中,交互设计,也能够让APP变得更快。希望本文加深大家对交互设计的理解。

移动互联网的发展迅速,我们都知道无论网页还是移动应用,响应速度都是最重要的体验指标之一,稍不留神应用就被用户判下了“死刑”,并且移动应用的网络环境不稳定,速度的体验显得尤为重要。其实速度优化中,设计,也能够让APP变得更快。

1、后台执行

这是一条很通用,也容易理解的方法。用户不会愿意盯着进度条傻傻地等待,除了“取消”没有其他选择。在系统处理一些网络任务的时候,完全可以允许用户做一些其他的事情。

各大平台的发微博,都采用了后台执行。

 

而微博的看长图(或视频),是个反例。网络不给力时,要么等待1分钟让图加载完,要不就只好放弃看图。为什么不能让图加载的同时,用户可以看其他微博呢?

 

 

2、在载入前显示内容

客户端与web的一个不同点,客户端的显示内容包括本地数据和网络数据两部分。在设计界面时,将更多的信息放在本地,在网络数据未载入时即显示本地数 据,让用户产生一种“已经载入一半了”的错觉,即使最终的耗时一样,心理感受也会更快。当然把数据过多地写在本地,会牺牲一些灵活性,需要根据具体情况考虑。

具体请看twitter、Facebook、等优秀产品的启动画面,虽然同是静态图片,但它们不使用LOGO而假装已经载入了“导航栏”和“标题栏”,让人感觉“点击后立即就启动了”。

 

 

3、充分利用好缓存

缓存可以把网络数据保存在本地,下次打开时无需要再次向网络请求,减少流量并减少等待时间。在设计时,可以先显示缓存内容,同时后台到网络上拉取新内 容,若有新内容立即替换或下次访问时替换。但缓存使用也要注意“度”,过大的缓存文件占用太多的系统空间,会让用户一怒之下卸载APP。

 

4、界面先行,网络交互随后

对于一些数据量很小,且失败可能性较小的网络交互,用户并不需要明确知道APP在干这些事情,也能够顺畅地使用APP,那么我们就应该“把一些事实掩盖起来”,即界面上听话地、迅速地完成任务(心智模型),程序后台默默地继续执行任务(实现模型)。

最常用的比如QQ、微信、易信等聊天界面。点击发送后,消息立即”飞”到聊天上下文中,其实对方还没收到。但这样的设计让沟通的过程更顺畅,没有“正在发送 – 发送成功”各种过程的干扰。

5、预测用户行为,提前开始任务

不知道大家使用淘宝有没有这样的习惯,在搜索结果列表,将所有感兴趣的结果都打开为新标签页,然后一个个地看,没兴趣的就关闭。这样做的好处是,在我浏览商品详情页的时候,每个页面都是载入完全了,否则我点开一个看一个,每个都要等待加载完,就会大大降低效率。

那么能否通过设计,来满足类似使用场景呢?应该是可以的,那就是预测用户的行为,提前开始任务。

策略类似这样:

用户在某个界面停留的时候,预测下一步可能做ABC三个任务,系统于是把这些任务都提前做完。当用户做出选择比如A时,界面可以迅速响应,并且同时把 BC两个任务从内存中清空掉以节省资源。(当然这招也有限制:1,只适用于免费的网络。2,预加载不能影响系统的性能)

Android更新提醒在安装包自动下载完成之后提示,让用户不再需要等待下载过程。(虽然有人会说这样很流氓,但是还是起到很大的作用,毕竟很多人都厌烦那个弹出框叫你更新的吧)

 

6、使用动效来掩护载入过程

优秀的动效设计,让产品更好用且让人眼前一亮。其实,动效还有另一大用处,吸引用户的注意,让本来枯燥的等待载入的过程,变成愉悦欣赏的过程。

移动应用的设计和优化在编程、交互方面都起着很大的重要。

 

本文由职坐标整理发布,欢迎关注职坐标交互设计频道,获取更多交互设计知识!

本文由 @沉沙 发布于职坐标。未经许可,禁止转载。
喜欢 | 0 不喜欢 | 0
看完这篇文章有何感觉?已经有0人表态,0%的人喜欢 快给朋友分享吧~
评论(0)
后参与评论

您输入的评论内容中包含违禁敏感词

我知道了

助您圆梦职场 匹配合适岗位
验证码手机号,获得海同独家IT培训资料
选择就业方向:
人工智能物联网
大数据开发/分析
人工智能Python
Java全栈开发
WEB前端+H5

请输入正确的手机号码

请输入正确的验证码

获取验证码

您今天的短信下发次数太多了,明天再试试吧!

提交

我们会在第一时间安排职业规划师联系您!

您也可以联系我们的职业规划师咨询:

小职老师的微信号:z_zhizuobiao
小职老师的微信号:z_zhizuobiao

版权所有 职坐标-一站式AI+学习就业服务平台 沪ICP备13042190号-4
上海海同信息科技有限公司 Copyright ©2015 www.zhizuobiao.com,All Rights Reserved.
 沪公网安备 31011502005948号    

©2015 www.zhizuobiao.com All Rights Reserved