很多初学者在开始做移动端UI设计的时候,往往对界面的一些尺寸规范不是十分清楚,很多时候都是凭借自己的感觉和经验去绘制界面,心里并没有一个清晰的概念,导致做出来的页面总是不那么尽如人意。本文整理的一些UI界面的设计规范方便初学者进一步理解界面设计。除此之外,本文还会介绍设计成员中的一员——动态海报的设计。
UI设计规范
手机端尺寸规范
显示屏尺寸 | 分辨率尺寸 | 状态栏高度 | 导航栏高度 | 标签栏高度 |
---|---|---|---|---|
iphoneSE:4英寸 | 640×1136px | 40px | 88px | 98px |
iphone6s/7/8:4.7英寸 | 750×1334px | 40px | 88px | 98px |
iphone6s/7/8plus:5.5英寸 | 1242×2208px | 60px | 132px | 147px |
iphoneX:5.8英寸 | 1125×2436px | 132px | 132px | 147px |
APP布局规范
APP常用边距:32px、30px、24px、20px;
卡片常用边距:20px、24px、30px、40px,不低于16px;
内容列表布局:最小高度80px;
界面图片设计比例:16:9、4:3、3:2、1:1、1:0.618;
图标统一&#