总结七大设计原则,打造高素质的UI界面

虽然好设计的原则是老生常谈,但是我们还是要经常总结,结合自己的设计,三省吾身。


虽然好设计的原则是老生常谈,但是我们还是要经常总结,结合自己的设计,三省吾身。

总结七大设计原则,打造高素质的UI界面

我们的世界正在快速的数字化,这也是为什么UI界面在近10年来一直都是热门话题;同时,这也意味着,作为设计师的我们比以往任何时候都要专注打造高素质的UI,以及让用户欲罢不能的用户体验。我们需要好的UI和优秀的设计。

我们一直在追求好设计,优秀的设计,让人难忘的设计,能够脱颖而出的设计。我们相信设计是有迹可循的,有成熟的、可考量的标准来衡量,它甚至可以作为我们设计的方向而存在。

从网站到手机,从家用的恒温控制器到汽车的控制面板,所有的这些UI构成了我们的日常数字体验。越来越多的屏幕和日渐庞大的数字化内容,使得我们对于优质的UI设计越来越渴望。

1、简单

总结七大设计原则,打造高素质的UI界面

优秀的UI界面是隐形的,华丽的装饰和不必要的元素都已经被剔除,简单直接的页面逻辑和直观必要的元素构成了这样的UI界面。设计UI的时候,你在添加任何元素的时候,都最好问一下自己“这个功能是否会影响用户现有的任务?它是否真的必要?”先将你的UI内的元素限定为必须的,专注于核心的用户体验。

如何设计一个简单的UI界面,Maaemo 的产品在这方面就做的很突出。这个挪威餐厅的网站上,你看到的是预订的表单,其他次重要的内容被隐藏在汉堡菜单当中,避免引起混乱。用户不用浪费时间去来回浏览扫视,直接进入预订的环节。

2、清晰

清晰应该是所有UI界面都具备的基本属性。请记住,你的UI界面存在的目的是让用户能够更便捷地同你的系统进行交互,为此,它需要能够清晰地同用户进行沟通,如果用户无法弄明白界面的使用,会因此感到沮丧。

保持清晰的UI界面设计并不难,首先要保证一点:按钮和操作的标签文字指向性要明确,保持清晰的信息传递,让用户能够快速弄明白交互的指向性。

这个时候,你也别忘了开头的“简单”的原则。尽量不要在UI中使用冗长、复杂、难以记住的文本标签,你的用户不会花费时间去读,也不会去欣赏它们,越复杂越“独特”,就越会影响整体的用户体验。

一个词能解释清楚的事情,千万不要用更多的语言去表述。保持简明能够让你的界面更加清晰,节省用户的阅读时间,降低认知疲劳。可能精简出直观又易于识别的文本很难,但是做好了是很有价值的,对于整体体验的加分很多。

3、一致

不论是哪个设计师,都会希望自己的设计能给用户带来一致的体验的吧?一致的设计能够让用户对于你的设计模式更快认知、熟悉,并且在此基础上快速适应整体的体验。人们渴望规律,追求一致性,也希望在实际操作中验证自己所“发现”的一致性。

所以,用户是期望借助自己习得的经验,来探索更多的内容的,而探索能否有效就得看设计的一致性是否够好了。在整个UI设计中保持一致的语言、布局和设计规律,整个用户体验会显得更加“通透”。

4、熟悉

总结七大设计原则,打造高素质的UI界面

用户体验设计的一个重要的目标是要让用户能够凭借直觉来操作UI界面。那么,怎么才能让用户更加“直觉”地完成交互呢?用户要能够自然地理解其中的内容,操作自然就不难了,也就是说,你要让用户对你的界面产生“熟悉感”。所以,你要充分利用用户对于你的设计所熟悉的部分。

当用户对UI界面抱有熟悉感的时候,通常意味着他们对于这个设计有所了解,甚至知道怎么交互,他们明白操作之后大概会发生什么,也知道哪些事情不应该做。所以,如果你能利用好用户对于交互和界面模式的熟悉来进行设计的话,能让你的用户更快上手操作。

