网页设计板块间距 第1篇
首先说一下UI设计中，间距设定的一个理念，间距设定一般要设定一个最小栅格基数，如4、5、6、8为间距设定的起始数值。
然后页面中，接下来所有的间距设定，都得是这个数值的倍数。（这点后面会详细讲解）
在一个带有文字的设计组件中，若设计思路上要呈现视觉统一的间距，那可以算出字号与行高的间隙，然后减去相对应的栅格数值，使其视觉上接近统一的间距。
下图所示，设计思路上想呈现一个30px的统一间距，那就可以减去一个最小栅格数值。
若最小栅格数值是6px，最终给出的间距就是24px，视觉距离呈现的就是接近30px的距离。
这种方式也是我一直以来用的方法，好处就是没有打破间距设定的原则。
设计的间距与开发看到的间距，都是有规律的栅格系统间距。
唯一有点不完美的地方就是，实际距离有时还会有一点小误差，但其实在视觉上也完全可以忽略掉了。
网页设计板块间距 第2篇
☆ iPhone6Plus是英寸屏幕，1242x2208px-@3x的像素分辨率，逻辑分辨率是414x736pt-@1x。物理尺寸是1080x1920px。这个物理尺寸，也是安卓机目前最流行的大屏设计稿尺寸。
☆ iPhone6是英寸屏幕，750x1334px-@2x的像素分辨率，逻辑分辨率是375x667pt-@1x。
☆ iPhone5是4英寸屏幕，640x1136px-@2x的像素分辨率，逻辑分辨率是320x568pt-@1x。
参考图片如下：
网页设计板块间距 第3篇
1、界面尺寸布局：满屏尺寸750x1334px
2、高度电量条高度40px，导航栏高度88px，标签栏高度98px；
3、各区域图标大小导航栏图标44px，标签栏图标50px；
4、各区域文字大小电量条文字22px，导航栏-文字32px，标签栏字20px；
5、常用的文字大小：32px，30px，28px，26px，24px，22px，20px；
6、常用的颜色：背景浅灰色#f2f2f2,文字深黑色#323232，边框色深灰#CCCCCC；
8、单行文字的背景框的高度：88px，双行则为：176px，三行则为：264px；
9、常用间距：亲密距离：20px；疏远距离：30px，其它距离：10px，44px等；
10、按钮和文本框，原型图做成直角的，圆角半径是多少，由Ui来设计；
11、这种情况，需要修改原型。单个页面的逻辑流程图或用户学习使用时间，超过其它页面平均数的3倍以上；