IOS 12设计规范(6-1)图标和图像:图像尺寸和分辨率(Image Size and Resoulution)

点击前往本读书笔记总目录

6.1  图像尺⼨和分辨率(Image Size and Resoulution)

 iOS  用于在屏幕上放置内容的坐标系统是以点(pt)为基础的。该坐标系以点为基本测量单位,这些点映射到显示器器中则以像素显示。在标准分辨率屏幕上,一个点等于一个像素(1pt = 1px)。因为高分辨率屏幕的像素密度更⾼高,所以在真实世界里同等面积的屏幕中就包含更多的像素,即一点中包含更多像素(1pt= 2px、1pt=3px)。因此,高分辨率屏幕需要具备更高像素的图像。

IOS12设计规范

为了支持所有的 iOS 设备,你需要为设计的内容提供高分辨率的图像: 基于不同的设备,将每个图像中的像素数量乘以特定比例系数来进行适配。标准分辨率图像的比例系数为1.0,这种图像被称为 @1x 图像。高分辨率图像的比例系数为2.0或3.0,被称为 @2x 或 @3x 图像。假设你有一个标准的分辨率 @1x 图像,例如 100px x 100px,那么,该图像的@ 2x版本将是 200px × 200px,@3x 版本将是 300px * 300px。

IOS12设计规范

设计高分辨率设计图

使用8px  ×  8px的网格系统:  网格系统可以让线条和图像内容在所有尺⼨上保持清晰,无需太多的修饰和锐化。将图形边界对⻬齐到网格上,以减少按比例缩⼩小图像时出现的半像素和内容模糊的情况。

以适当的格式进行创作: 通常,位图/光栅的切图使用去交错的 PNG 格式文件(PNG 导出的设置)。选择 PNG 格式,是因为它支持透明度,并且因为是无损格式,不会在压缩过程中丢失图形的细节和⾊彩。对于需要阴影、纹理和高光效果的复杂切图来说,PNG格式是一个很好的选择。而照片内容(如广告图、照片)请使用JPEG 格式,因为它的压缩算法可以比无损格式节省更多的存储空间, 且较难识别到压缩的痕迹。所以,写实的 App 图标最适合使用 PNG 格式。其它需要进行高分辨率缩放的扁平、矢量切图则使用 PDF 格式。

对于不需要使用 PNG-24 的切图,只需要使用 PNG-8 格式即可: 因为 8 位⾊彩可以减少文件⼤小,并且不会降低图像质量。注意:PNG-8 不适用于照片类型。

优化 JPEG 文件,以找到存储容量和质量之间的平衡: ⼤多数 JPEG 文件可以被压缩,而不会造成明显的图像失真,即使是少量的压缩也可以为磁盘节省⼤量空间。在每个 JEPG 图像上进行压缩设置,找出可接受失真范围内的最佳参数。

提供图像和图标的替代文本标签:   替代文本标签在屏幕上看不到,但是它们帮助 “VoiceOver”(APPLE  公司推出的一种语⾳辅助程序)描述屏幕上的内容,便于视觉障碍的人“看到”屏幕上的内容。

文章转载请注明出处,并需展示来源网址!:淘盒子 » IOS 12设计规范(6-1)图标和图像:图像尺寸和分辨率(Image Size and Resoulution)

赞 (0) 打赏

评论 0

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