屏幕分辨率基础ppt课件.pptx

屏幕分辨率基础,我们每天打交道的分辨率，不止表面那么简单,像素,屏幕的最小单位,屏幕分辨率基础,说到像素，我们想到什么？,1,“像素”的画面,说到像素，我们想到什么？,“像素”的本来面貌,说到像素，我们想到什么？,现实世界的色彩,2,现实世界色彩是连续的,现实世界的色彩,虚拟世界的色彩,3,虚拟世界色彩是有边界的,虚拟世界的色彩,两者的转换,4,数码相机记录色彩,两者的转换,分辨率,画面的显示方式,屏幕分辨率基础,关键的1英寸,1,磅,磅是印刷行业通用的一个字号单位。1磅=1/72英寸。,关键的1英寸,英寸,但是反过来，1英寸=72磅。这个长度大约等于食指最外一根半指节。,关键的1英寸,多少英寸屏幕是指对角线长度,关键的1英寸,DPI/像素密度,2,其实就是PS里的分辨率,DPI/像素密度,神奇数字：300与72,3,300,300的DPI用于印刷品，这是我们人眼能分辨的极限。当一英寸内的像素点达到300左右，就可以以假乱真，我们再怎么凑近看，都看不出像素点了。即使分辨率再继续提升，我们也感觉不到画质变得更清晰。,神奇数字：300与72,72,72的DPI用于屏幕显示。最早出现在mac电脑上，为了使屏幕与印刷品实际大小相等。,神奇数字：300与72,逻辑像素和倍率,解决碎片化问题的关键,屏幕分辨率基础,逻辑像素,1,显示分辨率，也就是逻辑像素,逻辑像素,两者的关系,逻辑像素能调到最大时，就等于屏幕分辨率。我们在设计PC网页的时候，不会考虑这两种分辨率的区别，两者是相等的。,逻辑像素,调整分辨率时究竟发生了什么？,逻辑像素,思考题,如果逻辑像素能设置成1 x 1，显示中国国旗，会是什么效果？,逻辑像素,答案,逻辑像素,倍率,2,倍率在发挥作用,倍率,逻辑像素与倍率的关系,3,逻辑像素决定显示效果,逻辑像素与倍率的关系,iPhone 4,屏幕分辨率,640 x 960 px,倍率,2,=,逻辑像素,320 x 480,iPhone 3GS,屏幕分辨率,320 x 480 px,倍率,1,=,逻辑像素,320 x 480,屏幕分辨率跨度非常大,逻辑像素与倍率的关系,主流的屏幕分辨率,逻辑像素与倍率的关系,iOS,Android,解决碎片化问题,4,这个问题不用我们来解决,解决碎片化问题,为什么搞这么麻烦？,解决碎片化问题,显示效果并不会一模一样,解决碎片化问题,实际操作,设计注意事项,屏幕分辨率基础,PC,1,PC常见分辨率,PC,为PC设计,逻辑像素：屏幕分辨率倍率：1切图：1倍,PC,iOS,2,iOS常见分辨率,iOS,640 x 1136,750 x 1334,1242 x 2208,为iOS设计,逻辑像素：3种倍率：2、3切图：2倍、3倍,iOS,Android,3,Android常见分辨率,Android,720 x 1280,1080 x 1920,为Android设计,逻辑像素：1种倍率：1.5、2、3、4切图：1.5倍、2倍、3倍、4倍,Android,H5,4,H5常见分辨率,H5,为H5设计,逻辑像素：4种（iOS+Android）倍率：1.5、2、3、4切图：2倍,Android,其他设备,5,只要是屏幕就符合这个原理,其他设备,“谢谢。”,