APP的设计原则(交互)——源自谷歌69点设计原则

GoodUI 总结了一个长达69条设计原则的清单,列举了他们认为非常重要的设计要点。而APP设计很多的设计方法和用户习惯均由WEB端带来,所以此文根据一些WEB设计原则整理拓展为APP设计原则,希望对大家有所帮助。(持续更新中~)

01.让新用户从尝试产品入手,而不是一来就面对冷冰冰的注册表单

先让用户尝试使用产品,而非急于让用户一进来就填写一系列冰冷的表单。先要让用户看到你产品的价值,并通过价值吸引用户如何让产品成为自己的,这样用户才会愿意与你分享他额外的个人信息。这种渐进的参与实际上是一种尽可能推迟注册过程的方式,并且仍然允许用户使用和自定义您的应用程序或产品。


02.减少使用线框,这会过多的吸引用户注意力,而且会让页面看上去透不过气

很多设计师常常喜欢用线来划分各个功能模块区域,这些边界虽然可以很清晰准确的定义一个空间,但是他们也会消耗我们的认知能量,因为它们被认为是明确的线条(特别是交互设计师喜欢用线条输出交互文档)。所以为了减少屏幕元素支线的关系,元素也可以通过接近、对齐、留白等排列出不同的风格以组合到一起区分不同的模块。


3.注意界面元素的一致性,降低用户学习成本

努力保持界面元素的一致性,这是唐纳德·诺曼(Donald Norman)《设计的通用法则》书中提到的最广为人知的设计原则之一。因为一致的UI或交互可以降低用户不同页面或同页面的不同模块的理解成本,有利于用户对于页面信息作出快速的反馈。比如当用户按下按钮或者滑动模块时,用户会发现这些交互元素的外观、行为和被发现的方式都是一样的。一致的界面也可以通过各种各样的形式来表现,比如:颜色、方向、行为、位置、大小、形状、标签和语言。所以在设计过程中,我们要制定设计规范,规范其页面元素的展现形式,对于APP内的的元素保持统一的设计样式。

上图是蚂蚁金服的公共设计平台,供大家参考:https://ant.design/index-cn

4. 提升页面的视觉层次,增强可阅读性

视觉层次的结构是由排列、接近、颜色、字体大小、元素大小、动效、间距、填充等变化而来的。好的视觉层次结构可以用来区分重要的元素和不重要的元素。当这些视觉元素被正确使用时,在页面中它们就能共同协作,引导和暂停用户的注意力,提高页面的整体阅读性。

在交互原型设计的过程中,我们更应该凸显页面的层次结构,减缓用户第一次访问时从头至尾浏览整个页面的速度,让用户快速达到目的。比如,标题突出,同一模块信息处于同一背景之下,特别可以参考格式塔定理,同类信息结合在一起。这对于产品的理解,以及后续视觉和开发对交互的理解都更加清晰明确。


5.延续用户日常的使用习惯,而不是重新创造

如果我们在一个APP保持一致的操作,尽可能保持页面之间的相似度,这样用户的学习曲线会进一步降低。

比如在现有的ios规范中,我们习惯了进入页面时,从右至左的滑入,而退出页面时,从左至右的退出。APP也延续了这个规范,让整个APP的转场动效统一,以达到体验的保一致性。



最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 13,842评论 1 92
  • 每天进步一点点点点点点点点点点点点点点点点点点点点点点点点点点点点点点~~从开始只能写几句话、模仿别人的观点,到现...
    一个帅气的名字呀阅读 18,306评论 4 31
  • 产品知识面考察 真题 例题分析 例题7.3 DAU代表 。 日用户点击量 月活跃用户数量 日活跃用户数量 网站...
    爱摄影的奥派阅读 12,443评论 4 46
  • 最近做的工作内容就是总结分析常见常用的交互原则。在阅读整理的基础上,我将目前常见常用的交互法则总结如下。本文整体结...
    壹玖贰贰阅读 2,505评论 1 18
  • 从公司到出租屋只有十几分钟的路程,有时加班到很晚归来,小区亮着的灯光洒在这条路上,这条走了两年的路竟显得格外的长,...
    只是时间的不凑巧阅读 223评论 0 0