汉堡图标就是这样的典型。现在当用户看到汉堡图标的时候,就会明白这代表着菜单。当用户在界面中找不到预期的功能或者服务的时候,会主动地寻找汉堡图标,希望能在其中找到需要的东西。

Born Shoes 这个网站也充分利用了这一点,将熟悉的图标放在熟悉的位置,用户上手就知道怎么用了。

5、视觉层次

总结七大设计原则,打造高素质的UI界面

UI界面的视觉层次是非常重要且常常被忽视的一个属性,它能够帮助用户专注重要的内容。如果你想让界面中每个内容都看起来很重要,那么只会单纯地让信息过载,让每个元素都分摊用户的注意力,最终只会让整个设计显得混乱不堪。不同尺寸的字体、不同的色彩和不同的控件最终应该是相互搭配,构成层次,有轻重缓急地呈现给用户,将复杂的结构简单化,帮助用户完成任务。

Budnitz Bicycles 的网站就很好地使用色彩营造出视觉层次,吸引用户关注到网站的特定部分。网站中的按钮在整个设计中显得非常显眼,引导访客点击。

6、高效

总结七大设计原则,打造高素质的UI界面

你的UI界面最终的目标是要带着用户完成任务,达成目标,或者去他们要去的页面。不同的流程要求不同,但是最优秀的UI设计有个共通的特征:高效。提升界面效率最有效的方法是进行任务分析。

熟悉用户的流程,了解用户的目标,然后在此基础上尽量简化流程,使得用户能够便捷快速的达成目标。在此过程中,仔细考虑每个功能细节,规避可能存在的漏洞,帮助用户快速完成用户流程。

Mulberry 在他们的活动页面上提升了用户效率,帮助用户更快地挑选节日礼物,降低繁复的搜寻和思考过程。

7、响应

UI界面响应牵涉到体验的方方面面。首先,UI界面的响应应该是迅速的,它背后的整个系统应该能够快速反应,否则不够快速的响应会让用户感到沮丧,缓慢的网页加载过程会令人抓狂。

事实上,如果你的网站没有在3秒内加载完成,就会开始有访客因此而流失。根据 Kissmetrics 的统计,超过40%的访客会在加载速度超过3s之后而离开,而加载时长的增加,更多的用户会随之离去。

此外,UI界面的响应是否合理,是否足够“人性化”。当用户点击界面元素的时候,用户希望知道他们的操作是否成功,而这个时候,合理而快速的界面反馈就显得很重要了。比如,当用户点击一个按钮,按钮的状态变化,又或者界面加载时的加载进度条,都能够让用户明白状态的改变,以及他们操作的结果。

界面的合理响应让UI更为富有人性,减少错误的发生,并且让交互进入真正良性的循环。

 

原文地址:webdesignerdepot

原文作者:SAMELLA GARCIA

翻译:@陈子木

译文地址:http://www.uisdc.com/7-key-attributes-ui-design

原创文章,作者:Catherine,如若转载,请注明出处:https://www.iamue.com/25247/

(0)
CatherineCatherine
上一篇 2017-05-11 04:10
下一篇 2017-05-11 06:15

