universal版app我流制作心得&iPhone6 分辨率揭

楼主: waldfantasy (Kira)   2014-09-18 10:40:35
纪录一下自己实际制作universal版app的一点心得.
分享给有兴趣的朋友参考:)
好读无音乐网志版.
http://kirafugames.blogspot.tw/2014/09/universalappiphone6.html
这篇网志的iPhone6的资料主要是参考国外的这篇"iPhone 6 Screens Demystified"介绍,
http://www.paintcodeapp.com/news/iphone-6-screens-demystified
加上个人制作unversal版的心得汇整纪录。
前几天是一年一度的apple发表会,
对app/游戏开发者来说最重要的就是iPhone6 / iPhone6 plus的发表,
又多了一个新的萤幕规格@@"
(iPhone6的分辨率连在搞怪的Android都很少见)
对于要制作universal(通用)版本的开发者来说,
最好是提前就把所有可能的萤幕规格尺寸及比例在初期就事先考虑进去,
这样在做UI跟整体美术画面发想的时候,
可以预先做设计,
绝对会比事后看到再修改调整的好。
基本上现在的各种开发工具都很方便,
大部份都可以做到在模拟的环境中即时预览不同分辨率的效果,
但是对于想做到Universal的app or 游戏,
每多一个分辨率,
就需要多测试一次,
就算工具很方便,
但是还是要不断切换测试确认,
但好处就是完成之后就可以一次发布到多个平台。
关于iOS目前的分辨率共有:
iPhone4/s: 640x960 (320x480 retina 2倍密画素)
iPhone5/s: 640x1136 (320x568 retina 2倍密画素)
iPhone6: 750x1334 (375x667 retina 2倍密画素)
iPhone6plus: 1080x1920 (414x736 retina 3倍密画素)
可以看到新增的iPhone6plus最特别!
它的萤幕尺寸是1080x1920,
但是仔细看原始分辨率414x736跟1080x1920对不起来,
414x736的3倍密画素是1242x2208,
所以iPhone6plus其实是先3倍密画素后再缩小一些塞进1080x1920的萤幕里,
这样理论上来说画质是会更细腻,
虽然还没看过实机,但我想比起有没有retina2倍密画素,
retina2倍密跟retina3倍密肉眼其实应该不太容易辨识吧@@"
个人认为实际在制作图像时,
如果想节省档案容量,
用414x736的2倍818x1472去做,
在iPhone6 plus上应该看起来就很接近retina了。
而比例部份,
iPhone6跟iPhone6 plus虽然又变大变长了,
但幸好比例很接近iPhone5的16:9,
所以大致上来说只要在雏形图设计时有做到4:3跟16:9的考量,
4:3用1024x768,16:9用640x1136,
(个人习惯再加一个640x960)
这样比较方便放在同一张图里检视,
如下图,
再换用色块来看会更清楚各各分辨率的尺寸差异
重叠在一起
这样就可以确定哪些需要满版的物件在三种不同比例框线的范围会如何呈现了,
而有需要retina的部份在输出时在做放大2倍的动作(针对向量图),
基本上只要做到这几个比例都能做到填满画面,没有黑边,
(简单来说就是背景图的部份要能填满画面,
HUD抬头显示器的部份就用device width减去留白的宽度动态调整)
就能做到兼顾所有iOS跟Android的Universal需求了。
作者: kyushu (苏打绿吓倒我了)   2014-09-18 12:52:00
感谢分享
作者: plsear (普西儿)   2014-09-19 05:12:00
感谢~
作者: AmosYang (泛用人型编码器)   2014-09-19 14:41:00
推知识分享

Links booklink

Contact Us: admin [ a t ] ucptt.com