—— DIV+CSS网页切图 ——

2018最新最强的APP切图规范指南和切片要求

  APP切图是每个UI计划师必备的一门常识,而今最新的iphone手机是iphone X,群众也都笃爱以此做为样本,这手机尺寸是1125*2436px,跟iphone 8 的放大形式尺寸1125*2001px 是高了435px。如下图所示:

  假若是单数切图的话,手机体系就会主动拉伸切图,从而导致切图元素边际混沌,变成开荒出来的APP界面恶果与原计划恶果差异甚远。

  2、假若计划稿是按准则别离率1242X2208计划,图片资源尺寸则是@3倍图尺寸,将总共计划图压缩成750X1334,图片资源尺寸则是@2倍图尺寸,正在二倍图的根柢上压缩成50%,图片资源尺寸则是1倍图尺寸; 当然,你也可能依照@2x图 750*1334px的尺寸来计划。然后再去适配@3x倍图的修立。

  3、产物恶果图独立切片,即是每张恶果图独立修设一个文献夹(定名以恶果图名称为准),文献夹实质蕴涵1倍图文献、2倍图文献、3倍图文献和标识文献

  5、图片资源须要备有1倍图、2倍图、3倍图,3倍图定名准则为:增添后缀@3x;2倍图定名准则为:增添后缀@2x;比方:1倍图:abg.png,2倍图则为:,3倍图则为:;

  7、页面纯色布景需标出rgb值,假若有透后度则需标出rgba值,其他格外布景直接切图;

  8、页面的图标、色块、按钮的高度都必需是4的倍数,最小像素不行低于44px,如不敷可能增添补白;

  9、页面外边距留白为10px;可点击部件应该细心其点击区域不小于88px

  10、启动图标1024*1024,png体式,不行透后底,透后的一面补白色。

  图片正在线压缩东西有:手机APP计划必备图片压缩神器-TinyPNG和计划师最爱的无损图片压缩东西—ImageOptim

  12、操纵APP切图 ps插件Cutterman——一键切图,真正解放双手

  Sketch Measure是最新的Sketch切图插件操纵步骤尽头简略,不妨一键天生Html标注文献,而且主动天生计划榜样文献异常高端。

  13、ios切片和安卓切片,大一面是可能共用的。只须你输出的切片是@2x 和@3x的资源就可能了。

  ① 假若一个图层须要输超群种体式图片,定名可能用逗号瓦解。(比方:a.jpg,a.png)

  ② 统一个图层思输超群种质料的图片,可能正在定名后加参数。 (比方:a.png8,b.png32 如许就会输出一张8位的a.png和一张32位的b.png文献)

  ③ JPG默认输出是90%的质料,也可能定名加参数把持(比方:a.jpg50%)

Copyright © 2002-2019 添彩网网络科技有限公司 版权所有 网站地图