一般非设计人员学了PS不需要学AI。 重要的事情我就不说3遍了。 PS和AI软件共同特点: 共同特点1: PS和AI是一个妈生的(同是Adobe公司出品)。 共同特点2: 由于以上原因,他们界面布局非常相......
2023-05-02 201 PS和AI区别
提到UI设计规范,大家第一想到的就是类似iPhone 6/7/8的尺寸就是4.7英寸,5英寸分辨率为1920*1080这一串串的数字吧?这样理解UI规范就片面了。
UI设计规范不是简单的数字和尺寸,规范不但可以保证项目的正常交接运行,在UI设计中还使其整体的保持风格一致,例如图标的线条粗细、边角弧度、图标高度宽度比例、风格等等。
关于不同IOS和安卓系统的规范,我们可以通过厂家或网络搜索到数值,这里要提到的UI设计规范是跳脱出局限的数值,通过整理思路注意事项来理解和学习UI设计规范,这样才能活学活用。
1、尺寸。例如图标、图片这些内容关于尺寸维度的标注。
需要注意,比如图片的尺寸比例,不是固定的它的大小数字,这样开发才能更好的适配,常用的图片比例有4:3、16:9等。如果控件给出固定的尺寸数值,按钮的宽和高度都标注出来,开发就会写死按钮的尺寸,一旦遇到屏幕有比例不同的时候,按钮还是固定的大小,就会影响视觉效果;
2、标注文字的字体、字号、颜色、行高和透明度等等。
这些都要给出一个极限情况的规范,如最多显示几个字符,字符超过极限值就用“...”的方式处理;
3、间距的规范。
间距相对比较简单,只要标注清晰就不会有太大问题。但有时候将间距和尺寸混淆。我们可以这样理解为尺寸是容器的大小,而间距是容器之间的距离,所以间距和尺寸有着很大的不同;
4、颜色标注规范。
文字的颜色已经归类到文字属性里面,不用重复标注。颜色标注内容有:分割线颜色、背景色、按钮颜色等等。 建议使用公司或品牌原有VI配色,可提高公司或品牌VI之间的关联,增加可辨识性和记忆性。
除了图片风格、色调等常规的统一性意外,还要着重注意切图和图片优化。
1、安卓系统
安卓系统切图:
安卓系统图片优化:
2、iOC系统
iOC系统切图:
iOC系统图片优化:
统一的、规范的命名对我们自己的文件整理有很大的帮助,后期修改文件、图层的时候更加方便快捷。
并且做好版本管理、文件归档的工作,会提高项目沟通衔接,能更好的为版本管理、文件归档做铺垫。
比如常见文件包命名规则是:项目名字+切图+作者名字+日期。
比如常用的英文单词列表:
bg(backgrond 背景)
nav(navbar 导航栏)
tab(tabbar 标签栏)
btn(button 按钮)
img(image 图片)
icon(图标)
selected(选中)
default(默认)
pressed(按下)
back(返回)
content(内容)
标签: UI设计规范
相关文章
一般非设计人员学了PS不需要学AI。 重要的事情我就不说3遍了。 PS和AI软件共同特点: 共同特点1: PS和AI是一个妈生的(同是Adobe公司出品)。 共同特点2: 由于以上原因,他们界面布局非常相......
2023-05-02 201 PS和AI区别
提到UI设计规范,大家第一想到的就是类似iPhone 6/7/8的尺寸就是4.7英寸,5英寸分辨率为1920*1080这一串串的数字吧?这样理解UI规范就片面了。 UI设计规范不是简单的数字和尺寸,规范不但可以保......
2023-05-03 201 UI设计规范
PS在当下生活语言中有三个意思。 一、PS备注的意思: PS是英文单词postscript的简称,也有附言的意思,一般都用在信件的结尾处,如果在口语中也是表达备注、顺便说一下。 二、PS是软件 Pho......
2023-05-02 200 ps教程
PS里可以通过多种方法创建选区,并且可以通过比如路径、描边羽化等转化为选区。 方法一、通过全选,选中选区。快捷键:CTRL+A 1、我们使用全选快捷键CTRL+A,会选中当前所有内容并创建选区......
2023-05-03 200 PS选中选区