五个APP交互设计细节,是考验设计师功力的准则

APP设计其实是一门非常精细的设计功能。比web网页设计还需要更加的专注和费时间。

一款优秀的APP UI设计,在于APP设计细节的把握和相关移动交互效果的展示。

App-UI-005

今天25学堂就跟大家来聊一聊APP交互设计的五个细节设计和思考。 从这几个方面也间接的体现出移动APP设计师的功力。

 

第一个APP交互设计细节:隐性导航设计和布局

因为我们针对的移动端界面,任何一点空间都是寸土寸金。所以就出现了隐性导航或者是隐藏菜单。比如常见的隐性导航就有:

1、下拉刷新

        最流行的“隐性导航”要数“下拉刷新”了,这个最早出现在twitter客户端的下拉更新timeline功能迅速在此类软件中流行,iOS下网页版的gmail,新浪微博,甚至网易新闻,都使用了这种设计。

左导航-副

2、左右滑动

        让人印象深刻的还有UC浏览器的前进后退功能,后退只要拇指向右滑动,前进只要向左滑动手指即可,不必寻找前进后退按钮,这种设定下浏览器全屏也不会影响操作的流畅性。

类似的设计有很多,在yReader下左右滑动是切换前一篇后一篇文章,在iBooks、QQ阅读的电子书阅读软件左右滑动是前后翻页。android下的QQ客户端的当前会话、好友和群组分别是三个标签,左右滑动可以从这三个功能区中迅速切换。

当然这里还有更细的阅读和体验:

APP设计必知的五种常用APP单手操作用法

移动APP交互创新设计技巧:手势流的运用

 

第二个APP交互设计细节:“真正的” 帮助用户排解的焦虑感?

常用的策略有:指示器、进度条、框架读取和动态提示等。

app启动加载loading

最开始,我们经常会为了让用户知晓元素正在下载中,我们添加了旋转式读取指示器,来展示正在从服务器处接收。用户会在应用中发现旋转的指示。

progress-bar-psd-full

可结果呢?用户给予了我们如下的反馈:

“感觉等待耗时太长了,读取、刷新的速度太慢——感觉没有上一版本快””

正像上面说的那样,读取指示器容易让用户感觉时间变“慢”,因此应用等待耗时相对的就“长”了。

而且从设计的层面上讲,这么设计仅仅聚焦于“指示器”,而不是“程序的加载”。用户得到的是“等待”,却看不到“程序加载过程”。

经历了这番思考后,设计思路明晰了起来,我们应该向用户展示一步一步读取的过程,而不应该省事的一个进度条了事,让用户陷入无尽的等待中。

这里可以阅读《3种常见的移动APP页面加载设计方案优缺点》和《八种APP启动界面的Loading进度条设计动效方案

APP 框架加载

上面是方法一,下面的方法二也不错,叫做构架读取。我们在Polar使用了这种技术,因为进度条虽然比指示器先进,但是其实本质都是一样,只不过进度条更具有某种“欺骗性”,而构架读取不一样,读到了什么地方,就显示出什么地方,所见即所得,能够大大的增强用户的信任感。渐进式的数据读取,最后达成完整界面的传递。

优先等级:框架读取 》进度条 》指示器 》 提示

 

第三个APP交互设计细节:别妨碍用户操作

不要为了一些目的去妨碍用户的体验。用户的力量不可抵挡,他们是上帝。

巧妙的引导,才是正确的交互操作。

这就是引导,这就是不妨碍用户,这就是良好的用户体验。合理分析用户的心态,为他们着想,才能更精确的命中用户需求。我们从“找朋友”这个功能上找到了突破点,利用这种发,重设计了很多功能。发现 等功能上做文章和交互。

一切都得利用 收集和放松 的状态来设计APP。  也就是说我们策划的APP栏目 要合理、归类陈列的技巧也是设计师必备的一项技能。

app引导页设计5

值得学习的APP设计案例:APP交互设计做的一级棒APP案例—MONO猫弄

MONO APP

25学堂本着这么好的软件应该让更多的人知道,无论是独有的文章推送方式和阅读音乐类文章播放界面时的细节都很贴心。无处不在的细节跟简洁美观的设计给了我很好的印象。

 

第四个APP交互设计细节:“及时”的教学

一些移动APP在打开时,就在界面最顶端弹出新手教学,力图图文并茂的展示,但是用户缺少实际操作,并不知道这么多手势中,最常用的是哪个。因此用户学起来“全而不精”。

也是属于引导的范畴。只是从明的一面来引导用户参加APP体验之旅。

事实是,90%的人都会跳过此环节,即便没有跳过,学过的东西马上也会忘记。问题出在何处?所谓“实践出真知”,没有实践,教用户“纸上谈兵”你觉得用户能掌握吗?而且用户的心理是,想尽快的操作应用,这一点也被忽视了。界面的模样都没看到,便教用户怎么去进行界面操作,未免太荒谬。

所以这种情况下,提前教学是不好的,教学要在用户最需要的情况下出现,这样才有效。Josh Clark称这种方法为“及时教学”,这是很灵活的办法。

将繁复的指导隐藏、分解,在用户需要被指导时出现,用户看完指导立马实践,这样的教学效果绝对好。用户需要时,满足他们的需要。用户不需要时,别去烦他们。

App设计ps教程

 

第五个APP交互设计细节:确定好一条用户故事来设计,让你不会迷路和迷茫。

在开始视觉设计之前确定出完整的一套用户故事。抑制住自己直接跳入设计的冲动可以节省时间,避免不必要的头痛和无用功。

移动app产品用户体验2

对于每个用户故事,看看是否能继续细化成更具体的故事。长篇大论适合于从宏观角度概括所需功能,但是细枝末节的地方也不能忽略。在早期深入细节,从一开始就解决实用性问题。

不要把设计元素放到没有对应用户故事的界面上。对每个元素的内容和产生原因进行记录可以让条理更清晰,在向开发团队移交时会更加顺利。

APP设计师必须了解整个APP的使用场景和用户的故事,这样才能设计出合理的移动APP设计作品。你自己都走不通,用户也会走不通的。

其实设计APP界面,也是一次设计师自己进入角色进行游戏的过程。

每天更新,
全站高品质素材免费下载!