你知道的UI设计法则有哪些
新闻来源：优漫教育
日期：2021-08-13
作为一名合格的UI设计师，除了高超的技术能力之外，其对用户的心理分析能力也十分重要。因此，哪种设计是大多数用户喜欢并且乐于接受的呢？如何设计才能将用户和产品紧密联系在一起？UI设计培训学校小编今天就来和你探讨一下。
一、网页的视觉构成若干主要元素。
对整个页面进行视觉设计时，可以将多个核心视觉点分开，分别罗列出来。例如在一系列网页设计中，我们可以把它理解为几大核心点，如：版、质、形、色、字。版面-版面和格子，版面间距将直接影响版面的张力和空间感–版面风格，肌理维度，整个产品视觉调性形–大面积区域的形状，控制尺寸比例，图形形状的统一性–颜色风格，页面色色，色彩，明度整体风格风格，字体类型-字体，衬线，内容识别性。
与这些核心要素一样，我们可以有意识地练习它，以提高综合的视觉基础能力，但首先，我们需要对它进行理解和梳理。
二、何谓版本？
在界面设计中，版式设计将直接影响用户对该页面的理解能力，好的信息传递离不开科学的组织布局。资讯间层次关系的罗列显示非常重要，恰当的布局，可以直观地将信息间的层次性关系表现出来。而作为网页的核心骨架，是我们最需要练习的部分。
1、亲密。
在这里，我们可以用一个非常简单的语言来表达，即“同类相近，异类相远”，信息联系紧密，间隔相近，性质不同，间隔也要远。说到底，基尼才是真爱。
2、节奏。
韵律类型是指在同一页面内容上，间距不要过多，另外间隔尽量使用倍数，如1X,2X,3X,4X。例如，现在需要设计一个让用户感到轻松愉快的页面，可以使用较大的栅格间隔比例，以12作为基准，例如，这个间隔是12,24,36,48。若资讯较近，可使用8的倍数，如8,16,24,32等，当然。这个也不是绝对的，具体的使用情况，还需要根据业务的实际情况而定。
由人工计算的大小，京东金融应用程序的间隔是4倍，但使用了更大的间隔。在此之前，Airbnb已经用12个单位进行了缩放，不同的格子比例传递了不同的情感。所以间隔没有绝对设定值，而是根据实际情况适当调整。
3、黄金比例。
金子比例是UI设计中较多使用的一种比例，这个比例经过了自然界中各大数据的验证，天衣无缝。而在实际项目中，使用黄比例的作品，往往更具美感，令人愉悦。
除黄金比例外，实际上还有银铂金等比例，这类比例也比较有美感的，相信很多同学都不知道，这里也发出来让各位同学知道下一步的做法，也让大家知道下一步的做法是：黄金比例等比例。
三、何谓质？
质料，是视觉语言构成的重要组成部分，页面的风格特点，肌理的虚实都靠它来表现。产品质地风格应与产品整体形象相一致，是多页统一风格的重要组成部分构成元素。表现力，不仅帮助用户认识和记忆产品特性，更能让产品迅速与同类产品拉开距离，做到与众不同。下面就简单介绍几种常见的风格类型。
风格一：大卡片，轻投影式。
由于微型投影仪在很好的拉起层次感的同时，也可以让页面变得更加精致。类似于苹果的Appstore以及许多其他产品，都采用了这种更好的风格。但是要注意，渐变样式不能太厚，页面留白也要大。
风格二：高纯渐变，分散投射。
最近两年，渐变风又开始流行起来，尽管与先前较厚阴影的渐变相比，新的渐变样式，变得更平更轻量化。渐变风的风潮席卷了国内各大应用市场，比如淘宝、京东金融、优酷、饿了么等主流应用开始纷纷效仿。也不适用于多种颜色同时渐变的配色方案，渐变的两种颜色在一个色系上进行微调就可以了。
风格三：仿制品。
经风平浪静的洗刷后，拟物风仍然保持着原来的位置。当前的轻拟物视觉主流更多的是在平面化的基础上添加一些拟物元素，尤其在汽车、智能家居等物联网系统中。但是相对于传统拟物，现代拟物风变得更加简洁，主层次信息更加突出。利用视觉暗淡，将不同信息的层次关系拉开。
四、何谓形
形体，决定了整个产品线的调性，可以把产品蕴涵的情感文化通过视觉表现传达给用户。不管是圆角的比例，还是图标的统一，都是造型的一个重要部分。和UI界面设计中图形更多地体现在图标和按钮上，这里可以尝试这样做来提高图形的统一感。
icon首先要掌握核心的视觉语言，以比较常见的线性图标为例，其中包括：描边宽、圆角、断点方式、点缀、颜色填充类型、图标重心。这样的话，就是需要标准化的。若您是初学者，对图标这一块并不擅长，可到图标网页如iconfont上找到相关图标进行参考，再根据自己的想法绘制。而图形又是一个非常重要的元素，它直接决定了企业的品牌形象。品牌图形界面设计可以让用户记住品牌形象，让产品迅速抢占市场，提高用户知名度。这就用得很巧妙。淘宝采用了大量的猫头图像，而网易云，则提取了唱片的元素，整个图标风格，都使用了比较圆润的造型。
五、何谓颜色？
颜色，常常是人类在感官留下的第一印象。要合理使用色彩，其实并不容易。事实上，在界面设计上，对于选择配色方案，好像穿上衣服一样，颜色越多越花哨，整个档次感觉越low。和传统的空间设计一样，在大多数的界面设计中，一般使用三种颜色就足够了，除非设计师拥有很高的驾驭能力，否则整个页面看起来比较花哨，影响信息传递。接下来，我们可以使用两个小技巧来帮助你提升配色能力。
设计者在做界面设计时，往往是感性的，常常难以支撑各种质疑。然后利用场景关键字，收集相关图片材料，利用情绪板制作色彩，可以更好地帮助设计师完成对产品情感的理解，同时提高工作效率，使界面设计更符合用户期望，完成产品目标需求。该方案的设计更具说服力，能更好的帮助设计师获得产品视觉设计的主导地位。
事实上在界面设计上也是这样，设计稿的色彩不宜过多，不同的色系最好三种以上。假如对色系不太了解的同学，我这边给个办法，就像当初学画画一样，眯着眼睛就能看出它的主色调。但是如果单个大图案的颜色非常大，同样也可以被认为是一种颜色。
六、何谓字
文字，字体的形状和风格将直接影响信息传递的速度。因此，对于不同的场景，使用不同的字体样式也是至关重要的。所以对于UI设计者来说，理解字体也是一个不可或缺的技能。下面还为大家提供一些小技巧，帮助大家提高对字体的理解。
当进行界面设计时，一定要把内容的可读性放在第一位，然后再考虑其他的风格。基于不同的商业模式，选择不同的字体，能使页面更容易达到用户的心理预期。像衬线字和无衬线字一样，传达出来的感觉也是有较大区别的，一般来说，在需要强调的文字或小篇文字中，使用无衬线字会更合适一些。有些长篇文章中，如果使用衬线体，就更容易读懂。比如在网页设计中，最小的11号字体使用了线体宋体，将会比没有衬线体的微软雅黑有优势。
通过对上述几点的有意识的练习，就能熟练地掌握这些基础知识。此外，除了临摹一些优秀的视觉作品外，UI设计培训学校拿现有产品做Redesign或视觉改版都是比较好的选择。提高自身视觉设计水平，也不能一蹴而就，靠的也是不断积累，不断学习。
