ui设计规范_ui设计规范包括哪些内容

ui设计规范_ui设计规范包括哪些内容

       在下面的时间里，我会通过一些例子和解释详细回答大家关于ui设计规范的问题。关于ui设计规范的讨论，我们正式开始。

1.如何快速制作更有效的UI设计规范

2.UI设计中的标注规范，你知道吗？

3.到底什么是UI设计规范(ui设计规范包括哪些内容)

4.UI设计规范都有哪些

如何快速制作更有效的UI设计规范

       规范制作：(举例子说明下 )

       这里主要以一个iOS设计稿为主，涉及到安卓的话，如果要精准，也时需要2份设计稿和2份设计规范

       这是一个Sketch制作的设计稿。

       我会简单做一个设定

       视觉规范：

       颜色：界面用色／背景用色／文字用色／线条用色

       字号：标题字／正文字／辅助字

       行高

       间距

       有小伙伴有疑问了，上面的色值那个c1／c2的代号是什么意思？

       这个代号主要是为了方便前端开发人员建立UI库，比如，我们设计稿一个间距是20px，可能在开发眼里的20px和他所计算的单位不在一个频道。如果以J2来代号来表达一个间距值，那么不管双方是什么单位，但是至少这个间距大小呈现出来是一致的。当开发问设计人员某个地方间距是多少，你可以直接告诉他是J2,那么开发就会知道，哦，是20dp。

       交互样式：点击效果。

       组件库：元素层：按钮

       组件层：可直接复用

UI设计中的标注规范，你知道吗？

       一、UI标注的规范

        1、尺寸。例如图标、这些内容关于尺寸维度的标注。

       需要注意，比如的尺寸比例，不是固定的它的大小数字，这样开发才能更好的适配，常用的比例有4：3、16：9等。如果控件给出固定的尺寸数值，按钮的宽和高度都标注出来，开发就会写死按钮的尺寸，一旦遇到屏幕有比例不同的时候，按钮还是固定的大小，就会影响视觉效果；

        2、标注文字的字体、字号、颜色、行高和透明度等等。

       这些都要给出一个极限情况的规范，如最多显示几个字符，字符超过极限值就用“...”的方式处理；

        3、间距的规范。

       间距相对比较简单，只要标注清晰就不会有太大问题。但有时候将间距和尺寸混淆。我们可以这样理解为尺寸是容器的大小，而间距是容器之间的距离，所以间距和尺寸有着很大的不同；

        4、颜色标注规范。

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

       二、UI里处理规范：

       除了风格、色调等常规的统一性意外，还要着重注意切图和优化。

       1、安卓系统

        安卓系统切图：

        统一采用Png格式

        部分需要做适配的需要制作.9格式

        安卓系统优化：

        压缩优化

        ICON 可采用PNG 8

        支持完全透明和完全不透明两种效果和256色

        需要高清的可采用 PND24/32

        2、iOC系统

        iOC系统切图：

        统一采用Png格式

        以640/750宽分辨率为@2x输出三套尺寸：@1x @2x @3x

        iOC系统优化：

        压缩优化

        ICON 可采用PNG 8

        支持完全透明和完全不透明两种效果和256色

        需要高清的可采用 PND24/32

        三、UI中的命名规范：

        统一的、规范的命名对我们自己的文件整理有很大的帮助，后期修改文件、图层的时候更加方便快捷。

        并且做好版本管理、文件归档的工作，会提高项目沟通衔接，能更好的为版本管理、文件归档做铺垫。

        比如常见文件包命名规则是：项目名字＋切图＋作者名字＋日期。

        比如常用的英文单词列表：

        bg（backgrond 背景）

        nav（navbar 导航栏）

        tab（tabbar 标签栏）

        btn（button 按钮）

        img（image ）

        icon（图标）

        selected（选中）

        default（默认）

        pressed（按下）

        back（返回）

        content（内容）

到底什么是UI设计规范(ui设计规范包括哪些内容)

       1.尺寸

       我们要将页面上有所需要告知尺寸的内容进行标注，例如图标、、头像等等。关于尺寸维度的标注我们需要注意的是：有圆角的地方，需要将圆角半径标出。

       对于一些控件，如button、列表，一定要随时问自己有没有特殊状态，如按压状态、无效状态、选中状态等等，如果你不标明，开会就会默认没有这些效果。一般情况下，的尺寸是需要告诉比例的，而不是固定的大小，这样开发才能更好的适配，常用的比例有4：3、16：9等。

       所以正确的标注方法是给出按钮两边的间距，让整个按钮的宽度自适应(当然高度还是要固定的),这样不论遇到哪种分辨率的尺寸，都能够保持相同的视觉效果，扩展性极强。

       2.文字

       文字，需要标注文字的大小、字体、颜色、透明度、行高等等，当然也可以和开发进行沟通，对一些内容进行删减。关于文字的标注需要注意的事项：文字有一个很特殊的属性，就在某些场景下，文字是动态的，所以这个时候，就需要将极限情况考虑清楚。

       3.间距

       有人可能会觉得间距和尺寸有些相似，但其实它们有着很大的不同，我们可以这样理解：尺寸是形容容器的大小，而间距是形容容器之间的距离。间距相对比较简单，只要标注清晰就不会有太大问题。

       4.颜色

       需要标注颜色的内容有分割线颜色、背景色、按钮颜色等等。关于颜色的标注需要注意的事项：切记文字的颜色已经归类到文字属性里面，不用重复标注，思路一定要保持清晰。

       以上就是小编关于UI设计中的标注规范的分享，希望对大家有所帮助，想要了解更多UI设计相关内容，请关注本平台，小编会做及时的整理并发布的，大家注意查看哦!

