方案一
IOS与Android共用一套设计效果图 1242*2208
IOS与Android常用的尺寸中,最大尺寸为6p的尺寸,即1242*2208px
IOS常用尺寸:1242*2208 750*1334 640*1136 640*960,其中750*1334 640*1136 640*960 同为@2x 1242*2208为@3x,所以750*1334 640*1136 640*960只做一套640*1136就好。
Android常用尺寸:1080*1920 720*1080 480*800,他们之间相邻是可以整除1.5的,也就是1080除以1.5等于720,720除以1.5等于480,即这三个尺寸可以等比缩放大小,只做一套1080*1920就可以。
那么问题来了。
IOS要做两套尺寸,1242*2208与640*1136
Android要做一套尺寸,1080*1920
这样不就是三套设计图了吗?设计师们会被气死的?
其实,6p的尺寸1242*2208整除1.15就刚好就等于1080*1920,也就是说,1242*2208与1080*1920是可以等比缩放的。
现在就剩下IOS的640*1136。
那么就有人问,那IOS的1242*2208可以直接等比缩放成640*1136。答案是不可以的,因为他们之间不能整除的,但是我们把1242*2208的设计图直接在Photoshop里面直接等不缩放到宽度为640的尺寸,我们会发现原本的2208变成了1138,也就是说比1136多了2个像素,2个像素的误差对于没有有强迫证的也就无所谓了,2个像素的误差我们会将1138硬改成1136,现在你会发现,里面的图标,1136跟1138大小其实是一样。
为什么提到图标呢?因为我们交付的物只需要一套效果图与五套切图就好了。即
一套效果图 1242*2208
五套切图 1242*2208 640*1136 1080*1920 720*1080 480*800
最后注意缩放的图标要细调一下,由于转换有误差,共用一套效果图是有一定风险的,例如UI细节上的风险。开发前,设计师与开发人员要先共同确认此适配方案,要全程沟通,及时改正UI方面的问题。
方案二
IOS与Android共用一套设计效果图 750*1334
上面提到过,750*1334 640*1136 640*960 同为@2x,所以750跟640用同一套图标,同一套字体,至于其他尺寸大小,只要跟着尺寸延伸就没问题啦。尺寸750*1334应用1242*2208,则需要把@2x导出成@3x,也就是把字体放大1.5倍,其余的直接放到1242就可以啦。
至于Android版本,我个人的做法是把750*1334直接换算成1080*1920,因为只有1PX像素只差,直接忽略。换算出1080*1920,Android的其他尺寸就按他们之间的规律处理就可以啦。
因为我们交付的物只需要一套效果图与五套切图就好了。即
一套效果图 750*1334
五套切图 1242*2208 640*1136 1080*1920 720*1080 480*800
方案三
IOS与Android各做两套设计效果图
原理跟方案一、二差不多,但为了追求细节上的完美,可以多做一套设计图,即两套设计图:1242*2208和640*1136.
1242*2208适配6P、Android三种尺寸。
1242*2208整除1.5等于1080*1920:
1080*1920整除1.5等于720*1280:
720*1280整除1.5等于480*800:
640*1136适配6 5 5S等尺寸。
方案四
如果追求完美,那就需要三套图。即:
1242*2208 640*1136 1080*1920
还可以加上一套640*960,总之分开做越多套,出来的效果图就会越精细,反之,你懂得,不过这也取决设计师本人和公司领导的决策,会不会给那么多时间。不说废话了,希望能帮到各位!
网友评论