1、圖像處理圖像處理本章內(nèi)容本章內(nèi)容：本章主要介紹了界面設(shè)計的基本原則，使用Photoshop處理簡單的圖像和文字，使用HyperSnap抓圖。學(xué)習(xí)目的學(xué)習(xí)目的：通過學(xué)習(xí)本章，了解多媒體界面設(shè)計的原則和圖像的基本概念，掌握使用屏幕抓圖軟件抓圖，掌握使用Photoshop處理簡單的圖像和制作標題文字。4.1 4.1 背景知識背景知識 界面是學(xué)習(xí)者與計算機交互的窗口，學(xué)習(xí)者通過界面向計算機輸入信息進行控制、查詢和操縱，計算機則通過界面向用戶提供信息以供閱讀、分析、判斷。本節(jié)通過幾個實例介紹了多媒體界面的設(shè)計原則，以及介紹了常見的圖像處理軟件。4.1.1 多媒體的界面 多媒體的界面是非常重要的一個方面，

2、好的多媒體作品，用戶使用后的第一感覺就是其界面設(shè)計使人耳目一新，一進入就被其優(yōu)美的界面設(shè)計吸引住了。下面先讓我們來欣賞幾個多媒體的操作界面。 友好的交互界面可以使得學(xué)習(xí)者對屏幕提供的界面能很容易的理解和接受，從而更容易地掌握、理解和使用多媒體。通過欣賞以上幾個多媒體操作主界面，可見多媒體主題的不同，決定多媒體的操作界面也有不同的風(fēng)格。界面設(shè)計要遵循以下這些原則： (1)一致性原則。 (2)符合主題。 (3)清晰性原則。 (4)見圖識意具有象征性。 (5)符合學(xué)生的認知結(jié)構(gòu)。 (6)有效運用刺激。 (7)反饋性。 4.1.2 圖像處理軟件 那怎樣才能制作出一個漂亮的操作界面呢，不僅要遵循以上的設(shè)

3、計原則，最主要的還是要通過相關(guān)的圖像處理軟件將其制作或經(jīng)過處理得出，隨著多媒體技術(shù)的發(fā)展，市場上的圖像處理軟件也越來越多，常用的圖像處理軟件有Photoshop、Fireworks、CorelDraw等，在這一章中我們選用Photoshop為制作軟件，介紹其在圖像處理方面的應(yīng)用。4.2 Photoshop4.2 Photoshop概述概述 Adobe公司推出的Photoshop軟件功能強大、實用性強，在圖像的加工處理方面一直是大部分人的選擇。運用好Photoshop將給我們的多媒體作品帶來意想不到的收獲，Photoshop的常見版本有Photoshop 7.0，Photoshop CS，本書以

4、Photoshop CS為例說明。本節(jié)介紹了圖像的一些基本概念，和Photoshop的界面認識。 4.2.1 Photoshop Photoshop相關(guān)概念1、位圖和矢量圖、位圖和矢量圖位圖定義位圖特點矢量圖定義矢量圖特點2、像素、分辨率與圖像尺寸、像素、分辨率與圖像尺寸(1)像素(2)分辨率(3)圖像尺寸4.2.1 Photoshop Photoshop相關(guān)概念3、常用文件格式、常用文件格式 在使用Photoshop平面設(shè)計軟件系統(tǒng)中，文件的存儲格式有很多種，有PSD、JPEG、BMP、TIF、GIF、PNG等格式，而在這里我們將重點介紹一下PSD格式。PSD格式是Photoshop軟件的專

5、用格式。它能保存圖像數(shù)據(jù)的每一個細節(jié)，包括圖像的層、通道等信息，確保各層之間相互獨立，便于以后進行修改。PSD格式還可以保存為RGB或CMYK等色彩模式的文件，但唯一的缺點是保存的文件比較大。安裝有Adobe Photoshop CS所顯示的PSD文件的圖標是4.2.2 Photoshop CS Photoshop CS工作界面4.3 4.3 選擇操作選擇操作 選擇操作是Photoshop的最常見操作，軟件的很多后續(xù)操作首先都要選擇圖像的一部分。因為Photoshop功能強大，選擇操作也有很多方式，所以我們以幾個實例來說明選擇操作。4.3.1 實例：女媧補天步驟步驟1 1 導(dǎo)入圖片導(dǎo)入圖片步驟

