HTML5资讯

当前位置: HTML5技术网 > HTML5资讯 > 设计移动 App 需要注意的 10 点

设计移动 App 需要注意的 10 点

       1.  不要在没有流程图之就前开始设计或者画线框图 
       即便一个简单的App也要有一个思虑周全的流程图,以确保在App有合乎逻辑的、合理的导航结构。另一点值得关注的是确保核心功能所在的屏幕位于上层而不是被埋没在多层导航元素之下。 


       跳过流程图直接进进入开发会让开发变得复杂、不可控,很容易让用户迷茫,最后选择关掉或者卸载你的App。
       2.  分工要明确 不要忽略开发预算 
       设计师创建的每一个细节都要经过开发者才能变得活灵活现。花几个小时和几天时间做出的简单设计更改对App功能的影响是截然不同的。还有,设计不能命令功能。比如,一个计划好的App可能有一个搜索框,设计师预想的是一个产生实时结果的键入搜索,但设计师不能是做这个重大决定的唯一决策人。 
       3.  不要使用低分辨率的图片 避免使用位图 
       一般而言,设计首先是为视网膜显示屏、高分辨率的显示屏设计,然后按比例缩减。很多设计师都清楚这一点,但仍值得一提。屏幕分辨率越来越多,设计师需要从高分辨率设备做起,再按比例缩减。更好的做法是使用矢量图形进行设计而不是位图或者栅格图像。 
       4.  不要把点击区域设置的太小 
       大多数用户的食指宽1.6~2厘米。设计时要考虑到手指的宽度,而且用户在快速移动手指的时候,很难准确的点击小片屏幕。在屏幕上加大量的按钮和功能很容易,但按钮一定要足够大,间隔也要足够大,否则用户容易误点。 
       5.  不要随意使用介绍动画 
       在用户首次打开App的时候,给用户一个动画的介绍是个不错的想法,但不能太过火了。事实上,这些介绍动画也延迟了用户接触App的时间。如果你打算使用介绍动画,那要让动画时间尽可能短,设计尽可能精细以及足够吸引人,值得用户花费时间等待。 
       App加载过程中会先展现图片,再过渡至动画。要确保这个过度是平滑的,贴切自然的。有的App从加载图片过渡至介绍动画设计的非常蹩脚,这就很无趣了。 
       6.  别让用户空等 


       App加载时间过长很容易让用户以为出现了什么故障,也会带来糟糕的用户体验。App加载的时候不要让用户看到空白的屏幕,使用加载指示条或者小动画让用户知道App处于正常运行当中。如果能加入一个加载进度指示条就更好了。 
       7.  不要盲目照搬别的操作系统 


       这个问题说的是App各个操作系统版本的差异性,不同的移动操作系统有着迥异的审美观,比如iOS、Android和WPh7。开发者需要认真学习各个操作系统的人机界面指南,做好不同版本App的移植工作,不要让用户迷茫和不适应。不一定非要让App看起来是系统自带的,但至少不能让人觉得突兀,不属于这个平台。 
       8.  不要在高密度像素屏幕上填充过多信息或者UI组件 
       当为高PPI (pixel per inch每英寸像素) 屏幕设计UI时,因为有更多的像素可以使用,所以可在界面放置更多信息或者UI组件。请记住一定要预览一下你在实际设备上的所有设计结果。 
       充塞了很多信息或者UI组件的界面会显得非常杂乱,并且难以有效导航,更会影响界面上的主要功能的展现。 
       9.  不要觉得每个用户有着跟你一样的App使用方式 
       可用性测试是必须的,不管你的App看起来多么好。找值得信任的人(或者有经验的设计师)进行小范围封闭测试,在公开发布之前更新下界面。另一个简单易行的获得用户反馈的方法是在分类网站张贴广告招募合适的人进行焦点小组测试。 
       10.  不要忘记手势 但不要滥用 
       不是每个元素都是可视化的,比如iPhone Mail app的删除进程。在收件箱内,用户可以猛击屏幕显示删除按钮,用户就不用点击“编辑”,选择信息然后再删除信息。不过,也不能说“编辑”菜单一点用处都没有,不知道快捷操作的用户还是需要的,而用户还可以通过“编辑”菜单一次性标注多条信息/邮件。 
       一句话,不要忘记手势但也不能滥用,通常要避免通过使用手势进入菜单,或者通过手势。

【设计移动 App 需要注意的 10 点】相关文章

1. 设计移动 App 需要注意的 10 点

2. WEB标准最佳实践:五个需要注意的地方

3. 提高jQuery执行效率需要注意几点

4. 关于HTML5你需要注意并了解的事项

5. Web设计领域值得注意的5个发展趋势

6. 开发者应注意的HTML5易被攻击的5个“漏洞”

7. 网站设计中使用CSS的注意事项

8. 网站设计中使用CSS的注意事项

9. 40个极富创意的html5网站欣赏

10. HTML5设计师们需要知道这些工具

本文来源:https://www.51html5.com/a3089.html

点击展开全部

﹝设计移动 App 需要注意的 10 点﹞相关内容

「设计移动 App 需要注意的 10 点」相关专题

其它栏目

也许您还喜欢