移动UI界面设计(微课版)
上QQ阅读APP看书,第一时间看更新

1.2 手机界面设计尺寸的度量单位

在手机UI设计中,分辨率和尺寸的大小与手机UI界面设计有着密不可分的关系。在设计时只有详细了解被设计平台的精确参数,才能保证设计出的作品在该平台正常显示。

1.2.1 英寸

英寸是西方国家长度计数单位,1英寸=2.539 999 918厘米。手机的屏幕尺寸统一使用英寸来计量,其指的是屏幕对角线的长度,数值越高,屏幕越大。

市场上包括手机在内的很多电子产品的屏幕尺寸均使用英寸为计算单位,这是因为电子产品屏幕尺寸计算时使用的是对角线长度,而业界一般情况下也是将对角线的长度默认为屏幕尺寸的规格,如图1-24所示。

47588-00-019-1

图1-24

提示

常见的手机尺寸有3.5英寸、4英寸、4.3英寸、4.7英寸、5英寸、5.1英寸、5.5英寸和5.7英寸等规格。

1.2.2 分辨率

分辨率就是屏幕图像的精密度,是指显示器所能显示的像素的多少,泛指量测或显示系统对细节的分辨能力。分辨率越高代表图像质量越好,越能表现出更多的细节;但相对地,因为记录的信息越多,文件也就会越大。

提示

当手机屏幕为240×320(像素)时,横向每行有240个像素点,纵向每列有320个像素点,则该手机屏一共有320×240=76 800个像素点。

在同样大的物理面积内,像素点越多显示得图像越清晰。以三星S7和三星S8来说,它们搭载了5.1寸和5.8寸屏幕,但是三星S7的分辨率是2 560×1 440=3 686 400个像素点;三星S8的分辨率是2 960×1 440=4 262 400个像素点,因此,三星S8比三星S7有更棒的图像显示效果,如图1-25所示。

47588-00-019-2

图1-25

提示

常用的分辨率单位包括以下几种:像素/英寸(ppi):适用于屏幕显示;点/英寸(dpi):适用于打印机等输出设备,线/英寸(lpi):适用于印刷报纸所使用的网屏印刷技术。

提示

在一般情况下,图像的分辨率越高,那么所包含的像素就越多,图像就越清晰;与此同时,它也会增加文件的存储空间。在屏幕尺寸不变的情况下,其分辨率不能超过它最大的合理尺寸,否则将失去意义。

下面列出几款目前手机的分辨率。

• iPhone 7是4.7英寸(1英寸=2.54 cm),分辨率为1 334×750像素。

• iPhone 7 Plus是5.5英寸,分辨率为1 920×1 080像素。

• Galaxy S8是5.8英寸,分辨率为2 960×1 440像素。

• Galaxy Note 8是6.3英寸,分辨率为2 960×1 440像素。

• 小米6是5.15英寸,分辨率为1 920×1 080像素。

1.2.3 屏幕密度

屏幕密度(ppi)是图像分辨率所使用的单位,意思是在图像中每英寸所表达的像素数目。从手机界面设计的角度来说,图像的分辨率越高,所打印出来的图像也就越细致与精密。实践证明,ppi低于240的,人的视觉可以察觉出有明显的颗粒感;ppi高于300的,则无法察觉。理论上讲,超过300ppi才没有颗粒感。屏幕的清晰程度其实是由分辨率和尺寸大小共同决定的,用ppi指数衡量屏幕清晰程度更加准确。屏幕密度的计算方法如图1-26所示。

47588-00-020-1

图1-26

提示

屏幕密度非常重要,因为在其他条件不变的情况下,一个宽高固定的UI组件(比如一个按钮)在低密度的显示屏上显得很大,而在高密度显示屏上看起来就很小。

1.2.4 网点密度

网点密度(dpi)一般是指印刷图片上每英寸的像素点数,类似于密度,用来表示图片的清晰度。在同样的宽高区域,低密度的显示屏能显示的像素较少,而高密度的显示屏则能显示更多的网点。

提示

网点是印刷中最小的单位。在印刷过程中,网点的好坏程度直接关系着印刷品的质量。密度测量法就是控制和检验印刷品质量的最基本的方法。在用密度计测量网点密度时,实际上测量的还是密度,通过仪器内部的转换可以显示出网点面积率。