本帖适用对象:UI designer, Android Developer
清楚记得在Facebook上某个社团,曾经有人问过Android支持Multiple screen,究竟要出多少套不同Density的切图?
追求极致与显示完美的设计师会切多套图,但在网路行业这样飞快的敏捷开发节奏,我只出一套标注与切图,惟有不得已的情况下,大多是小适配手机有显示的问题,才会多切mdpi或ldpi的图。除了工作效率更快之外,原因无它,APK的档案大小会影响留存率!尤其是工具类的App。
在开始讲解我的工作习惯之前,如果你还不是很清楚Android如何支持不同Density萤幕的话,可以先K一下官网的Developer guide:http://developer.android.com/intl/zh-tw/guide/ practices/screens_support.html#support
不管是用Illustrator或是Sketch,一般我都把Canvas size设定成720*1136(不包含Status与Navigation bar),主要是为了xhdpi Density的切图尺寸,但标注的时候仍要使用Baseline(mdpi)为基准,换算每2px等于1dp。
标注(Layout/Measurement)
虽然主要标注的单位是dp,但有时候也会用到sp或px,以及百分比,怎么决定要用什么单位呢?
1.所有可操作的控件或是具体 影响可读性的元件,你希望在不同Density萤幕上Actual/Physical size显示是一致的,都要用dp,我自己的习惯是文字也都用dp为显示单位,之前文章提到过的Iconfont,也是一样。
2.如果是希望文字能随着用户在设定参数里的显示字级大小变化,才使用sp,且前提要考虑你所有的版面设计支持响应式设计(Responsive design)原则之外,也不担心字级大小变化而影响到版面的配置与美感,更重要的是在那小萤幕里寸土寸金,文字变大了,一屏能显示的内容也就少了,也可能因此失去一些流量。
3.用到px的情况是比较少的,主要会在一些装饰性的设计元件,例如:圆角、分隔线等,会使用px单位。但这不是铁律,全看画面的配置或整体设计规范,来定义各元件的显示参数即可。
4.如果画面不是同类型控件的堆叠(例如:List、Grid等),而是有一个较大的元件或单一图片的时候(例如:Tutorial, Welcome page),我会用百分比去进行Width或是Margin的定义。
切图(Asset/Resource)
- 从Flat design到Material design,视觉设计的趋势都以大量的色块为主,因此大多是产出PNG格式的图片,有用到渐层色或非要带Alpha channel就产出24bit的格式,少于256色则使用8bit即可。而不管是多少位元的图片,一律都会再压缩,习知的工作就属Web版压缩器TinyPNG了,如果想要再追求更精减的压缩,则可以考虑ImageAlpha,它则可以设定颜色数量的参数,这套工具则需要下载Client App。
- JPG则视点阵图的复杂情况,去调整压缩比,就不多赘述了,通常这类型的图片尽可能是放在CDN,从云端拉下来,除非其必要性,才会放在Client。
以上是设计Android UI时应该要有标注观念,如果有更好的方法或观点,也欢迎交流分享。