1.2　UI界面設計中的圖像

在UI界面設計中，人們總會與各種各樣的圖像打交道，這些圖像來自不同的渠道，它們的顏色、格式、大小、用途都不盡相同。本節將會介紹一些常用的數字化圖像的知識，幫助大家在學習和工作中可以準確地使用不同格式的圖像。

1.2.1　常見的圖像格式

圖像的格式非常多，不同的圖像存儲格式各有利弊。在實際的UI界面設計工作中，用戶應該根據圖像的具體用途選擇合適的圖像存儲格式。如圖1-14所示為不同的圖像格式，下面將對常用的圖像格式進行簡單介紹。

●JPEG格式

JPEG格式是目前最常使用的存儲格式，這種格式也是保障優質照片質量的壓縮格式，是目前所有圖像格式中壓縮率最高的，所以這種格式的文件體積極小。

JPEG格式會丟失一些數據，保存后的照片品質會有所降低，但是人眼難以分辨，所以在一般情況下并不會影響瀏覽效果。在UI界面設計中，一些不透底的素材圖像可以保存為JPEG格式。

●PNG格式

PNG格式主要應用于網絡圖像，可以保存24位真彩圖像，并且支持透明背景和消除鋸齒功能，它還可以在不失真的情況下壓縮保存圖像。所以，PNG格式是UI界面設計中最常使用的圖像格式。

●GIF格式

GIF格式使用的壓縮方式會將圖像壓縮得很小，非常利于在互聯網上進行傳輸，此外它還支持以動畫方式存儲圖像，所以GIF圖像常常被用在廣告宣傳上。

GIF格式只支持256種顏色，而且壓縮率較高，在存儲顏色線條較簡單的圖像時非常有優勢。

●BMP格式

BMP格式最早應用于微軟公司的Windows操作系統，是一種Windows標準的位圖圖形文件格式。這種格式幾乎不壓縮圖像數據，圖片質量較高，但文件體積也相對較大。

●TIFF格式

TIFF格式便于在應用程序和計算機平臺之間進行數據交換，是一種靈活的圖像格式。這種圖像格式是非破壞性的存儲格式，占用的存儲空間較大。如果圖像需要出版印刷，建議存儲為該種格式。

1.2.2　常見的圖像類型

在常用的Photoshop軟件中，“圖像模式”和“顏色模式”是一個概念。Photoshop中共有九種顏色模式，包括RGB模式、CMYK模式、Lab模式、HSB模式、位圖模式、灰度模式、多通道模式、雙色調模式和索引顏色模式。下面為大家講解設計師們常用的幾種模式。

●RGB模式

RGB模式是數碼圖像中重要的顏色模式，同時也是UI界面設計中經常使用的顏色模式。

RGB模式為24位顏色深度，該模式的圖像有紅、綠、藍三個顏色通道，每個通道都有八位深度，三個通道合在一起可生成1 677萬種顏色，被稱為“真彩色”。如圖1-15所示為RGB顏色模式圖像及其“通道”面板。

●CMYK模式

CMYK模式是用來打印或印刷的模式，這種格式的圖像有青、洋紅、黃、黑四個顏色通道，但是Photoshop的很多功能不支持CMYK模式。

RGB模式的色域范圍比CMYK模式大，印刷顏料在印刷過程中不能重現RGB色彩。如圖1-16所示為CMYK顏色模式圖像及其“通道”面板。

●Lab模式

Lab模式的圖像同樣擁有三個通道：一個亮度通道L和兩個顏色分量通道a和b。Lab模式是色域范圍最廣的顏色模式。

●灰度模式

灰度模式是八位深度的圖像模式，在全黑和全白之間插有254個灰度等級的顏色來描繪灰度模式的圖像。所有模式的圖像都能轉換成灰度模式，甚至位圖也可轉換為灰度模式。Photoshop幾乎所有的功能都支持灰度模式。