初学者的5个关键UI设计原则

用户界面设计使我们能够与数字产品进行通信和交互,无论是单击按钮以提交表单,还是滚动浏览照片库。

一个伟大的UI设计是用户甚至没有注意到的,但它为他们创造了一个无缝的用户体验。糟糕的用户界面可能会造成挫败感,并导致用户放弃产品。

既然您知道为什么拥有用户友好的界面设计很重要。下面介绍了如何创建一个。

每个设计师在创建高功能用户界面时都会牢记一套原则和准则。了解这些设计原则是改进设计并确保在设计领域取得成功的关键。

以下是您下次坐下来设计时需要牢记的5个关键设计原则 -

1. 清晰度

界面旨在使用户更轻松。如果用户不了解如何在界面中导航,它将失去其所有目的。

保持设计整洁,避免使用按钮和其他分散注意力的元素,如果它们不能为用户服务。提供清晰的CTA和反馈,以便用户确切地知道发生了什么。

2. 一致性

如果有一件事可以让你的设计看起来一眼不专业,那就是缺乏一致性。

使用类似的设计元素使您的设计看起来完整并紧密结合在一起。使用相同类型的图标进行导航,并坚持使用配色方案以保持设计一致。

专业提示:使用图标包来收集一系列很酷且一致的图标,以便在您的设计中使用。这是我建议的一个 - evericons.com

3. 色彩理论

颜色比我在整篇文章中所能解释的要多得多,所以也许我会写另一篇文章来详细讨论这个问题。但就目前而言,让我们坚持基础知识。

关于颜色,您需要了解三个术语:色相、饱和度和值。

色调

色调只是自然状态下的颜色,其亮度或暗度没有任何变化。例如,红色、蓝色、绿色等。

请参阅此图像以更好地理解?

饱和

饱和度是指颜色的强度。较低的饱和度意味着暗淡的灰色,而较高的饱和度意味着更明亮和鲜艳的色彩。

价值

现在让我们讨论一下价值。颜色的值是指每种颜色的明度或暗度。值为 0% 表示白色,而值为 100% 表示黑色。

创建配色方案

好的,既然您已经了解了这些术语,那么您需要知道如何和谐地使用颜色来为您的设计创建一个漂亮的配色方案。

下图解释了将颜色与和谐相结合的不同方法

60-30-10法则

作为初学者创建配色方案时,一个好的经验法则是选择三种颜色。

选择其中一种作为主色/原色,并将其用于60%的设计。

选择次要颜色并将其用于30%的设计。

剩下的第三种颜色是您的主题色,用于需要立即注意的CTA和元素。

4. 排版

几乎90%的网站,Web应用程序或移动应用程序都是排版。因此,可以说它是用户界面中最重要的元素之一。

以下是像专业人士一样使用排版的一些提示 -

A. 字体配对

使用许多字体会使设计看起来杂乱无章且不专业。开始时,在整个设计过程中仅使用一种字体。但是,如果您足够自信,请将字体数量保持在最多两种。

将不同类型的字体相互配对以创建对比度。例如,对标题使用衬线字体,对段落文本使用无衬线字体。确保选择更易于阅读的字体。

B. 线高

在使用排版时,请记住给它一点喘息的空间,并适当使用空白。

对较小的文本使用较大的行高,对较大的文本使用较少的行高。

C. 字体粗细

使用不同的字体粗细来区分不同的文本元素。请记住,对比度是出色的 UI 设计的关键。

一个专业提示是跳过一个重量。例如,使用“常规”和“粗体”、“中”和“额外粗体”等。

但请记住,相同的颜色在较薄的权重上可能看起来更浅,而在较厚的权重上看起来更暗。

5. 层次结构

层次结构对于让用户知道在哪里查看以及什么很重要非常重要。

可以通过多种方式创建层次结构。这里有一些 -

A. 颜色

您可以使用颜色通过以下两种方式之一创建层次结构 -

我。对较重要的元素使用较深的颜色,对不太重要的元素使用较浅的颜色。

ii.使用主题色使某些东西流行起来。它最需要用户的关注(即使它的尺寸较小)。

B. 排版

这对许多人来说似乎是显而易见的,但很多初学者并没有考虑太多。

字体大小越大越粗,看起来就越重要。

按钮中的层次结构

如果您想添加一些内容以使本文更具信息性,欢迎补充分享。


首页 > 新闻资讯

留言