移动端界面设计
其他
2018-10-11 16:44:17
阅读次数: 0
设计尺寸 ios:新建750×1334 分辨率72px android:720 x 1280px (设计风格Material Design) * 在iphone上实时观看效果Ps Mirror安装一个
|
字体大小 24px、26px、28px、30px、32px、34px,36px等等 记住是偶数的 最小字号20px 36px (超大号字号) :导航、文章页标题 (建议行间距:54px) 32px(大号字号) :普通标题、重要文字 (建议行间距:48px) 28px( 中号字号) :文章正文、次重要文字 (建议行间距:42px) 24px(小号字号) :内容较多的段落、横排应用名称、描述 (建议行间距:36px) 22px(加小号字号) :名称标注、密集排版区域 (建议行间距:28px) |
|
使用字体 中文用苹方黑体,英文用San Francisco,如果安不上也可以用Helvetica代替 |
组件尺寸 (750 x 1334 设计稿尺寸) 基本: 状态栏高度:40 px、导航栏高度:88 px、 底部标签栏高度:98 px 屏幕边距:20px/24px (看项目情况) 图标: 常见图标尺寸:24px、32px,48px等 (6的倍数比较好) 启动图标: 1024 x 1024px 主要大图标菜单:60 x 60px 、 64 x 64px 按钮: 按钮尺寸(常规): 高 54px 64px (点击区域不小于88px ) banner:首页顶部:750x408px (android:720*1280) 基本:状态栏高度:50px、 导航栏 高度 :96px、底部标签栏 高度 :96px |
细节注意 |
1、除了广告图片,其他部件最好都用形状工具绘制 2、设计可点击的部件尽量和屏幕四周边框保持一定距离(一般控制在20px的空间) 3、所有部件的尺寸必须是偶数 4、可点击部件不小于88px(以Retain为基准,通常所说的44px是指普通屏幕),实在不够大的切图时空白补足或者让程序控制触点大小 |
整理 |
设计完后导出效果图,按模块整理分类到不同文件夹,在文件夹内按步骤顺序命名(xx01,xx02...)文件 |
转载自blog.csdn.net/maomaog16/article/details/82107266