ui设计间距规范,ui设计的基本规范

UI设计有哪些规范

1、图标规范 很多设计师以为ui设计就是设计图标和设计界面。虽然事实并非如此，但图标的设计在整个ui设计中是比较基础的一个环节。

2、基础规范 基础规范我划分的是组成页面最小的元素、是最基础的一步。基础规范有文字、颜色、布局层级、图形、分割线等。组件规范 组件规范是由两个元素组成，且可点击的控件。

3、颜色标注规范。文字的颜色已经归类到文字属性里面，不用重复标注。颜色标注内容有：分割线颜色、背景色、按钮颜色等等。建议使用公司或品牌原有VI配色，可提高公司或品牌VI之间的关联，增加可辨识性和记忆性。

UI设计规范

1、坚持以用户体验为中心设计原则，界面直观、简洁，操作方便快捷，用户接触软件后对界面上对应的功能一目了然、不需要太多培训就可以方便使用本应用系统。

2、颜色标注规范。文字的颜色已经归类到文字属性里面，不用重复标注。颜色标注内容有：分割线颜色、背景色、按钮颜色等等。建议使用公司或品牌原有VI配色，可提高公司或品牌VI之间的关联，增加可辨识性和记忆性。

3、安卓手机ui设计尺寸规范 众所周知，安卓系统是开源的，国内又有超多的手机厂商，小米、魅族、华为、oppo、三星等，每一个品牌有属于自己的UI设计规范，但是我们主要分析UI界面尺寸规范。

UI设计规范详解,一起来看看!

安卓的界面规范就讲到这里，要明白设计界面规范的意义是确保设计的统一性与合理性，规范维护的是项目的统一，为了项目利益最大化，高效化。所以作为UI设计师的我们，如果一点设计规范不遵守，全靠自己想当然，那就别发给前端人员啦，他也看不懂。

. 定最小单位 先定义最小单位，单位越小页面越紧凑，目前常用比较多的有，4，5，8，假设我们最小单位是4为倍数，那我们所有的间距都按照8的倍数递增，得到间距规则，8，16，20，40，60。

o让你的图标更加规范 o对图形结构理解更加深刻 o后期更改形状更加方便 3 独特的风格 在做系列图标的时候，一定要在前期给图标设定一个风格及原则，使之看起来与众不同。

UI设计的规范标准有哪些呢？轴 轴在UI设计中是最基本、最常见的概念，也是用来组织界面结构的重要核心。简单说来，轴是在设计的时候组织一系列元素的假象线，在下面的设计图中，轴以虚线的方式被标注出来。

并且需要根据基本规范进行后续的设计工作，尽可能做出和基本原则比较匹配的UI设计。

一：遵循一致的准则，确立标准并遵循 无论是控件使用，提示信息措辞，还是颜色、窗口布局风格，遵循统一的标准，做到真正的一致。

8pt网格:使用Sketch进行UI设计的一致间距

1、首先请设置网格基数。我平时使用8px / 16px / 24px / 32px / 40px / 48px / 56px等间距设计原则来分隔元素（如果需要更紧密布局时，也会使用4px）。

2、意思是：如果你用8作为设计的最小单位，你可以很方便的缩小的你的设计尺寸，8/2=4，4/2=2，2/2=1。如果你从10开始，你缩小到的网格单位可能是5像素，在往下是25像素。

3、比如你确定默认字体大小为 20px， 行距为 5，则行高 = 20px * 5 = 30. 那么控件之间的上下间距则可以设为 30px 的倍数，比如 30px， 60px， 90px， 以此类推。间距和行高相同可以使页面看起来更加和谐美观。

4、通过在网格上以8的倍数进行UI设计，可以保持设计的一致性。所有内容都与我们定义的间距约定完全一致。去掉线框通常，用于分隔内容的线框可以用空白代替。

5、定好了规则就应该遵守。比如卡片之间的间距我使用的最小尺寸8，那后面所以的卡片间距我都应该使用8，就不要出现卡片间距有8，有12这种情况。

6、第五步，使用位图和创建遮罩 有时候我们需要导入一些位图到我们的工作项目中，虽然sketch是一款矢量工具，但对于位图的基本处理也是非常棒的。首先选择image工具，在弹出的窗口中选择一张你要导入的图片。

标签：规范设计间距基本ui