设计可用性设计原则

       最近拜读了点石成金这本web和移动设计的经典书,虽然在移动互联网时代,web设计会显得有点过时,但是里面有一些基本的设计原则,应该是值得所有人借鉴的,就像作者所说:“人类大脑的容量不会马上发生变化,所以这些人类行为研究所得到的成果在很长时间内都不会失效,20年前他们遇到的困难,现在同样如此“。 这些可能是很常识性的原则,但是大道至简。了解这些设计原则,并举出说明,力图提高自己对设计感觉的把握能力,设计小白,勿喜轻喷。

1.当看一个页面时,它应该是不言而喻,一目了然,自我解释的,糟糕的设计是大而全,什么都往里面放;


老版本12306


新版本12306

12306改版前后相信大家一眼都能看出,改版之后把最重要的车票查询放到中心位置,去除了一些无用的展示,整个界面清爽了很多,用户进来就能锁定中间车票查询。

2.永远不要让用户花时间去思考某个东西是否点击,所以链接和按钮应该明显;


上图中某行APP中财富,转账等按钮,底色是蓝色,按钮是白色,第一时间我考虑这些按钮是否能点击,同时我第一感觉是否欢迎词也能点击(傻笑脸)。

3.命名不要自以为很酷或者自以为很聪明,应该是显而易见的;


某音频APP,有个功能叫一键听,相对于旁边的经典必听、每日必听,刚看到这个按钮的时候真不知道里面是什么内容


4.如果不能做到让一个页面不言而喻,那么至少应该让它自我解释,比如一些复杂界面或者新功能,需要做简单的解释说明;


此处可以添加咕咚设备了,好的跑渣知道了


5.尽量利用习惯用法,习惯用法能让人瞬间理解,所以应该多研究主流产品的设计,找到用户的习惯用法;


微信电话本拔号功能仿照苹果系统的拨号设计

6.设计创新要慎重,因为大部分创新可能是重复造轮子,如果想要对已有的习惯进行创新,那么一定要确认这是更好的,更实用的;


大部分APP的首页都是搜索+功能块+banner设计,当设计一款新APP的时候,如果不知道如何布局,可以直接参考,因为用户习惯了

7.越重要的部分越突出,比如标题字体更大,更粗,颜色更特别,旁边有更多空白;


上图中公司名称,图片,面试评分分别加粗,放大,颜色显示用以突出重要性

8.逻辑上相关的部分也在视觉上相关,比如可把相近的内容分成一组,放在同一个标题之下;


飞猪APP中免签落地签、高星酒店控等放在旅行主题下

9.逻辑上包含的部分在视觉上进行嵌套中;


去哪儿APP首页中酒店和包含关系的特价酒店、海外酒店用同一种颜色在视觉中达到嵌套效果

10.把页面划分成明确定义的区域,这样可以让用户很快决定关注页面的哪些区域,或者跳过哪些区域;


网易云音乐把音频分为知识技能和商业财经等模块


11.明显标识可以点击的地方,可以点击相当于视觉扫描的线索,比如用户需要关注哪些地方可以点击,某种形状,某些位置,某些格式;


在这款小区APP中,设计中把开门按钮设计成钥匙形状并且颜色上凸显出来,点击开门按钮就可以直接开门。

12.降低视觉躁声,比如眼花缭乱,组织不当,太过密集等;


APP由于屏幕比较小,摆放内容有限,但是当web界面有大把面积给到设计师充分发挥的时候,结果是我有密集恐惧症

13.为文本设置格式,以便扫描,比如使用标题,保持段落简短,和使用符号列表,突出关键词等;


加粗的标题和简洁的段落,看起来干净

14.必要的帮助和支持,提供简短,及时,不会错过的帮助和支持;


某车APP进入之后,有个toast提示新的改版功能点

15.欢迎词必须消灭,欢迎词就像闲聊,内容无所谓;



某车APP欢迎词占用了大量空间,好奢侈~

16.不要忽视导航的用途,导航帮助我们找到想要的任何东西和告诉我们现在身在何处;


除了传统意义上的类目导航,天猫对于商品详情页,还设置了页面目录,把过长的详情页拆分成几大块,以卡片的形式展示,方便用户选择,这个有点赞

17.让一个返回主页的按钮始终可见,让用户无论迷失到何种地步,都能重新开始;


APP设计中,当界面下拉很深的时候,支持点击返回到顶部,京东有为什么天猫没有鸭?

18.喜欢搜索的用户比喜欢浏览的用户更多,除非界面非常小,否则每个页面都应该有一个搜索框或者搜索页面的链接;


电商网站除了支持在首页搜索之外,还支持在店铺内进行搜索

19.每个页面都需要一个名称,就像每个拐角都应该有一个路牌一样;


从淘宝进入天猫超市之后的界面,对于电商APP来讲,信息量在大,空间在不够用,在顶端还是有显示天猫超市的页面说明。

20.一个网站应该有一个 个性、生动、还有点俏皮的口号;


keep的口号,让我对生活充满的敬畏和期待


21.没有简单的正确答案,良好的、一体化的设计能满足需要,也就是说,经过仔细考虑,实现和测试的设计就是好设计,如果有争执,那么就让做一个可用性测试;


一个可用性测试过程

22.让用户感受到设计过程是花了心思的;


乐刻APP开屏时显示乐刻用户的照片和视频,让用户的参与感更强(上图用户正面比背影更帅,这个我知道)

23.好的设计需要有良好的反馈,促进设计者能够不断的改进;


Boss直聘中,对于公司信息展示,让用户评判是否有用

24.好的设计需要减少用户操作


网易云音乐截屏后系统自动弹出图片分享渠道,网易比别人更懂我一步


25.知道用户可能有哪些疑问,并且给予解答;


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

推荐阅读更多精彩内容

  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 171,418评论 25 707
  • 用两张图告诉你,为什么你的 App 会卡顿? - Android - 掘金 Cover 有什么料? 从这篇文章中你...
    hw1212阅读 12,680评论 2 59
  • 下面的原则对于有效的用户界面的设计和实现都是最基本的,不管是针对传统的图形用户界面还是针对任意的可联网的智能电子设...
    arlene112阅读 2,285评论 0 16
  • 文/儒行道心 ➊ 今天我在图书馆正学习着,突然朋友小A给我发来微信: 真无语,大学第一次逃课,就被老师抓个正着,也...
    儒行道心阅读 698评论 5 2
  • 清明小长假三天,天气都比较凉,今天最后半天,眼看着气温升高了不少,再不出游,假期就结束了。 我催促老公吃了午饭赶紧...
    百合小香阅读 269评论 1 6