UI入门-你必须会

首先你要会Ps，Ai（Adobe党），这两样工具是必备的作图工具。

一、规范篇（以iPhone6为基础做教程）

1.基本界面：

电池电量条：40px

顶部操作栏（nav）88px

底部导航栏：98px

2.设计字体：

第一套：方正黑体简体、方正中等线黑体（常用）

第二套：华文黑体简体

3.字号：

界面标题：36-40px

界面内容标题：28-32px

界面内容：24-28

辅助文字、备注、说明等：20或22px

4.按钮（图标）尺寸：

顶部：44-52px

底部：44-46px

5.边距

据人体工程学研究，设计稿左右边缘需要空出12-20px的留白，防止误触。

二、切图

iOS篇

1.切图命名规范：

二倍图：XXX@2x.png（5s、6的尺寸下切出来的图）

三倍图：XXX@3x.png（6plus的尺寸下切出来的图）

2.怎么切图？

方案一：利用pscc2014 自带的抽出功能切图（需要将图层或图层组命名）

方案二：利用第三方插件切图（需要将图层或图层组命名）切图插件cutterman

方案三：手动切图（不建议，工作效率太低）

Android篇

点击：Android 点9切图

三、标尺

未完待续。