6、步驟2 2 合成圖片合成圖片步驟步驟3 3 去除圖層去除圖層1 1空白部分空白部分步驟步驟4 4 選中圖像中間橢圓區(qū)域，并模糊橢圓邊選中圖像中間橢圓區(qū)域，并模糊橢圓邊步驟步驟5 5 導(dǎo)出圖片為導(dǎo)出圖片為jpegjpeg格式格式4.3.2 實例：不規(guī)則圖形的選擇步驟步驟1 1 導(dǎo)入圖片導(dǎo)入圖片步驟步驟2 選取人物區(qū)域選取人物區(qū)域步驟步驟3 導(dǎo)出圖片導(dǎo)出圖片4.4.1 實例：改變圖像的尺寸 我們收集的素材圖片中，有些圖片偏大，那我們就可以將圖片導(dǎo)入Photoshop CS中，將圖片像素減少，可以達到我們所要的效果了。例如下圖4-32是一張923651像素的圖片，通常我們的多媒體界面為800600像

7、素，如果做為多媒體邊框的話，它是偏大的。我們當然可以先將圖片導(dǎo)入Authorware，再在軟件中調(diào)整圖片的大小，也非常方便，但是這樣會使多媒體的容量增大，多媒體的打開速度減慢。那么接下來我們就要改變這張圖片的大小。步驟步驟1 1 導(dǎo)入圖片導(dǎo)入圖片步驟步驟2 設(shè)置圖像大小設(shè)置圖像大小步驟步驟3 3 導(dǎo)出圖片導(dǎo)出圖片 4.4.2 實例：旋轉(zhuǎn)按鈕的制作 鄉(xiāng)土教材鄉(xiāng)土教材主界面左邊有四個導(dǎo)航按鈕，當鼠標移動主界面左邊有四個導(dǎo)航按鈕，當鼠標移動到按鈕上時，圖片就發(fā)生了旋轉(zhuǎn)，如圖到按鈕上時，圖片就發(fā)生了旋轉(zhuǎn)，如圖4-35所示。這樣所示。這樣的效果是怎樣制作出來的呢，其實很簡單，只要制作兩的效果是怎樣制作出

8、來的呢，其實很簡單，只要制作兩張不同狀態(tài)的圖片，再導(dǎo)入張不同狀態(tài)的圖片，再導(dǎo)入Authorware的按鈕中就可以了。的按鈕中就可以了。鼠標未移上效果鼠標移上效果步驟步驟1 導(dǎo)入圖片步驟步驟2 設(shè)置畫布大小 步驟步驟3 輸出鼠標移上狀態(tài)圖片步驟步驟4 制作初始狀態(tài)按鈕4.5 4.5 文字處理文字處理 Photoshop CS Photoshop CS除了能對圖片進行處理外，我們還除了能對圖片進行處理外，我們還能夠通過使用能夠通過使用Photoshop CSPhotoshop CS中中“樣式控制面板樣式控制面板”，美，美化標題文字。如化標題文字。如射線和角射線和角多媒體中的文字多媒體中的文字“射線

9、射線和角和角”，接下來我們將運用，接下來我們將運用Photoshop CSPhotoshop CS學(xué)習(xí)一些文學(xué)習(xí)一些文字的簡單處理。字的簡單處理。 4.5.1 實例：“射線和角”的制作步驟步驟2 輸入文字“射線和角”步驟步驟1 新建一個圖像窗口 步驟步驟3 設(shè)置文字樣式步驟步驟4 調(diào)整文字位置步驟步驟5 給文字添加樣式 步驟步驟6 給文字添加陰影效果 步驟步驟7 導(dǎo)出“射線和角”圖片4.6 4.6 屏幕抓圖軟件屏幕抓圖軟件HypersnapHypersnap 有的時候我們需要截取屏幕上的圖形來修飾文章或者是做軟件演示，圖文混排可以更加清楚地講解某一問題。抓取屏幕最講簡單的方法是按鍵盤上的“Print Screen”鍵，抓取當前桌面抓到剪貼板中，或者按“Alt+Print Screen”抓取當前窗口到剪貼板中，然后再粘貼到圖像處理軟件中進行編輯。在沒有專門的屏幕抓圖軟件的情況下，可以使用這種方法臨時代替。我們也可以用專門的抓圖軟件實現(xiàn)屏幕抓圖，使用更加方便，功能更加多。