关灯
开启左侧

移动端界面-IOS设计尺寸

[复制链接]
丘丘 发表于 2019-3-29 16:25:21 | 显示全部楼层 |阅读模式 打印 上一主题 下一主题
 
本帖最后由 丘丘 于 2019-3-29 16:26 编辑

PS工具设计IOS界面
画布尺寸:
新建750×1334  分辨率72,像素/英寸。

常见的字体大小:
24px、26px、28px、30px、32px、34px,36px等等。记住是偶数的。最小字号20px。

字体:
中文用苹方黑,英文用San Francisco,如果安不上也可以用Helvetica代替。
ios开发里单位是pt
750×1334尺寸的换算关系 1pt=2px,也就是说程序员拿到我们的px单位的标注稿,自己除以2就是pt了。

界面里的小图标常见的尺寸:
24px、32px,48px等,记住4的倍数比较好。
注意图标的尺寸要统一尺寸,以眼睛观察为主调整尺寸看上去一样。方形的比圆形的看着要大,需要调整下。

界面上的间距和元素尺寸:
以偶数为单位,不清楚的可以截图量大公司的APP界面作为参考。
750 x 1334 设计稿尺寸:
状态栏高度:40 px
导航栏高度:88 px
标签栏高度:98 px

设计稿实时预览:
安装一个Ps Mirror可以在iphone上实时观看效果。

标注工具:
3.Parker标

界面的图标切图:
Cutterman选中@2x @3x导出。

启动图标:
做1024×1024尺寸,一般做方形无圆角。然后用 IconTemplate 自动切图一套图标资源丢给程序员就ok了。
交接给程序:
最好是一个界面一个文件夹。文件夹里包括:界面效果图,标注文件图,切图资源文件包。

引导页:
值得注意的是引导页切图需要单独设计多套(640×1136、750×1334、1242×2208)这个可别傻乎乎的用Cutterman切几套图,这就尴尬了。

适配方法3个原则:(不清楚的在网站搜索适配2字)
1.文字流式
2.控件弹性
3.图片等比缩放

测试界面:
程序实现DEMO版本以后,咱们要在测试机上好好检查下界面问题,及时跟程序沟通并更改。


 
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则


1关注

18粉丝

84帖子

排行榜
关闭

站长推荐上一条 /1 下一条

官方微信

全国服务热线:

400-0708-360

公司地址:国家西部信息安全产业基地(成都市高新区云华路333号)

邮编:610000    Email:2908503813@qq.com

Copyright   ©2015-2016  EOIT论坛Powered by©Discuz!    ( 蜀ICP备11000634号-7 )