UI设计中的10条经验法则

  • 日期:02-02
  • 点击:(1641)


例如,如果我们设计一个大小为200x50dp的按钮元素,它将在160ppi的屏幕上显示为200x50dp,在320ppi的屏幕上显示为400x100px,即原始资源的两倍。

有些屏幕的每英寸像素比其他屏幕多,但是设计资源在每英寸高像素的屏幕上不会显得更小,因为这些屏幕将以原始大小的2、3和4倍呈现。这种机制可以确保所有设计资源在不同密度和设备之间保持相同的大小。

例如,苹果XS的屏幕大小是414x896,但这不是像素大小,而是点数,1242x2688px像素。考虑到这一点,在设计苹果手机XS马克斯时,我将设计414x896,然后交付

3倍的设计资源。

2。充分利用8dp增量

为什么设计中要使用8dp?这里有一个简单的解释:我们使用神奇的数字8而不是5的原因是,如果设备的分辨率是1.5倍,就很难进行分频和锯齿处理。

此外,大多数屏幕尺寸可以被8整除,这使得我们很容易在这些屏幕上调整我们的设计。

还通过在8点网格上以8个增量进行设计,使设计更加统一。设计师无需更多猜测就能快速做出决定并实现完美的适应。

要更全面地理解这条规则,请参阅布林杰克逊的8点网格文章(文章链接在 . FM/species/8-pt网格中)。

3。断开连接并在

处加边框设计时,您应该不时停下来看看设计的容器是否会使用户界面混乱。一般来说,用于分隔内容的框和行可以被空白替换。

当我们过去设计时,我们喜欢把元素放在盒子里。因此,只有移除这些框,页面才能看起来不那么密集,给元素更多的喘息空间,整个界面才能升级到一个新的水平。

4。注意对比度

适当的对比度不仅可以让用户看到页面上的相关信息,还可以提高产品的可用性。

设计产品类似于建造公共建筑,如图书馆或学校。它需要容纳所有人:盲人、色盲或视障用户。

网络可用性标准(WCAG)()要求对比度至少为4.5: 1。

为了确保您的设计符合标准,建议下载一个名为“斯塔克()”的插件来检查设计是否正常。

5。遵循用户习惯

一些元素被认为是标准的原因有很多。

例如,如果按钮被设计成圆形,当文本需要为“免费试用”时,按钮将占据不必要的垂直空间。

此外,用户已经开始期待类似的产品体验。如果你设计的网站、应用和软件与用户习惯的不太一样,那么它就不直观,用户可能会对体验感到失望。

因此,在现有设计规范的范围内进行创新比重新发明轮子要好。

6。构建颜色深浅不同的层次结构

每种颜色都有视觉权重,这有助于在内容中构建层次结构。通过使用颜色的深度,元素被赋予不同的重要性。

这里的经验是,如果一个元素比另一个元素更重要,那么它应该具有更高的视觉权重。这使得用户很容易区分重要和不重要的信息,从而快速浏览页面。

越来越大、越来越引人注目的信息首先会吸引用户的注意力,然后再看下面的次要信息。

7。避免使用两种以上的字体

一个普遍接受的设计共识是,同一界面中使用的字体数量应该受到限制。一般来说,两种不同的字体就足够了。这并不是说不能使用更多的字体,但最好有一个合理的理由,否则最好不要使用它们。

解决这个问题的方法是使用字体系列。

选择字体时,优先选择各种粗细的字体,如细字体、标准字体、中粗字体、粗字体、超粗字体、宽字体、扩展字体和斜体字体。这将给你更多的空间来玩,而不需要添加额外的字体。

8。直接而不是让用户思考是产品设计的好策略,因为用户为什么要思考?

checkout页面、电子邮件收件箱、搜索历史记录、后退按钮等。都是很好的例子。

在付款页面上(如果设计好的话),我不需要记住我买了什么,我可以清楚地识别我想买什么,而不需要回忆它。

Search History

在我的Gmail收件箱中,我可以不假思索地确定我读过哪些电子邮件,哪些没有读过。或者,如果我登录亚马逊,我可以继续快速阅读我以前去过的地方,因为它可以告诉我最近看过的东西。

"通过使对象、动作和选项可见来最小化用户的阅读压力。用户不必记住从对话的一部分到另一部分的信息。在适当的时候,系统指令应该是可见的或易于搜索的。”纳尔逊诺曼

9。不要让用户慢下来

对于用户来说,速度和效率是唯一重要的事情。用户使用应用程序的目的是解决他的问题。

“我想更快”瑞奇鲍比

如果它已经完成了很多丰富的功能,那很好,但是不要让你的创造力干扰我作为一个用户的目标。

动画和微交互的经验法则是,如果体验增加了不必要的时间,就不能真正改善体验。

有目的地使用动画可以改善体验,但添加不必要的干扰和移动元素不会。

我经常在Dribbble上看到登陆页面设计。当用户在页面上滚动时,页面将会移动。它通常过于活跃,一切都在移动,但内容本身却被忽略了。作为一个用户,当界面上发生这么多事情时,他们很难注意到任何事情。这纯粹是浪费用户的宝贵时间。

对不起,叫你出去玩吧(DribbbleUser

大量研究发现界面动画的最佳速度在200到500毫秒之间。这些数字基于人脑的特殊品质。任何小于100毫秒的动画都是瞬时的,根本不会被识别。然而,持续超过一秒钟的动画会给人一种延迟的感觉,让用户感到厌烦。“在UX正确使用动画的终极指南

所以,如果你使用动画,一定要有目的。如果这些动画是有目的的,那么不要让我等超过500毫秒。2019年,骚扰用户只需一毫秒。

10。“少即是多

每次我们想给:页添加更多信息时,按钮、文本、图像、动画、插图等。它将与相关信息竞争。如果页面上有太多内容,元素的重要性就会降低。

一个完美的例子是着名的谷歌主页,而不是像雅虎那样淹没访问者可能不需要的信息。设计仍然集中在核心任务上:搜索。

对不起雅虎,我不得不这么做

我最喜欢的设计准则之一是:“完美,不是因为没有要添加的东西,而是因为没有要减少的东西。《安东尼德圣埃克苏佩里》。如果你有任何收获,请尽情地做广告和观看。谢谢你。)

原件:设计。CC/10-用户界面设计中的经验法则-AA5F

Author:Danny Sapio

Translator:Caiyunsky

本文已在作者的正式授权下翻译

授权截图已返回搜狐获取更多信息。