UI设计规范都有哪些

       没有规矩，不成方圆。UI设计也不例外，具有设计规范，系统建议的规范可以让我们设计具有统一性，界面视觉更美观。

       想要高效顺畅地完成设计任务，就必须遵守UI设计的规范。

       今天带来的这些规范，可是成为优秀UI设计师必须知道的"纯干货"，还能让大家深刻了解UI设计规范的本质是什么。

       图标规范

       很多设计师以为UI设计就是设计图标。虽然事实并非如此，但图标的设计在整个UI设计中是比较基础的一个环节。

       图标与品牌标志一样，在设计时都需要做适当的减法，应该尽量用简约的线条去表达其含义，应该尽量避免出现线条结构过于复杂的设计。

       而且整体的图标都需要保持风格一致，例如图标的线条粗细、边角弧度、图标高度宽度比例、风格等等。

       特别是对于新人，所以大家一起来看看图标设计的规范吧：

       1

       像素对齐

       需要严格的做到像素对齐，尤其是在做较小尺寸的图标时，如果不严格的遵循像素对齐，那最终的显示效果就会出现问题。

       2

       多用布尔运算

       在做图标的时候，能用基本图形进行布尔运算的时候，尽量不要使用钢笔，这样做的好处有如下几点：

       o让你的图标更加规范

       o对图形结构理解更加深刻

       o后期更改形状更加方便

       3

       独特的风格

       在做系列图标的时候，一定要在前期给图标设定一个风格及原则，使之看起来与众不同。

       在这里值得一提就是，我们在做线性图标时，一定要保证描边粗细相同、圆角相同，如果这些基础的规则都没有遵循，那也就谈不上风格的统一、创新了。

       4

       视觉大小统一

       在进行图标设计的时候，我们会使用栅格辅助线来帮助我们更加严格谨慎，但一定不要被辅助线困住，学会灵活运用，保持视觉上的大小统一。

       在如今的APP设计环境当中，一些APP设计大牛都一直强调，设计师要为有品牌意识。

       那么，在图标的设计中，我们也必须强调"品牌性"，简单的说就是把品牌中的抽象的概念变成具象化的图形，把品牌主副色调应用到图标设计中。

       同时建议大家每个星期完成一个主题的作品，提升自己的平面设计能力。

       标注规范

       如何把标注的思路整理清晰--结构化思维进行拆解，将大问题拆解成小问题，逐一击破！

       标注主要是以下四种不同属性的内容：尺寸、文字、间距、颜色。

       在进行标注时，首先去除导航栏和标签栏，因为这些控件通用性非常强，需要单独拿出来进行统一标注，这里我们只对内容区来进行标注示例。

       好的UI设计不仅是让软件变得有个性有品位，还要让软件的操作变得舒适简单、自由，充分体现软件的定位和特点。

       1.简易性

       界面的简洁是要让用户便于使用、便于了解产品，并能减少用户发生错误选择的可能性。

       2.用户语言

       界面中要使用能反映用户本身的语言，而不是游戏设计者的语言。

       3.记忆负担最小化

       人脑不是电脑，在设计界面时必须要考虑人类大脑处理信息的限度。人类的短期记忆有限且极不稳定，24小时内存在约25%的遗忘率。所以对用户来说，浏览信息要比记忆更容易。

       4.一致性

       它是每一个优秀界面都具备的特点。界面的结构必须清晰且一致，风格必须与产品内容相一致。

       5.清楚

       在视觉效果上便于理解和使用。

       6.用户的熟悉程度

       用户可通过已掌握的知识来使用界面，但不应超出一般常识。

       7.从用户习惯考虑

       想用户所想，做用户所做。用户总是按照他们自己的方法理解和使用。

       通过比较两个不同世界(真实与虚拟)的事物，完成更好的设计。如：书籍对比竹简。

       8.排列

       一个有序的界面[1]能让用户轻松的使用。

       9.安全性

       用户能自由的作出选择，且所有选择都是可逆的。在用户作出危险的选择时有信息介入系统的提示。

       10.灵活性

       简单来说就是要让用户方便的使用，但不同于上述。即互动多重性，不局限于单一的工具(包括鼠标、键盘或手柄、界面)。

       11.人性化

       高效率和用户满意度是人性化的体现。应具备专家级和初级玩家系统，即用户可依据自己的习惯定制界面，并能保存设置。

       12.颜色不一样

       UI设计师是随着网络而兴起的新兴设计行业，从事对软件的人机交互、操作逻辑、界面美观的整体设计工作

       涉及范围包括商用平面设计、高级网页设计、移动应用界面设计及跨媒介设计以人为本，以用户体验需求为基础，发展多元化是目前中国信息产业中最为抢手的人才之一。

       今天的讨论已经涵盖了“ui设计规范”的各个方面。我希望您能够从中获得所需的信息，并利用这些知识在将来的学习和生活中取得更好的成果。如果您有任何问题或需要进一步的讨论，请随时告诉我。