产品经理从专能到全能——较真的App界面交互设计规范

尺寸分辨率的设计

目标

1.掌握APP界面交互设计规范；

2.了解IOS、Android两大系统的设计规范的差异。

前言

APP设计规范指对APP界面进行风格统一，对界面元素的样式、颜色和大小设定统一的规范和使用原则。与设计、前端约定好统一的设计规范很重要，约定设计规范可以减少产品、设计、前端的沟通成本；可以使界面设计整洁、统一，减少界面元素的重复设计；可以减少设计素材，控制安装包的大小。

APP设计规范主要包括对界面布局、背景色、字体颜色大小、界面元素间距、弹层、loading、图标、按钮常态点击态等进行统一的梳理和规范。

尺寸及分辨率

1.IOS篇

1）iPhone4/4s 3.5寸 640*960px

2）IPhone5/5s/5c 4寸 640*1136px

3）iPhone6 4.7寸 750*1334px

4）iPhone6p 5.5寸 1080*1920px

设计图单位：像素72dpi。

在设计的时候并不是每个尺寸都要做一套，尺寸按自己的手机来设计，比较方便预览效果，一般用640*1136的尺寸来设计，iphone6和plus出来后有很多人会使用6的设计效果。

以我们的UI设计师为例，会使用640×1136，对plus做单独的修改适配，因为plus的屏幕实在是大了，遵循屏大显示更多内容的原则这里本应该是需要修的了。

Ps：作图的时候确保都是用形状工具(快捷键：U)画的，这样更方便后期的切图或者尺寸变更。

2.Android篇

1）320*480px 三星W789

2）480*800px 三星G9098

3）720*1280px 红米Note 三星Note2

4）1080*1920px 小米3/4 三星Note3

Android比iPhone的寸尺多了很多套，建议取用720*1280这个尺寸，这个尺寸在1080*1920中看起来比较清晰，切图后的图片文件大小也适中，应用的内存消耗也不会过高。