相关推荐

  • 经验分享丨赶集App中秋节的皮肤设计

    随着移动互联网的迅猛发展,同一款产品,使用移动端的用户远超PC端,为了更好的提升APP的用户体验,情感化设计也得到了越来越多的关注,通过它来唤起用户共鸣,带给用户愉悦的心情。

    2017-04-30
  • Adobe放大招!Sketch有的功能都上了!

    (本文内容来源知友:不知语冰,感谢~)关于 Photoshop的UI-DNA工具很久就有传闻了!昨天据MICU了解,这个强大的工具终于开放测试啦~~虽然说很多设计师比较推荐sketch,可是这回了不得!sketch有的功能,PS都能实现了!也许有很多同学还不太了解 UI-DNA 是个什么样的工具,说白了,就是 Photoshop 上拥有更强大的属性编辑功能。现在来说说UI-DNA都有神马强大的功能。打开Photoshop 中的UI-DN...

    2018-03-02
  • 达内UED高薪喜报|4个月拿18W年薪,他是怎么做到的?

    达内UI设计,中国UID课程标准制定者世界上最让人心动的情话,不是我爱你,而是买!买!买!在过去的双11,你买爽了吗?或者给你另一半最真的爱“清空购物车”了吗?但是,如果你的口袋瘪瘪的,每一笔钱花的都要精打细算,你怎么给另一半带去精致的生活呢?一个月挣3000,你怎么节约也只有3000,一个月挣2万,你花掉1万,还有1万,一个月挣30万,你花掉1万,还有29万,所以不要把脑细胞浪费在天天怎么节约,一定要把心思花在,怎么赚钱、怎么开心、怎...

    2018-01-31
  • 交互设计师的60日计划之第三天

    此次分享的 [button type="info" text="交互设计师的60日计划" url="https://www.iamue.com/tag/interaction-designers-of-60-days" open_new_tab="false"] 来自 Killa.G 让我们一起跟着学习和并学会做自己的总结与…

    2015-08-20
  • 为什么职场上的印度人总比中国人混得好?

    目前为止我还未有机会到过印度。身边去过的人有大致两边倒的两种观点,一种是这是一个思想自由的国度,人们开心知足、与世无争。一种是这是一个脏乱差效率低下的地方,一条公路几十年也修不整齐。我无从判断,因为每一种观点都主观。有一位曾经生活在帝都的印度女记者倒是写过一本比较中印差异的书叫《烟与镜》,值得一读。因为工作和学习的关系,我与很多印度人一起共事或者正在共事,有的只能算是点头之交,有的成为了挚友。1先说一件趣事,多年前,我没有与印度人近距离...

    2018-03-16
  • 课程论文 | 基于用户体验的购物车再设计

    引言PAGE1随着我国经济水平的增长,人民生活水平的不断提高,越来越多的消费者选择去大型超市购物消费,大多数城市居民都养成了定期光顾超市的习惯,把购物同休闲结合起来。体验经济的到来,越来越多的消费者开始关注购物本身是否能带来愉快的体验,这样的体验超出了纯粹的购物,而成为光顾超市目的的一部分。因此,购物不仅仅是出于购物的需求而且还为了获得愉快的体验。而购物车与消费者的购物体验紧密相连。购物车的使用体验对消费者的购物体验影响很大。现有购物车...

    2018-02-13
  • 美国|四大艺术院校交互设计解析,不要等毕业后才发现读了个假的专业

    今天的主题是交互设计,有同学希望了解美国开设此类专业的院校,并获取各个院校的教学内容侧重方面的信息。于是,康石石选择了美国四所具有代表性的院校为同学们进行介绍:艺术中心设计学院(ACCD)卡内基梅隆大学(CMU)纽约视觉艺术学院(SVA)普瑞特设计学院(Pratt)一、艺术中心设计学院(Art Center College of Design)交互设计:本科ACCD交互设计专业只开设本科阶段课程,学习时长8个学期。尖端的课程设置,旨在培...

    2018-05-07
  • 移动端UX设计9条黄金法则

    在设计移动端APP的时候,最重要的事情就是要确保APP的可用性和易用性。如果一款APP可用性很低,没有什么实际价值,用户没有任何理由去使用它。如果一款APP是有使用价值的,但是需要用户花上大量的时间去学习如何使用,用户也不会使用。

    2017-05-21
  • 5个2016年UI/UX设计趋势

    随着“响应式Web设计”以及“Google提升移动友好性设计” 持续升温,在过去的一年开始流行的一些UI/UX设计趋势,将会在新的一年里继续流行下去。鉴于此,我总结了一下在2016年仍会持续大热的一些UI/UX设计趋势。

    2017-05-26
  • 「确定」和「取消」按钮哪个该放在左边?

    永恒之战 “确定/取消”党与“取消/确定”党在这场旷日持久的按钮排序之战中,各执己见,至今未能统一。 “确定/取消”党的见解: 符合自然说话/阅读习惯。日常生活中当我们提出问题并伴随肯定与否定的选择时,往往会这样…

    2015-12-10