设计语言是一个庞大的设计系统，包括字体、网格系统、颜色、图形等。很多初学者在做移动终端的时候，往往对各种设备的界面尺寸和系统设计规范都不是很清楚，心里也没有清晰的概念。在本文中，我们将揭示有效UI设计规范的黄金规则，从排版开始，指导您的UI设计过程。
规则1.不超过三种主色
毫无疑问，颜色会对设计产生很大的影响。但这并不一定是关于它们有多漂亮。说到UI设计，颜色通常是我们最喜欢的东西之一，它在创建设计系统时扮演着许多不同的角色。 •选择你的颜色
推荐格式：
广告语言颜色(也是主要品牌颜色)
中性浅色(适合文字较多的内容)
中性深色(更适合UI元素和深色模式)
•创建调色板
一般来说，稍浅和稍暗分别被视为10%的额外白色和10%的额外黑色。完成后，印刷风格的副本将显示在每个画板上。
•检查对比度水平
接下来，我们需要检查我们的颜色，以获得最佳的颜色对比度。Pixso是一个在线协作设计工具，可以在一个文件中检查所有的设计草案。
规则2.关于可读性和可读性
优秀的排版可以归因于可读性和可读性。在设计系统中，字体大小、行高、段落间距和字母间距的设计应提高可读性和可读性。
•字体大小
WCAG根据全球咨询网联盟发布的WCAG 2.0，Web内容可访问性指南定义最小字体大小为18pt。注意视觉水平以及如何将自己与摘要文本进行基本大小。
接下来，选择字体。现在，你可能会注意到一些字体是18px<p>和22px<h3>它似乎没有什么不同。这里有两种选择：调整字体大小，或考虑使用不同的字体作为标题。
•行高
为了达到良好的可读性，最佳行高可以保证文本行之间有足够的间距。行高应该是字体大小的1.5倍。因此，在您的UI设计工具中“Line“(或类似)只需将字体大小乘以-至少-1.5。例如，如果文本为18px，则行高需要为27px(18*1.5)。
•段落间距
段落间距(或文本间距)与行高相似，magic multiplier是2x(意思是字体大小的两倍)。例如，如果字体大小为18px，则在进入下一个文本块之前应该有36px的空间。
•共享风格
如果您的UI设计工具支持（Pixso支持创建风格），将这些布局转换为“本地组件”，以快速重用，并确保视觉一致性。
规则3.CTA按钮需要层次结构
CTA按钮的大部分用途是引导用户采取行动——点击并传达视觉层次结构。
•尺寸
在创建多尺寸按钮时，保持文本大小比例逐步变化。建议传统按钮文本为18px（与文本相同），但大小有三种变化：
正常:44高像素(圆角:5像素)大:54高像素(圆角:10像素)超大:64高像素(圆角:15像素)
这样，我们就可以强调一些按钮，而不依赖颜色，我们也可以嵌套按钮(例如，在最小的表单字段中使用按钮)。
•阴影
阴影应该用来增加深度，所以建议互动。所有按钮和表单域变体的单一阴影风格都很好——不需要任何花哨的东西。
•交互性
每个按钮类型都需要一个变体来指示其停止状态。这向用户解释说，它可以点击交互状态，以促进用户的进一步深入使用。这实际上是创建设计系统更复杂的地方之一，因为创建状态时最常用的是改变按钮颜色的风格。
规则4.统一设计系统
设计系统决定了各种风格的应用程序规范。例如，什么样的文本风格可以用来强调功能，什么时候需要左对齐，什么时候需要中间对齐。设计系统不是一次性任务，应在实践中不断更新和优化
规则5.设计元素必须一致
将设计元素转换为组件有利于重复使用，从而帮助我们加快工作流程，保持整个设计的一致性。组件可以节省很多时间，设计师可以更有效地创建和重用组件，而Pixso可以随意切换组件的各种状态。
以上是优漫教育小编为您介绍的“[UI设计培训]：UI设计规范的黄金设计规则相关内容，学习UI设计培训，您可以参考优曼教育提供的UI学习路线。学习路线包括PS软件介绍、人工智能和品牌设计、视觉表达技术、网络视觉设计、图标设计、产品交互、移动终端设计等。根据优曼提供的UI学习路线图，您可以清楚地了解您需要掌握的知识 ！
湘公网安备43019002002199
