野路子设计小讲堂——iPhone篇

用户头像
郑州/UI设计师/5年前/222浏览
野路子设计小讲堂——iPhone篇

写这篇文章的初衷是分享给刚入行的萌新一些工作方法,帮助TA快速掌握工作技能,也是对之前工作方法的一个总结。

野路子设计小讲堂——iPhone篇


同行们!大家好,我是《野路子设计小讲堂》的小福,写这篇文章的初衷是分享给刚入行的萌新一些工作方法,帮助TA快速掌握工作技能,也是对之前工作方法的一个总结。如果行业Dalao,emmmm~~~不妨也来看看咱家讲的,如果有更好的方法可以在下面评论区留言,我会第一时间跟进的。


PS:本帖子适合萌新学习工作方法(能不能融入自身的工作,还是看你个人的造化了),会通过设计规范、人机交互方法、案例分析、工作方法四个维度分开来讲解(总结)。


以上内容,不想看直接略过,往下看!——————————————————————————————


网上好多IOS的设计规范,但都太过远古,巴拉巴拉巴拉讲一大堆,太过复杂,实际工作中用到的就下面这几点内容。

A、请先记住下面4点的解释,后面会用到:

B、以上这是页面的叫法,下面我们来讲设计尺寸:

看下面内容你要先知道:@2x和@3x,也就是我们切图给程序小哥时候的2倍图和3倍图,程序小哥开发用的尺寸规格单位是“pt”。

现在用的IOS最常见的机型为:iPhone6~iPhone 11 Pro Max,之前做设的时候一般会采用750px*1334px(IOS开发规格:375pt*675pt)这个规格作为设计输出稿(你说还有4、5呢?他们手机都不肯换会是你的目标用户么?放弃他们就行了),但我建议你们直接按照1242px*2688px(IOS开发尺寸:414pt*896pt)这个规格输出设计稿,方便后续对接。

PS:苹果手机以后414pt*896pt会是主流,375pt*675pt会逐渐淘汰,对设计师来讲也算是减轻了工作量。




如果你不知道怎么输出设计稿,你就按照1242px*2688px设个规格来输出设计稿(不理解就把尺寸除以3再乘以2就是750*1334的设计稿了)


当你以@3x图来输出设计稿的时候,请注意以下问题:

  1. 所设计的像素规格要被3整除,方便开发小哥高度还原你的设计稿;

  2. 图标一定要切正方形;

  3. 设计文字大小的时候最小字体为33px,不能比这个更小;

  4. 关于沉浸式适配问题,我们在设计750px*1334px设计稿时,切除的@3x图在1242px(414pt)*2688px上发现并不适用,是因为状态栏高度不同,我们需要单独调整一份@3x图给开发小哥,他们会去适配机型的。

    undefined

    PS:附件内上传了已经做好的模版PSD文件,可以下载了直接用。



10
举报
|
5
分享
相关推荐
评论
用户头像
评论你的想法~
表情
喜欢TA的作品吗?喜欢就快来夸夸TA吧!
推荐素材
古风平面仕女与瓷器
平面花卉图案扁平简约无缝拼接插画
玄关入门地毯印花图案红地毯
城阙凡花
海底世界插画
空的平台平面和自然景观
空的平台平面和自然景观
中国传统纹样创新图案设计
城市园林平面布局航拍
平面设计 吊牌设计
平面男孩喝咖啡插画设计
城市园林平面布局航拍
城市园林平面布局航拍
平面人物插画
牛奶乳液层次梯田平铺平面
金色颗粒质地的平面
牛奶乳液层次平面平铺平面
平面插画设计女孩喝咖啡
“知识宅急送”外卖,快递,平面,海报,素材,教育
平面插画情侣/矢量
金色颗粒质地的平面
金色颗粒质地的平面
金色颗粒质地的平面
平面书法字手写
平面风格黄绿色系花朵装饰
你可能喜欢
相关收藏夹
大家都在看
登录注册