八 设计原则(转载)

为什么需要设计原则?其实就是为了站在巨人的肩膀上,摘苹果更容易一些而已。

设计原则其实就是对一些设计过程中基于人类的认知规律对设计做出的一些指导性原则,并且对已经成为行业共识的设计经验做个总结,用来指导设计师界定问题、提高效率。其实,设计原则更应该成为Design Guideline,就是你可以借鉴,但不一定要依从,仅仅是提供一个重要参考而已。

经常用的设计原则有哪些?

1.可学习性

       目标用户在已有的知识和经验基础上,能正确理解产品界面,不需要思考而一目了然;或者是用户通过自己的学习,借助提示或帮助说明,能够理解产品界面。则界面具有了可学习性。

       可学习的内容包括:明确当前所在位置,知道当前能干什么、接下来要干什么,能快速辨别界面中的元素并明白其功能。在设计时可采用合理的隐喻、习惯用法、有效的启示。这个原则就是能够帮助用户容易的构建心理模型。人们的心理一般都是想象某个产品的时候都是要有这个那个功能,就像一个清单,一旦真正的用起来,就希望有人去引导使用。简直就好比一个人忽然有钱了不知道怎么花一样。信息过度是设计师最常犯的一个错误,给用户太多,用户不知道该选哪一个。对于任务型的场景,一定要有线索,有主干。你去资源站下载软件的时候经常看到满屏的按钮但是却不知道哪个是下载按钮吧?

2.一致性

        在相似的情景下,应在几个方面保持一致性:视觉表现、交互行为、操作结果。良好的一致性,可以减少用户学习成本培养用户习惯,也可体现产品设计的严谨。如果有不同,应作相应的区别处理,特别是视觉表现上要予以区分。不过一致性做的过了也容易造成扯皮,尤其是不同页面上的元素(比如按钮)要完全的保持原样,这会搞的很痛苦的。百度的“百度一下”按钮非得要求在各个页面上大小尺寸完全一致有时候就是障碍了,一致性也要有个度。只要用户没有认知障碍就可以了。

PS:其实这就是表现模型要跟用户的心理模型要一致,至少要接近。

3.简洁性

        少即是多,尽可能精简界面上的元素。当设计出原型,先将元素减半,然后再看能否再简化。生活其实很简单,但很多时候我们人为将其复杂化了。保证主要任务流程顺利完成,消减其余不相关元素的干扰。

        简洁体现在四个方面:减轻视觉干扰、精简文字表述、简化操作步骤。

PS:这个是人类固有的心理模型,人们倾向于理解简单的东西1、2、3、4、5,这个数列规律大家都知道是吧,换一个1、3、7、15、31,是不是就要稍微思考个几秒钟了。关系越复杂认知越困难。

4.流畅性

       用户操作连贯,任务完成顺畅,避免干扰或打断。明确最基本的核心任务,并保证它的顺利执行,辅助操作应在不影响核心任务的基础上展开。避免干扰,让用户明确在特定界面中的首要任务和目标,尽可能避免界面上的视觉噪音和其他干扰;避免打断,让用户的操作保持连贯性,模态框的使用要谨慎。

PS:这个是心理学上的东东,比如1-2-3-4-5,数着很爽,2-3-1-4,数着很别扭,用户的期望都是有规律的,不符合这个规律用户就会觉的难受。这就解释了为什么不是所有的声音都能称得上是乐曲,有的只能是噪音。

5.及时反馈

        界面中任何可操作的地方,当用户发生操作时,都应该及时给予反馈。让用户了解操作已经生效,界面还在用户的控制之下。

       反馈内容包括:用户操作反馈和产品状态反馈。操作反馈,指的是界面元素在用户进行滑过、点击、移开等操作时,元素的反馈变化。状态反馈,指的是产品在运行需要用户等待或者系统出错时的反馈,让用户明白状况。

PS:在实际生活中,按一下按钮,会有什么反应那在网站上的按钮最好也有类似的反应。用户在真实世界的经验会投射到虚拟产品上。没有反馈等于不受控制,这是人们所不想看到的。

6.可探索性

       用户在使用产品过程也是一个探索过程,产品应该允许用户犯错,即使犯错了也不能埋怨用户,而且必须给用户重新尝试的机会,让用户处于放松的心态。设计过程中,首先要帮助用户避免出错,比如采用合适的控件(相同情况下选择控件比输入控件出错机会更小),给予输入帮助或启示。用户出错后,需要提供撤销或返回功能,使用户返回到上一步操作重新探索。出错反馈要亲和,避免责备用户或鲁莽的打断或推出产品,要礼貌的指出错误所在并提供有用的补救建议。

PS:人人都是坏小孩,会犯错误,犯错的成本足够小,用户就会很爽。

交互设计七大定律:http://lwurl.to/3OQO5

1 一个界面为主要角色设计,而不是为所有人设计。

2 为日常场景设计,不要让边缘场景主导你的设计。

3 所有的习惯行为都需要学习,好的习惯行为只需学习一次。

4 除了输入所有的行为支持鼠标操作;除了绘图所有的行为支持键盘操作。

5 在满足需求的前提下,界面的信息越少越好。

6 在满足需求的前提下,界面的功能越少越好。

7 在满足需求的前提下,界面的交互次数越少越好。

8 界面的操作方式最好一目了然,不需要帮助。

9 操作前可预知;操作中有反馈;操作后可撤消。

10 充分利用隐喻设计。

11 让用户知道身在何处。

12 界面结构合理、功能布局、措词统一,突出重点。

13 日常场景使用的界面应放在主要位置,且尽量的大。

14 一般界面的颜色不超过3种,且避免大面积使用刺眼的颜色。

15 减少用户的记忆负担,尽量让用户识别,而不是回忆。

16 尊重用户的习惯思维和行为,除非你有更好的设计。

17 关注用户的目标,而不是任务。

18 尽量避免对话框,且对话框深度最多不应超过3级。

19 ...

交互就是设计行为,行为就是一连串的动作,具体到动作中的每一个环节都会有一个受动的对象,比如点击按钮、弹出窗口、阅读弹窗内容、关闭弹窗等等,截取整个一连串动作中的一个对象--按钮来看,分为前、中、后三个阶段:

前-用户在点击前对于点击后的结果心理是有个预期的,是由之前页面的上下文和按钮本身信息(文案、形状等)来决定的

中-点击的每一步动作都需要按钮有个反馈,鼠标进入按钮的感应区域、悬浮(hover)在按钮上,按钮应该自身有个状态的的变化,比如颜色,点击中也应该有个变化

后-鼠标点击后弹出的对话框是否符合用户的心理预期,比如按钮上边的文字是“下载”,预期其实就是下载文档,结果弹出一个对话框告诉你积分不够,这样做的体验就是不好的。简单的按钮是这样,复杂的登录注册流程甚至是时间间隔好几天的流程也是这样,都适合用这个三个阶段来划分,只是量的大小时间跨度的长短问题。

还有一个更为专业的划分方法(交互设计精髓里边说的),虽然设计原则众多,但是可以分为四类:

一、设计价值:

这个是设计工作是否有效的必要条件,决定了一下几个层次的次级原则

二、概念设计:

用来界定产品定义,产品如何融入广泛的使用场景

三、行为原则:

描述产品在一般情景和特殊情景应有的行为

四、界面原则:描述行为及信息有效的视觉传达

一、设计价值:其实就是这个设计是否符合用户的需求,是否满足用户的目标,交互设计在这一层次能够为用户做什么。这一层做不好,后边的都免谈

二、概念设计:产品是怎么使用的?以什么形式呈现给用户?是Web还是App?是为新手做引导还是为中间用户提供方便等等

三、行为原则:这个才是我们上边提到的一堆设计原则,什么及时反馈啦、可学习啦。

四、界面原则:这个就是“布局要突出重点啦”“一个界面同时最好完成一个任务啦”等等

Alan Cooper不愧是大师,提出的四个层次一下就把那么多零七碎八的设计原则统统收在自己的框架之下了。

符合设计原则与满足用户目标有冲突时如何权衡?设计师的本质就是为用户解决问题提供价值,“设计以人为本”,用户目标是最重要的。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 214,588评论 6 496
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 91,456评论 3 389
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 160,146评论 0 350
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 57,387评论 1 288
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 66,481评论 6 386
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 50,510评论 1 293
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 39,522评论 3 414
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 38,296评论 0 270
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 44,745评论 1 307
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 37,039评论 2 330
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 39,202评论 1 343
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 34,901评论 5 338
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 40,538评论 3 322
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 31,165评论 0 21
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,415评论 1 268
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 47,081评论 2 365
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 44,085评论 2 352

推荐阅读更多精彩内容

  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 171,973评论 25 707
  • 下面的原则对于有效的用户界面的设计和实现都是最基本的,不管是针对传统的图形用户界面还是针对任意的可联网的智能电子设...
    arlene112阅读 2,295评论 0 16
  • 最近做的工作内容就是总结分析常见常用的交互原则。在阅读整理的基础上,我将目前常见常用的交互法则总结如下。本文整体结...
    壹玖贰贰阅读 2,408评论 1 18
  • 我的回答小而贴切; 大问题削弱我的意志,但我仍然 用小回答抵抗恐惧。 我拒绝光,巨大的抽象; 我处理、抚摸并热爱着...
    东丰林波阅读 180评论 0 1
  • 老人云:春捂秋冻,我本着这个原则,每天就和街门口的骨质酥松王大爷一样,裹着厚厚的,怕春风把自己吹出毛病似的行走在路...
    青猫小姑娘阅读 388评论 0 1