信息化UI設(shè)計(jì)教案新部編本一學(xué)期

1、精品教學(xué)教案設(shè)計(jì)| Excellent teaching plan教師學(xué)科教案20 -20學(xué)年度第一學(xué)期任教學(xué)科:任教年級:任教老師:xx市實(shí)驗(yàn)學(xué)校精品教學(xué)教案設(shè)計(jì)| Excellent teaching plan大綱第一章信息化UI設(shè)計(jì)基礎(chǔ)§ 1.1 理解信息化UI設(shè)計(jì)§ 1.2 數(shù)字化圖像的基礎(chǔ)案例1：繪制簡潔的開機(jī)按鈕案例2：制作網(wǎng)站主頁按鈕案例3：制作逼真皮革按鈕第二章圖標(biāo)設(shè)計(jì)§ 2.1 了解圖標(biāo)設(shè)計(jì)§ 2.2 圖標(biāo)設(shè)計(jì)的繪制原則案例1：制作IE瀏覽器圖標(biāo)案例2：繪制真實(shí)鏡頭圖標(biāo)案例3:繪制手機(jī)信息APP圖標(biāo)第三章網(wǎng)頁設(shè)計(jì)§ 3.1 了

2、解網(wǎng)頁UI§ 3.2 網(wǎng)頁界面構(gòu)成元素§ 3.3 網(wǎng)頁設(shè)計(jì)的原則§ 3.4 網(wǎng)頁界面布局形式案例1：繪制網(wǎng)頁中的主體案例2：繪制網(wǎng)頁戰(zhàn)中的廣告條案例3：繪制網(wǎng)頁的背景和導(dǎo)航欄第四章軟件界面設(shè)計(jì)§ 4.1 軟件界面設(shè)計(jì)發(fā)展歷程§ 4.2 軟件界面設(shè)計(jì)簡介§ 4.3 軟件界面設(shè)計(jì)的原則§ 4.4 軟件界面設(shè)計(jì)中的屏幕設(shè)計(jì)案例1：繪制軟件中的登錄界面案例2：繪制輸入法皮膚案例3：繪制信息查詢界面案例4：繪制簡單的日歷軟件界面第五章手機(jī)界面設(shè)計(jì)§ 5.1 手機(jī)界面設(shè)計(jì)的重要性§ 5.2 手機(jī)界面設(shè)計(jì)的要求

3、7; 5.3 手機(jī)界面設(shè)計(jì)的特征育人猶如春風(fēng)化雨，授業(yè)不惜蠟炬成灰§ 5.4 手機(jī)界面設(shè)計(jì)的基本常識案例1：繪制手機(jī)界面中的游戲圖標(biāo)案例2:繪制IOS應(yīng)用商店圖標(biāo)案例3:繪制IOS操作系統(tǒng)手機(jī)界面案例4：繪制Android撥號界面第六章播放器界面設(shè)計(jì)§ 6.1 注意人性化設(shè)計(jì)§ 6.2 播放器界面設(shè)計(jì)的原則§ 6.3 情感化因素不可忽視案例1：繪制黑色時尚播放器案例2：繪制簡約時尚播放器案例3：繪制音樂播放器界面第七章大作業(yè)精品教學(xué)教案設(shè)計(jì)| Excellent teaching plan教師課時授課計(jì)劃（1）授課班級授課日期見日志見日志見日志學(xué)生出勤情

4、況見日志見日志見日志課題第一章信息化UI設(shè)計(jì)基礎(chǔ)§1.1理解信息化UI設(shè)計(jì)§1.2數(shù)字化圖像的基礎(chǔ)本次授課目的與要求知識目標(biāo)1、什么是UI設(shè)計(jì)；2、UI設(shè)計(jì)的分類。能力培養(yǎng)目標(biāo)1、能夠熟記UI設(shè)計(jì)的定義；2、能夠掌握UI設(shè)計(jì)的分類。課堂類型實(shí)踐課教具多媒體教學(xué)設(shè)備考核對象全體學(xué)生復(fù)習(xí)舊課要點(diǎn)新課重點(diǎn)1、什么是UI設(shè)計(jì)；2、UI設(shè)計(jì)的分類。新課難點(diǎn)及解決措施1、能夠熟記UI設(shè)計(jì)的定義；2、能夠掌握UI設(shè)計(jì)的分類。多給學(xué)生做演示，講解制作方法。課后總結(jié)及改進(jìn)措施學(xué)生能夠浮見記UI設(shè)計(jì)的定義，并掌握UI設(shè)計(jì)的分類。備課時間2017.9.3主任審閱年月日涉及標(biāo)準(zhǔn)參考工具書授課內(nèi)容時

5、間分配育人猶如春風(fēng)化雨，授業(yè)不惜蠟炬成灰10分一、組織教學(xué)1 、點(diǎn)名簽到35分2 、復(fù)習(xí)舊課二、教學(xué)內(nèi)容一、UI設(shè)計(jì)UI設(shè)計(jì)即為用戶界面設(shè)計(jì)，全稱UI=UserInterface。UI設(shè)計(jì)是為了滿足專業(yè)化、標(biāo)準(zhǔn)化需求而對軟件界面進(jìn)行美化、優(yōu)化和規(guī)范化的設(shè)計(jì)分支。二、UI設(shè)計(jì)分類隨著信息技術(shù)的高速發(fā)展，人們對信息的需求量不斷增加，圖形界面的設(shè)計(jì)也越來越多樣化。UI設(shè)計(jì)主要可以分為手機(jī)界面設(shè)計(jì)、網(wǎng)站設(shè)計(jì)、軟件用戶界面設(shè)計(jì)和游戲界面設(shè)計(jì)等，不同類型的界面設(shè)計(jì)風(fēng)格和特點(diǎn)各不相同。1 .手機(jī)界面設(shè)計(jì)現(xiàn)如今，手機(jī)儼然已經(jīng)成為普通大眾的生活必需品，而手機(jī)的功能也越來越完善，很多高端手機(jī)的性能甚至與電腦不分高

6、下。手機(jī)界面設(shè)計(jì)最大的要求就是人性化，不僅要便于用戶操作，還要美觀大方。2 .網(wǎng)站設(shè)計(jì)近年來，隨著電子商務(wù)的高速發(fā)展，國內(nèi)網(wǎng)站設(shè)計(jì)行業(yè)也正在快速崛起。從最初的純文本網(wǎng)頁到版式古板，配色拙劣，再到現(xiàn)如今的配色新奇，版式多元化，網(wǎng)站設(shè)計(jì)得到了長足發(fā)展。3.軟件用戶界面用戶主要通過軟件與各種機(jī)器設(shè)備進(jìn)行交流，更確切的說，是軟件界面。為了方便用戶使用，軟件界面的設(shè)計(jì)應(yīng)該簡潔美觀、易于操作。4 .播放器界面如今，市場上的各種音樂播放器軟件層出不窮，體驗(yàn)者們不再局限于追求軟件的強(qiáng)大功能，更對軟件界面風(fēng)格提出了新的要求。5 .游戲界面相較于其它軟件界面來說，游戲界面通常都比較華麗、主題鮮明三維效果應(yīng)用非常普

7、遍，具有較強(qiáng)的視覺震撼力。三、學(xué)生自由練習(xí)與教師指導(dǎo)35分10分四、小結(jié)教師課時授課計(jì)劃（2）授課班級授課日期見日志見日志見日志學(xué)生出勤情況見日志見日志見日志課題A章案例1案例2案例3信息化UI設(shè)計(jì)基礎(chǔ)繪制簡潔的開機(jī)按鈕制作網(wǎng)站主頁按鈕制作逼真皮革按鈕本次授課目的與要求知識目標(biāo)1、常見的圖像的格式、模式和類型；2、Photoshop基礎(chǔ)操作；能力培養(yǎng)目標(biāo)1、能夠了解常見的圖像的格式、模式和類型；2、能夠掌握Photoshop基礎(chǔ)操作。課堂類型實(shí)踐課教具多媒體教學(xué)設(shè)備考核對象全體學(xué)生復(fù)習(xí)舊課要點(diǎn)1、什么是UI設(shè)計(jì)；2、UI設(shè)計(jì)的分類。新課重點(diǎn)1、常見的圖像的格式、模式和類型；2、Photosho

8、p基礎(chǔ)操作；新課難點(diǎn)及解決措施1、能夠了解常見的圖像的格式、模式和類型；2、能夠掌握Photoshop基礎(chǔ)操作。多給學(xué)生做演示，講解制作方法。課后總結(jié)及改進(jìn)措施學(xué)生能夠了解常見的圖像的格式、模式和類型，并掌握Photoshop基礎(chǔ)操作。備課時間2017.9.10主任審閱年月日涉及標(biāo)準(zhǔn)參考工具書授課內(nèi)容時間分配10分35分一、組織教學(xué)1 、點(diǎn)名簽到2 、復(fù)習(xí)舊課二、教學(xué)內(nèi)容一、數(shù)字化圖像的基礎(chǔ)日常生活中，人們總會和各種各樣的圖片打交道，這些圖片來自不同的渠道，它們的顏色、格式、體積和用途都不盡相同。常見圖像格式：JPEG格式是目前市面上最常使用的存儲格式，它可以提供優(yōu)質(zhì)照片質(zhì)量的壓縮格式，是目前

9、所有圖像格式中壓縮率最高的，PNG&式主要應(yīng)用于網(wǎng)絡(luò)圖像，可以保存24位真彩圖像，并且支持透明背景和消除鋸齒功能，GIF格式使用的壓縮方式會將圖片壓縮的很小，非常有利于在互聯(lián)網(wǎng)上傳輸，此外它還支持以動畫方式存儲圖像。BMP格式最早應(yīng)用于微軟公司的Windows操作系統(tǒng)，是一種Windows標(biāo)準(zhǔn)的位圖圖形文件格式。TIFF格式便于在應(yīng)用程序和計(jì)算機(jī)平臺之間進(jìn)行數(shù)據(jù)交換，是一種靈活的圖像格式。常見圖像模式：在Photoshop中，“圖像模式”和“顏色模式”是一個概念，PhotoshopCC中共包括9種顏色模式，分別為RGB莫式、CMYKI式、Lab模式、HSB奠式、位圖模式、灰度模式、多通

10、道模式、雙色調(diào)模式和索引顏色模式。常見圖像類型：位圖圖像也稱為點(diǎn)陣圖，它最基本的單位是像素，像素呈方塊狀。矢量圖像是由稱作矢量的數(shù)學(xué)對象定義的直線和曲線構(gòu)成的，它最基本的單位是錨點(diǎn)和路徑，平常所見到和使用的矢量圖形作品是由矢量軟件創(chuàng)建的。二、Photoshop基礎(chǔ)操作Photoshop是目前市面上使用最為普遍的圖像處理與合成軟件，最新的版本為PhotoshopCC本書中的全部操作實(shí)例都將使用PhotoshopCC完成。在使用PhotoshopCC進(jìn)行設(shè)計(jì)操作之前，首先需要將該軟件安裝到計(jì)算機(jī)中，然后雙擊桌面上的快捷方式圖標(biāo)即可成功啟動優(yōu)化酉己置PhotoshopCC對于其他類型的專業(yè)軟件來說，

11、PhotoshopCC算得上是一個消耗系統(tǒng)資源的大戶。為了使PhotoshopCC運(yùn)行能夠更加流暢，各個功能都能正常使用，我們需要在操作前進(jìn)行簡單的設(shè)置，使其工作起來更得心應(yīng)手。執(zhí)行"編輯首選項(xiàng)性能”命令，彈出“首選項(xiàng)”對話框，提高“歷史記錄狀態(tài)”的數(shù)值，并將剩余容量大、不常使用的本地磁盤指定為暫存盤。文件的基本操作：PhotoshopCC文件的基本操作主要包括新建文件、打開文件和存儲文件。圖像的變換：使用PhotoshopCC進(jìn)行設(shè)計(jì)制作時，經(jīng)常需要對各種對象進(jìn)行變換，例如移動位置，縮放、旋轉(zhuǎn)和翻轉(zhuǎn)圖像等。這些操作大部分可以通過執(zhí)行“編輯變換”命令來完成。設(shè)置前景色和背景色：設(shè)置前

12、景色和背景色也是使用極其頻繁的操作。在PhotoshopCC中，用戶可以通過3種方式設(shè)置前景色和背景色，分別為使用“拾色器”對話框，使用“顏色”面板和使用“色板”面板。按鈕的應(yīng)用格式：使用PhotoshopCC制作簡潔的開機(jī)按鈕后，還要將其存儲為We用f用格式的文件，才能應(yīng)用于網(wǎng)頁。常用的We斷用的格式有JPGPNGf口GIF。實(shí)現(xiàn)不同的漸變效果：漸變色可以實(shí)現(xiàn)多個顏色之間平滑過渡的填充效果，在UI設(shè)計(jì)中使用極為頻繁。在PhotoshopCC中，用戶可以通過多種方法創(chuàng)建漸變色。三、學(xué)生自由練習(xí)與教師指導(dǎo)四、小結(jié)35分10分教師課時授課計(jì)劃（3）授課班級授課日期見日志見日志見日志學(xué)生出勤情況見日

13、志見日志見日志課題第二章圖標(biāo)設(shè)計(jì)§ 2.1 了解圖標(biāo)設(shè)計(jì)§ 2.2 標(biāo)設(shè)計(jì)的繪制原則本次授課目的與要求知識目標(biāo)1、什么是圖標(biāo)設(shè)計(jì)；2、圖標(biāo)設(shè)計(jì)的繪制原則；能力培養(yǎng)目標(biāo)1、能夠了解什么是圖標(biāo)設(shè)計(jì)；2、能夠熟記圖標(biāo)設(shè)計(jì)的繪制原則。課堂類型實(shí)踐課教具多媒體教學(xué)設(shè)備考核對象全體學(xué)生復(fù)習(xí)舊課要點(diǎn)1、常見的圖像的格式、模式和類型；2、Photoshop基礎(chǔ)操作；新課重點(diǎn)1、什么是圖標(biāo)設(shè)計(jì)；2、圖標(biāo)設(shè)計(jì)的繪制原則；新課難點(diǎn)及解決措施1、能夠了解什么是圖標(biāo)設(shè)計(jì)；2、能夠熟記圖標(biāo)設(shè)計(jì)的繪制原則。多給學(xué)生做演示，講解制作方法。課后總結(jié)及改進(jìn)措施學(xué)生能夠了解什么是圖標(biāo)設(shè)計(jì)，并熟記圖標(biāo)設(shè)計(jì)的繪制原

14、則。備課時間2017.9.17主任審閱年月日涉及標(biāo)準(zhǔn)參考工具書時間授課內(nèi)容分配10分35分一、組織教學(xué)1 、點(diǎn)名簽到2 、復(fù)習(xí)舊課二、教學(xué)內(nèi)容圖標(biāo)是具有指代性的計(jì)算機(jī)圖形，具有高度濃縮并快速傳達(dá)信息和便于記憶的特點(diǎn)。圖標(biāo)的應(yīng)用范圍非常廣泛，從各種軟硬件到現(xiàn)實(shí)生活到處都可以看到各種圖標(biāo)的影子，可以說我們的生活離不開圖標(biāo)。什么是圖標(biāo)：圖標(biāo)的概念分廣義和狹義兩種。從廣義上來說，圖標(biāo)是指具有指代意義的圖形符號，具有快速傳達(dá)信息和便于記憶的特性。它的應(yīng)用范圍很廣，軟硬件網(wǎng)頁社交場所公共場合無所不在，例如各種交通標(biāo)志和各種軟件圖標(biāo)等。圖標(biāo)設(shè)計(jì)的作用:一個圖標(biāo)是一個小的圖片或?qū)ο?，代表一個文件、程序或命令。

15、圖標(biāo)可以幫助用戶快速執(zhí)行各種命令或打開應(yīng)用程序。止匕外， 圖標(biāo)也用于在瀏覽器中快速展現(xiàn)內(nèi)容。圖標(biāo)設(shè)計(jì)的意義：作為UI界面設(shè)計(jì)的關(guān)鍵部分，圖標(biāo)在 UI交互設(shè)計(jì)中無處不 在。一套成功的圖標(biāo)設(shè)計(jì)不僅需要質(zhì)感精美，引人眼球，更重要的是具有良好的可用性。一般來講，具有強(qiáng)烈質(zhì)感的圖標(biāo)可以為網(wǎng)頁增添亮點(diǎn)，給瀏覽者留下深刻的印象。二、圖標(biāo)設(shè)計(jì)的繪制原則相較于文字來說，圖標(biāo)有著很明顯的優(yōu)勢。比文字更直觀，也更漂亮。在制作圖標(biāo)時，我們也應(yīng)該相應(yīng)的強(qiáng)化圖標(biāo)的優(yōu)勢，降低劣勢。未來軟件界面的設(shè)計(jì)方向是簡潔、實(shí)用、高效?？勺R別性原則：可識別性原則是圖標(biāo)設(shè)計(jì)的首要原則?？勺R別性就是指設(shè)計(jì)的圖標(biāo)應(yīng)該能夠準(zhǔn)確表達(dá)相應(yīng)的操作，讓

16、瀏覽者一看到就能明白它是用來做什么的。與環(huán)境協(xié)調(diào)的原則：圖標(biāo)制作出來以后最終被應(yīng)用到圖形界面中才能體現(xiàn)出價值，獨(dú)立存在的圖標(biāo)是沒有意義的。差異性原則：差異性是指圖標(biāo)之間有明顯的差別，能夠讓人一眼區(qū)分出來不同的圖標(biāo)，這樣才能被瀏覽者所關(guān)注和記憶，并對界面內(nèi)容留有印象。這是圖標(biāo)設(shè)計(jì)的重要原則之一，同時也是最容易被設(shè)計(jì)者忽略的一條原則。視覺效果的原則：視覺效果是指圖標(biāo)設(shè)計(jì)應(yīng)該刻畫質(zhì)感和細(xì)節(jié)，使其更加美觀，滿足使用者的視覺要求。創(chuàng)造性原則：一般在制作圖標(biāo)時都會創(chuàng)建較大尺寸的文檔，或者使用矢量形狀創(chuàng)建圖標(biāo)，制作完成后也會將其保存為不同的尺寸，以滿足不同界面的使用。三、學(xué)生自由練習(xí)與教師指導(dǎo)35分四、小結(jié)

17、10分教師課時授課計(jì)劃（4）授課班級授課日期見日志見日志見日志學(xué)生出勤情況見日志見日志見日志課題第F案例1案例2案例3圖標(biāo)設(shè)計(jì)制作IE瀏覽器圖標(biāo)繪制真實(shí)鏡頭圖標(biāo)繪制手機(jī)信息APP圖標(biāo)本次授課目的與要求知識目標(biāo)1、Photoshop圖層的基本操作；2、案例的制作；能力培養(yǎng)目標(biāo)1、能夠掌握Photoshop圖層的基本操作；2、能夠完成本章案例。課堂類型實(shí)踐課教具多媒體教學(xué)設(shè)備考核對象全體學(xué)生復(fù)習(xí)舊課要點(diǎn)1、什么是圖標(biāo)設(shè)計(jì)；2、圖標(biāo)設(shè)計(jì)的繪制原則；新課重點(diǎn)1、Photoshop圖層的基本操作；2、案例的制作；新課難點(diǎn)及解決措施1、能夠掌握Photoshop圖層的基本操作；2、能夠完成本章案例。多給學(xué)

18、生做演示，講解制作方法。課后總結(jié)及改進(jìn)措施學(xué)生能夠掌握Photoshop圖層的基本操作，并完成本章案例。備課時間2017.9.24主任審閱年月日涉及標(biāo)準(zhǔn)參考工具書授課內(nèi)容時間分配10分35分一、組織教學(xué)1 、點(diǎn)名簽到2 、復(fù)習(xí)舊課二、教學(xué)內(nèi)容Photoshop圖層的基本操作“圖層”在PhotoshopCC中是一個至關(guān)重要的概念，所有的操作和編輯都與之有密切的關(guān)系。那什么是“圖層”呢？簡言之，“圖層”就如同一些堆疊在一起的透明紙張，每一張都存儲著不同的圖像。這些圖像以一定的順序排列在一張，從而構(gòu)成一副完整的圖像。0oloruseprintingyourdraams新建圖層PhotoshopCC中

19、提供了很多種創(chuàng)建新圖層的方法，最常用的兩種分別為是直接在“圖層”面板中創(chuàng)建和通過菜單命令創(chuàng)建。在“圖層”面板中創(chuàng)建新圖層使用“新建”命令新建圖層選擇圖層在PhotoshopCC中對文件進(jìn)行操作時，必須首先選中相應(yīng)的圖層，才能保證當(dāng)前操作的正確應(yīng)用。選擇圖層的操作通常也在“圖層”面板中進(jìn)行。1 .可以選擇單個圖層：2 .可以選擇多個連續(xù)的圖層3 .可以擇多個不連續(xù)的圖層復(fù)制、移動圖層復(fù)制的方法有很多種，同一文檔之間的復(fù)制、不同文檔的復(fù)制、通過命令復(fù)制和復(fù)制局部圖形。在同一文檔之間復(fù)制圖層若要在同一文檔中復(fù)制圖層，只需將相應(yīng)的一個或多個圖層直接拖曳至“圖層”面板下方的“創(chuàng)建新圖層”圖標(biāo)上即可。在不

20、同文檔之間復(fù)制圖層若要在不同文檔之間復(fù)制圖層，選中需要復(fù)制的圖層，執(zhí)行“圖層復(fù)制圖層”命令，或單擊“圖層”面板右上角的擴(kuò)展圖標(biāo),在彈出擴(kuò)展菜單中選擇“復(fù)制圖層”命令，彈出“復(fù)制圖層”對話框，定需要復(fù)制到的文檔，然后單擊“確定”圖標(biāo)即可。使用“通過拷貝的圖層”命令復(fù)制圖層除了將圖層拖曳到“創(chuàng)建新圖層"圖標(biāo)復(fù)制圖層外，用戶也可以執(zhí)行“圖層新建,通過拷貝的圖層”命令，或按快捷鍵【Ctrl+J】快速復(fù)制，如果沒有創(chuàng)建選區(qū)，執(zhí)行該命令可以快速復(fù)制當(dāng)前圖層。復(fù)制局部圖形復(fù)制局部圖像與復(fù)制整個圖層的方式類似。使用“框選工具”或者“魔棒工具”將要復(fù)制的圖形創(chuàng)建選區(qū)，執(zhí)行“圖層新建圖層通過拷貝的圖層”

21、命令，或直接按快捷鍵【Ctrl+J】，即可將選區(qū)內(nèi)的圖像復(fù)制到新的圖層中。鼠標(biāo)直接拖動若要調(diào)整圖層順序，先選中相應(yīng)的圖層，然后將其拖曳到新的位置即可?！芭帕小泵钣脩粢部梢詫Ξ?dāng)前的圖層執(zhí)行“圖層才非列”命令，根據(jù)需求在子菜單中分別選擇置為頂層、前移一層、后移一層、置為底層或反向選項(xiàng)調(diào)整圖層順序。重命名圖層、刪除圖層重命名圖層：若要對圖層名稱進(jìn)行重命名，雙擊相應(yīng)圖層的名稱部分，激活編輯模式，直接輸入新的名稱，然后按【Enter鍵確認(rèn)命名。刪除圖層：先在“圖層”面板中選中相應(yīng)的圖層，單擊面板下方的“刪除圖層”圖標(biāo)，或者直接用鼠標(biāo)拖曳圖層至該圖標(biāo)上刪除。添加圖層樣式：若要為圖層應(yīng)用“圖層樣式”，先選

22、中相應(yīng)的圖層,單擊面板下方的“添加圖層樣式”圖標(biāo)，在彈出的菜單中選擇需要的選項(xiàng)，然后在彈出的“圖層樣式”對話框中設(shè)置參數(shù)值即可。畫筆工具在PhotoshopCC中，“畫筆工具”的應(yīng)用比較廣泛，使用它可以繪制出比較柔和的線條，其效果如同用毛筆畫出的線條。該工具可以設(shè)置畫筆的筆尖形狀、筆刷尺寸、不透明度、流量和噴槍等屬性。如果結(jié)合“畫筆”面板中的各項(xiàng)功能，還能繪制出更多變的筆觸效果。工具預(yù)設(shè).切操畫筆面板.模歪不透明度.流軌經(jīng)面魄壓力控制大小V*3KZ'A-Bz*:福明s：花h=嫁cr厘“由笨他也給畫板壓力控制不透明喚檢模式按班使用“畫筆工具”時，在英文狀態(tài)下，按鍵可減小畫筆的直徑，按【】

23、鍵可增加畫筆的直徑，對于實(shí)邊圓、柔邊圓和書法畫筆，按【Shift+鍵可減小畫筆的硬度，按【Shift+鍵則增加畫筆的硬度。按鍵盤上的數(shù)字鍵可以跳調(diào)整工具的不透明度。按【1】時，不透明度為10%按【5】時，不透明度為50%按【75時不透明度為75%按【0】時不透明度為100%預(yù)設(shè)畫筆工具單擊工具箱中的“畫筆工具”按鈕，在選項(xiàng)欄中單擊“畫筆”選項(xiàng)右側(cè)的按鈕，可以打開“畫筆預(yù)設(shè)選取器”。可以看到很多不同形狀的畫筆，單擊任意畫筆即可使用該畫筆形狀。PhotoshopCC提供了多種類型的畫筆，為了方便選取畫筆，用戶可以通過單擊“畫筆預(yù)設(shè)選取器”面板中右上方的菜單按鈕，在彈出的下拉菜單中改變“畫筆預(yù)設(shè)選取

24、器”的顯示方式，在該菜單中還提供了其它相應(yīng)的選項(xiàng)供用戶選擇。自定義畫筆當(dāng)用戶自定義特殊畫筆時，只能定義畫筆的形狀，而不能定義畫筆的顏色。因?yàn)槭褂卯嫻P繪畫時，顏色都是由前景色的顏色決定的。鋼筆工具PhotoshopCC中的“鋼筆工具”，可用于繪制具有最高精度的路徑，“鋼筆工具”屬于矢量繪圖工具，具優(yōu)點(diǎn)是可以勾畫出平滑的曲線，在縮放或者變形之后仍能保持平滑效果。當(dāng)無法使用普通的形狀工具創(chuàng)建出復(fù)雜的圖形時，就需要用“鋼筆工具”進(jìn)行創(chuàng)建。*.崛*如*國我_Sfi里匕*與。/白g取創(chuàng)建路徑使用“鋼筆工具”可以創(chuàng)建閉合或者不閉合的路徑，單條或多條路徑。使用“鋼筆工具”在畫布中任意位置單擊插入第一個錨點(diǎn)。繼

25、續(xù)在其它位置單擊插入第二個錨點(diǎn)，并拖曳控制手柄控制路徑形狀。使用相同方法插入更多的錨點(diǎn)，并拖曳控制手柄調(diào)整路徑形狀。若要閉合路徑，單擊第一個錨點(diǎn)，并拖曳控制手柄調(diào)整路徑形狀。松開鼠標(biāo)，完成該閉合路徑的創(chuàng)建。%.、.x/)'*1編輯路徑添加錨點(diǎn)工具：使用“添加錨點(diǎn)工具”在路徑上單擊，可在單擊點(diǎn)添加一個錨點(diǎn)。刪除錨點(diǎn)工具：使用“刪除錨點(diǎn)工具”單擊路徑上的某一個錨點(diǎn)，可以將其刪除。轉(zhuǎn)換點(diǎn)工具：使用“轉(zhuǎn)換點(diǎn)工具”單擊路徑的平滑點(diǎn)，可以將其轉(zhuǎn)換為角點(diǎn)；使用“轉(zhuǎn)換點(diǎn)工具”單擊路徑的角點(diǎn)，并拖動控制手柄調(diào)整路徑形狀，可以將其轉(zhuǎn)換為平滑點(diǎn)。路徑選擇工具：使用“路徑選擇工具”單擊路徑的任意部分,即可將整

26、條路徑全部選中。例如要復(fù)制路徑，或者單擊調(diào)整復(fù)合路徑中的單個路徑，就需要首先使用“路徑選擇工具”選中相應(yīng)的路徑。直接選擇工具：用戶可以使用“直接選擇工具”單擊選擇路徑上的單擊錨點(diǎn)，或者拖選多個錨點(diǎn)，并且可以調(diào)整每個錨點(diǎn)的控制手柄。原始路徑形狀平滑點(diǎn)轉(zhuǎn)角點(diǎn)角點(diǎn)轉(zhuǎn)平滑路徑的變換操作使用“路徑選擇工具”選擇路徑，執(zhí)行"編輯變換路徑”命令，在該命令的子菜單中，包括各種變換路徑命令，執(zhí)行路徑變換命令時，當(dāng)前路徑上會顯示出定界框、中心點(diǎn)和控制點(diǎn)。形狀工具PhotoshopCC的“工具箱”中包含5個形狀工具，它們分別是矩形工具、圓角矩形工具、橢圓工具、多邊形工具、直線工具和自定形狀工具。這些工具可

27、以幫助用戶快速創(chuàng)建出許多規(guī)則的、較為常用的形狀，被大量應(yīng)用于UI設(shè)計(jì)與制作。矩形工具、圓角矩形和橢圓工具顧名思義，矩形工具、圓角矩形工具和橢圓工具就是用來創(chuàng)建矩形、圓角矩形和橢圓的，用戶只需要在“工具箱”中單擊選擇相應(yīng)的工具，然后在畫布中拖動即可創(chuàng)建出矩形、圓角矩形或橢圓。多邊形工具和直線工具“多邊形工具”用于在文檔中創(chuàng)建多邊形和星形，“直線工具”用于在文檔中創(chuàng)建直線。自定義形狀“自定形狀工具”允許用戶創(chuàng)建一些出比較常用的形狀，例如各種箭頭、花紋、動物和標(biāo)志等，這些形狀通常無法直接使用規(guī)則的形狀工具創(chuàng)建出來。三、學(xué)生自由練習(xí)與教師指導(dǎo)四、小結(jié)35分10分教師課時授課計(jì)劃（5）授課班級授課日期見

28、日志見日志見日志學(xué)生出勤情況見日志見日志見日志課題第三章網(wǎng)頁設(shè)計(jì) 3.1 了解網(wǎng)頁UI 3.2 3.2網(wǎng)貝界囿構(gòu)成兀素本次授課目的與要求知識目標(biāo)1、什么是網(wǎng)貝UI;2、網(wǎng)貝界囿構(gòu)成兀素；能力培養(yǎng)目標(biāo)1、掌握網(wǎng)貝UI概念；2、掌握網(wǎng)頁界面構(gòu)成元素；課堂類型實(shí)踐課教具多媒體教學(xué)設(shè)備考核對象全體學(xué)生復(fù)習(xí)舊課要點(diǎn)1、Photoshop圖層的基本操作；2、案例的制作；新課重點(diǎn)1、什么是網(wǎng)頁UI;2、網(wǎng)貝界囿構(gòu)成兀素；新課難點(diǎn)及解決措施1、掌握網(wǎng)貝UI概念；2、掌握網(wǎng)頁界面構(gòu)成兀素；多給學(xué)生展示作品并分析，是學(xué)生從講解中領(lǐng)會制作方法。課后總結(jié)及改進(jìn)措施學(xué)生能夠掌握網(wǎng)頁UI概念，并掌握網(wǎng)頁界面構(gòu)成兀素。備課

29、時間2017.10.8主任審閱年月日涉及標(biāo)準(zhǔn)參考工具書時間授課內(nèi)容分配10分35分一、組織教學(xué)1 、點(diǎn)名簽到2 、復(fù)習(xí)舊課二、教學(xué)內(nèi)容一、網(wǎng)頁UI網(wǎng)頁是一個包含文字、圖像和各種多媒體文件的Html文檔,我們根據(jù)網(wǎng)頁的具體內(nèi)容將其劃分為環(huán)境性界面、功能性界面和情感性界面3種類型。什么是網(wǎng)頁設(shè)計(jì)：通俗的說，一張網(wǎng)頁就是一個Html格式的文檔，這個文檔又包含文字、圖片、聲音和動畫等其他格式的文件，這張網(wǎng)頁中的所有元素被存儲在一臺與互聯(lián)網(wǎng)相連接的計(jì)算機(jī)中。當(dāng)用戶發(fā)出瀏覽這張頁面的請求時，就由這臺計(jì)算機(jī)將頁面中的所有元素發(fā)送至用戶的計(jì)算機(jī)，然后再由用戶的瀏覽器將這些元素按照特定的布局方式顯示出來，就是我

30、們實(shí)際看到的網(wǎng)頁的樣子。網(wǎng)頁設(shè)計(jì)的分類：網(wǎng)頁界面根據(jù)具體內(nèi)容和風(fēng)格的不同，大致可以分為三大類型：環(huán)境性界面、情感性界面和功能性界面。1 .環(huán)境性界面環(huán)境性網(wǎng)頁界面所包含的內(nèi)容非常廣泛，包括經(jīng)濟(jì)、文化、科技、時事政治、歷史、民族、宗教信仰和風(fēng)俗習(xí)慣等。2 .情感性界面人是有感情的，當(dāng)一件事物真正的感動了受眾，引起人們在情感上的強(qiáng)烈共鳴，就會被牢牢的記住，網(wǎng)頁設(shè)計(jì)也是如此。3 .功能性界面功能性界面所占的比例很大，主要是用來展示產(chǎn)品和相關(guān)信息的，它實(shí)現(xiàn)的是使用性內(nèi)容。二、網(wǎng)頁界面構(gòu)成元素網(wǎng)頁中的元素多種多樣，其中比較常見的有文字、圖像、動畫、音頻和視頻等，還有通過代碼實(shí)現(xiàn)的各種動態(tài)交互效果。這些元

31、素都各有特點(diǎn)，合格的設(shè)計(jì)師總是可以將不同的元素有條有理的組合在一起，制作出一張美觀協(xié)調(diào)的頁面。文字：文字最大的優(yōu)勢主要體現(xiàn)在兩方面：一是體積小。50個中文字符只占1k,但將這50個漢字以黑色黑體12點(diǎn)存儲為JPG圖像，卻需要至少30k。二是信息傳達(dá)效果明確。同樣一張圖像，在不同的人眼里總是會被解讀成不同的含義。圖像：現(xiàn)如今的網(wǎng)頁設(shè)計(jì)領(lǐng)域可謂是色彩橫行，圖片當(dāng)?shù)赖木置?。這也難怪，畢竟相較于文字來說，具體直觀、色彩豐富的圖像更能刺激人們的感官。色彩：在網(wǎng)頁設(shè)計(jì)中，各種色塊主要用來連接和過渡不同的元素和版塊，從而使頁面整體效果更平衡、協(xié)調(diào)、豐富。多媒體：網(wǎng)頁界面中的多媒體元素主要包括Flash動畫、

32、音頻和視頻，其中Flash動畫的應(yīng)用現(xiàn)在已經(jīng)比較普遍了。35分10分三、學(xué)生自由練習(xí)與教師指導(dǎo)四、小結(jié)教師課時授課計(jì)劃（6）授課班級授課日期見日志見日志見日志學(xué)生出勤情況見日志見日志見日志課題第三章網(wǎng)頁設(shè)計(jì)§ 3.3 頁設(shè)計(jì)的原則§ 3.4 貝界囿布局形式本次授課目的與要求知識目標(biāo)1、網(wǎng)頁設(shè)計(jì)的原則；2、網(wǎng)貝界囿布局形式；能力培養(yǎng)目標(biāo)1、能夠熟記網(wǎng)頁設(shè)計(jì)的原則；2、能夠掌握網(wǎng)貝界囿布局形式。課堂類型實(shí)踐課教具多媒體教學(xué)設(shè)備考核對象全體學(xué)生復(fù)習(xí)舊課要點(diǎn)1、什么是網(wǎng)頁UI;2、網(wǎng)貝界囿構(gòu)成兀素；新課重點(diǎn)1、網(wǎng)頁設(shè)計(jì)的原則；2、網(wǎng)貝界囿布局形式；新課難點(diǎn)及解決措施1、能夠熟記網(wǎng)頁

33、設(shè)計(jì)的原則；2、能夠掌握網(wǎng)貝界囿布局形式。多給學(xué)生展示作品并分析，是學(xué)生從講解中領(lǐng)會及制作方法。課后總結(jié)及改進(jìn)措施學(xué)生能夠熟記網(wǎng)頁設(shè)計(jì)的原則，并能夠掌握網(wǎng)頁界面布局形式。備課時間2017.10.15主任審閱年月日涉及標(biāo)準(zhǔn)參考工具書時間授課內(nèi)容分配10分35分一、組織教學(xué)1 、點(diǎn)名簽到2 、復(fù)習(xí)舊課二、教學(xué)內(nèi)容一、網(wǎng)頁設(shè)計(jì)的原則網(wǎng)頁界面是展現(xiàn)企業(yè)形象、介紹產(chǎn)品和服務(wù)、體現(xiàn)企業(yè)發(fā)展戰(zhàn)略的重要途徑。設(shè)計(jì)之前首先要明確設(shè)計(jì)頁面的目的和用戶需求，從而規(guī)劃出切實(shí)可行的設(shè)計(jì)方案。視覺美觀性原則：視覺美觀是網(wǎng)頁設(shè)計(jì)最基本的原則。巧妙運(yùn)用點(diǎn)、線、面等基本元素，巧妙地互相穿插、互相襯托、互相補(bǔ)充構(gòu)成完美的頁面效果

34、，充分表達(dá)完美的設(shè)計(jì)意境，主題突出原則：網(wǎng)頁界面的具體內(nèi)容應(yīng)針對所服務(wù)對象的不同而具有不同的形式。整體性原則：網(wǎng)頁的整體性包括內(nèi)容上的整體性和形式上的整體性。為用戶考慮原則：使用者優(yōu)先觀念、考慮用戶的網(wǎng)絡(luò)連接、考慮用戶瀏覽器。更新和維護(hù)原則：服務(wù)器及相關(guān)軟硬件的維護(hù)。數(shù)據(jù)庫維護(hù)。內(nèi)容的更新和調(diào)整。制定相關(guān)網(wǎng)站維護(hù)的規(guī)定，將網(wǎng)站維護(hù)制度化、規(guī)范化。做好網(wǎng)站安全管理，防范黑客入侵網(wǎng)站，檢查網(wǎng)站各個功能，鏈接是否有錯。二、網(wǎng)頁界面布局形式網(wǎng)頁界面的設(shè)計(jì)主要有單頁和分欄兩種，在設(shè)計(jì)時會根據(jù)不同的網(wǎng)頁性質(zhì)和頁面內(nèi)容選擇合適的布局形式，頁面布局形式很多常見的網(wǎng)頁可分為以下幾種類型。標(biāo)題性：標(biāo)題型的表現(xiàn)形式

35、是上面是標(biāo)題，網(wǎng)頁下面是文字部分，一些文字文章、公司簡介、注冊頁面多屬于這種類型。左右框架型：左右框架型是一種分為左右布局的網(wǎng)頁，頁面結(jié)構(gòu)非常清楚，使瀏覽者看了一目了然。上下框架性：同左右框架型相似，不同之處在與上下框架型是把網(wǎng)頁分為了上下結(jié)構(gòu)布局的網(wǎng)頁。綜合型：綜合型網(wǎng)頁是一種比較全面的布局方式，它是左右框架型與上下框架型相結(jié)合的表現(xiàn)。動畫型：動畫型是目前非常流行的網(wǎng)頁設(shè)計(jì)表現(xiàn)形式的一種方式，它主要指的是Flash,由于Flash的功能非常強(qiáng)大，所以頁面表達(dá)的信息更形象、直觀，且視覺效果出眾。圖片型：這種類型的網(wǎng)頁設(shè)計(jì)，給人感覺形象、直觀、很精美，通常出現(xiàn)在服裝類網(wǎng)頁、時尚類網(wǎng)頁或是企業(yè)網(wǎng)站

36、，具優(yōu)點(diǎn)非常醒目、美觀、視覺感染力強(qiáng)，但是下載的速度慢。三、學(xué)生自由練習(xí)與教師指導(dǎo)35分10分四、小結(jié)教師課時授課計(jì)劃（7）授課班級授課日期見日志見日志見日志學(xué)生出勤情況見日志見日志見日志課題第三章案例1案例2案例3網(wǎng)頁設(shè)計(jì)繪制網(wǎng)頁中的主體繪制網(wǎng)頁戰(zhàn)中的廣告條繪制網(wǎng)頁的背景和導(dǎo)航欄本次授課目的與要求知識目標(biāo)1、圖層的“不透明度”；2、圖層的“混合模式”；3、蒙版的應(yīng)用能力培養(yǎng)目標(biāo)1、能夠掌握圖層的使用方法；2、能夠掌握蒙版的使用方法；課堂類型實(shí)踐課教具多媒體教學(xué)設(shè)備考核對象全體學(xué)生復(fù)習(xí)舊課要點(diǎn)1、網(wǎng)頁設(shè)計(jì)的原則；2、網(wǎng)貝界囿布局形式；新課重點(diǎn)1、圖層的“不透明度”；2、圖層的“混合模式”；3、

37、蒙版的應(yīng)用新課難點(diǎn)及解決措施1、能夠掌握圖層的使用方法；2、能夠掌握蒙版的使用方法；多給學(xué)生展示作品并分析，是學(xué)生從講解中領(lǐng)會及制作方法。課后總結(jié)及改進(jìn)措施學(xué)生能夠掌握圖層的使用方法，并掌握蒙版的使用方法。備課時間2017.10.22主任審閱年月日涉及標(biāo)準(zhǔn)參考工具書授課內(nèi)容時間分配一、組織教學(xué)1 、點(diǎn)名簽到2 、復(fù)習(xí)舊課二、教學(xué)內(nèi)容一、圖層的“不透明度”在“圖層”面板中有兩個控制圖層不透明度的選項(xiàng)“不透明度”和“填充”。不透明度：“不透明度”用于控制圖層、圖層組中繪制的像素和形狀的不透明度，如果對圖層應(yīng)用了圖層樣式，則圖層樣式的不透明度也會受到該值的影響。10分35分填充：“填充”只影響圖層中

38、繪制的像素和形狀的不透明度，不會影響圖層樣式的不透明度。填充為0%不透明度為37%二、圖層的“混合模式”“混合模式”是PhotoshopCC中一項(xiàng)非常重要的功能。簡單地說，“混合模式”是將當(dāng)前一個像素的顏色與它正下方的每個像素的顏色相混合，以便生成一個新的顏色。正常模式是PhotoshopCC中的默認(rèn)模式。在此模式下編輯或者繪制的每個像素，都將是結(jié)果色，如果圖層的不透明度設(shè)置為100%時，完全遮蓋下方圖層。加深模式組加深模式組的混合模式可將當(dāng)前圖層像素與底層圖像像素進(jìn)行比較，并使底層圖像像素變暗，所以會創(chuàng)建較暗的圖像顏色。減淡模式組減淡模式的特點(diǎn)是當(dāng)前圖像中的黑色會被屏蔽，任何比黑色亮的區(qū)域都

39、可能加亮底層圖像。減淡模式組是與加深模式組相對的混合模式。對比模式組對比模式綜合了加深和減淡模式的特點(diǎn)，混合時50%勺灰色會完全消失，任何亮于50哪色區(qū)域都可能加亮下面的圖像，暗于50唾色的區(qū)域都可能使底層圖像變暗。三、蒙版的應(yīng)用蒙版在PhotoshopCC中已經(jīng)成為一種概念，目的是能夠自由控制選區(qū)，這樣就產(chǎn)生了通道。蒙版可以隨時讀出和更改事先存入的通道，對不同的通道可以進(jìn)行合并和相減等操作。認(rèn)識蒙版蒙版是模仿傳統(tǒng)印刷中的一種工藝，印刷時會用一種紅色的膠狀物來保護(hù)印版，所以在PhotoshopCC中蒙版默認(rèn)的顏色是紅色。蒙版的分類PhotoshopCC提供了3種蒙版，分別是圖層蒙版、剪貼蒙版和

40、矢量蒙版。蒙版的“屬性”面板蒙版“屬性”面板用于調(diào)整選定的濾鏡蒙版、圖層蒙版或矢量蒙版的不透明度和羽化范圍，單擊“圖層”面板中的蒙版再執(zhí)行“窗口屬性”命令或雙擊蒙版，打開“屬性”面板。汨步如碼被： AiRk n皿, i&fl.o tot筋增的，$ 今 1圖層蒙版圖層蒙版是與分辨率相關(guān)的位圖圖像，可使用繪畫或選擇工具進(jìn)行編輯。圖層蒙版是非破壞性的，可以返回并重新編輯蒙版，而不會丟失蒙版隱藏的像素。矢量蒙版矢量蒙版與分辨率無關(guān)，可使用鋼筆或形狀工具創(chuàng)建，它可以返回并重新編輯，而不會丟失蒙版隱藏的像素。在“圖層”面板中，矢量蒙版都顯示為圖層縮覽圖右邊的附加縮覽圖，矢量蒙版縮覽圖代表從圖層內(nèi)容

41、中剪切下來的路徑。剪貼蒙版剪貼蒙版是一種非常靈活的蒙版，它使用一個圖像的形狀限制另一個圖像的顯示范圍，而矢量蒙版和圖層蒙版都只能控制一個圖層的顯示區(qū)域。移動復(fù)制蒙版要將蒙版移到另一個圖層，將該蒙版拖動到其他圖層即可。如果要復(fù)制蒙版，可按住【Alt】鍵將蒙版拖動到另一個圖層。鏈接和取消鏈接蒙版默認(rèn)情況下，圖層或組將鏈接到其圖層蒙版或矢量蒙版，蒙版縮覽圖和圖像縮覽圖之間有一個鏈接圖標(biāo)。三、學(xué)生自由練習(xí)與教師指導(dǎo)四、小結(jié)35分10分教師課時授課計(jì)劃（8）授課班級授課日期見日志見日志見日志學(xué)生出勤情況見日志見日志見日志課題第四章軟件界面設(shè)計(jì) 4.1 4.1軟件界面設(shè)計(jì)發(fā)展歷程 4.2 軟件界面設(shè)計(jì)簡介

42、本次授課目的與要求知識目標(biāo)1、軟件界面設(shè)計(jì)發(fā)展歷程；2、軟件界面設(shè)計(jì)簡介；能力培養(yǎng)目標(biāo)1、能夠了解軟件界面設(shè)計(jì)發(fā)展歷程；2、能夠熟記軟件界面設(shè)計(jì)簡介；課堂類型實(shí)踐課教具多媒體教學(xué)設(shè)備考核對象全體學(xué)生復(fù)習(xí)舊課要點(diǎn)1、圖層的“不透明度”；2、圖層的“混合模式”；3、蒙版的應(yīng)用新課重點(diǎn)1、軟件界面設(shè)計(jì)發(fā)展歷程；2、軟件界面設(shè)計(jì)簡介；新課難點(diǎn)及解決措施1、能夠了解軟件界面設(shè)計(jì)發(fā)展歷程；2、能夠熟記軟件界面設(shè)計(jì)簡介；多給學(xué)生展示作品并分析，是學(xué)生從講解中領(lǐng)會及制作方法。課后總結(jié)及改進(jìn)措施學(xué)生能夠了解軟件界面設(shè)計(jì)發(fā)展歷程，并熟記軟件界面設(shè)計(jì)簡介。備課時間2017.10.29主任審閱年月日涉及標(biāo)準(zhǔn)參考工具書

43、時間授課內(nèi)容分配一、組織教學(xué)1 、點(diǎn)名簽到2 、復(fù)習(xí)舊課二、教學(xué)內(nèi)容一、軟件界面設(shè)計(jì)發(fā)展歷程10分35分軟件用戶界面的發(fā)展經(jīng)歷了從低級到高級，從簡單到復(fù)雜的過程，軟件界面在軟件系統(tǒng)中的價值比越來越重要，好的軟件界面不僅要實(shí)用，還要易用，更要美觀，好的軟件界面不僅可以讓軟件變得個性化，還可以使軟件的操作變得更加舒服、簡單。二、軟件界面設(shè)計(jì)簡介網(wǎng)頁界面設(shè)計(jì)和軟件界面設(shè)計(jì)的區(qū)別很大，網(wǎng)頁設(shè)計(jì)通常側(cè)重于界面的美觀、華麗和時尚，能吸引住游客，軟件界面設(shè)計(jì)則更注重實(shí)用性和功能性。軟件界面設(shè)計(jì)的標(biāo)準(zhǔn)：1 .簡潔、美觀。2 .擁有良好的視覺特征。3 .清晰一致的設(shè)計(jì)，軟件的界面風(fēng)格和色調(diào)應(yīng)該協(xié)調(diào)一致，所有具有

44、相同含義的術(shù)語應(yīng)該統(tǒng)一，且易于理解和使用。4 .較快的響應(yīng)速度。5 .以用戶為中心，站在用戶的角度考慮問題，設(shè)計(jì)和制作用戶需要的界面軟件界面設(shè)計(jì)的分類：軟件界面設(shè)計(jì)的范圍比較廣泛，它是用戶與系統(tǒng)進(jìn)行交互的集合，這些系統(tǒng)不僅僅包括計(jì)算機(jī)系統(tǒng)，還包括某些機(jī)器、硬件設(shè)備和工具等。最常見的軟件界面設(shè)計(jì)包括計(jì)算機(jī)軟件界面設(shè)計(jì)、手機(jī)界面設(shè)計(jì)和播放器界面設(shè)計(jì)。三、學(xué)生自由練習(xí)與教師指導(dǎo)四、小結(jié)35分10分教師課時授課計(jì)劃（9）授課班級授課日期見日志見日志見日志學(xué)生出勤情況見日志見日志見日志課題第四章軟件界面設(shè)計(jì)§4.3 軟件界面設(shè)計(jì)的原則§4.4 軟件界面設(shè)計(jì)中的屏幕設(shè)計(jì)本次授課目的與要

45、求知識目標(biāo)1、軟件界面設(shè)計(jì)的原則；2、軟件界面設(shè)計(jì)中的屏幕設(shè)計(jì)；能力培養(yǎng)目標(biāo)1、能夠掌握軟件界面設(shè)計(jì)的原則；2、能夠熟記軟件界面設(shè)計(jì)中的屏幕設(shè)計(jì)。課堂類型實(shí)踐課教具多媒體教學(xué)設(shè)備考核對象全體學(xué)生復(fù)習(xí)舊課要點(diǎn)1、軟件界面設(shè)計(jì)發(fā)展歷程；2、軟件界面設(shè)計(jì)簡介；新課重點(diǎn)1、軟件界面設(shè)計(jì)的原則；2、軟件界面設(shè)計(jì)中的屏幕設(shè)計(jì)；新課難點(diǎn)及解決措施1、能夠掌握軟件界面設(shè)計(jì)的原則；2、能夠熟記軟件界面設(shè)計(jì)中的屏幕設(shè)計(jì)。多給學(xué)生展示作品并分析，是學(xué)生從講解中領(lǐng)會制作方法。課后總結(jié)及改進(jìn)措施學(xué)生能夠掌握軟件界面設(shè)計(jì)的原則，并熟記軟件界面設(shè)計(jì)中的屏幕設(shè)計(jì)。備課時間2017.11.5主任審閱年月日涉及標(biāo)準(zhǔn)參考工具書授課

46、內(nèi)容時間分配一、組織教學(xué)10分1、點(diǎn)名簽到2、復(fù)習(xí)舊課二、教學(xué)內(nèi)容35分一、軟件界面設(shè)計(jì)的原則易用性：軟件界面中的圖標(biāo)應(yīng)該盡量美觀、簡潔、功能設(shè)置應(yīng)該合理，便于了解和使用，盡可能降低用戶發(fā)生誤操作的概率清晰性：軟件界面的設(shè)計(jì)應(yīng)該清晰易懂，各功能的表述也應(yīng)該盡可能清晰，在視覺上便于理解和認(rèn)知。從用戶的觀點(diǎn)出發(fā)：根據(jù)前期調(diào)研歸納最終用戶的需求和操作習(xí)慣，真正設(shè)計(jì)制作出用戶需要的界面。通俗易懂的語言：軟件界面中使用的語言應(yīng)該盡可能通俗易避，避免使用艱澀難懂的專業(yè)術(shù)語。考慮用戶的熟悉程度：應(yīng)該考慮到大部分用戶是否可以通過自身掌握的常規(guī)知識和經(jīng)驗(yàn)學(xué)會操作軟件。一致性：軟件界面中所有元素的風(fēng)格和色調(diào)應(yīng)該協(xié)

47、調(diào)一致，界面的結(jié)構(gòu)必須清晰合理，且具有一致性。人性化：軟件界面的功能布局和交互流程應(yīng)該更加人性化，允許用戶根據(jù)自己的喜好和操作習(xí)慣定制界面，并能夠保存設(shè)置。靈活性：軟件界面操作方式應(yīng)該靈活多樣，不僅僅局限于單一的工具操作。例如不僅可以通過菜單命令執(zhí)行某一操作，還能通過相應(yīng)的快捷方式完成操作。安全性：用戶能夠自由地做出選擇，并且所有選擇都應(yīng)該是可逆的，在用戶做出危險(xiǎn)的選擇時，系統(tǒng)應(yīng)該接入進(jìn)行提示。二、軟件界面設(shè)計(jì)中的屏幕設(shè)計(jì)布局：屏幕布局因功能的不同考慮的側(cè)重點(diǎn)也要有所不同，各個功能區(qū)要重點(diǎn)突出，功能明顯，在屏幕布局中還要注意到一些基本數(shù)據(jù)的設(shè)置。文字用語：文字用語一定要簡潔明了，盡量避免使用專

48、業(yè)術(shù)語，在屏幕顯示設(shè)計(jì)中，文字也不要過多，要傳達(dá)的信息內(nèi)容一定要清楚、易懂，方便操作使用。顏色：屏幕中的活動對象，色彩應(yīng)該鮮明；盡量避免不兼容的顏色放在一起；若用顏色表示某種信息或?qū)ο髮傩詴r，要使用戶明白所要表達(dá)的信息，并且盡量用常規(guī)準(zhǔn)則來表示。35分10分三、學(xué)生自由練習(xí)與教師指導(dǎo)四、小結(jié)教師課時授課計(jì)劃（10）授課班級授課日期見日志見日志見日志學(xué)生出勤情況見日志見日志見日志課題第四章軟件界面設(shè)計(jì)案例1:繪制軟件中的登錄界面案例2:繪制輸入法皮膚本次授課目的與要求知識目標(biāo)1、應(yīng)用圖層樣式；2、設(shè)置混合模式選項(xiàng)；3、文字工具的使用能力培養(yǎng)目標(biāo)1、能夠掌握應(yīng)用圖層樣式技巧；2、能夠掌握設(shè)置混合模

49、式選項(xiàng)技巧。3、能夠掌握文字工具的使用技巧課堂類型實(shí)踐課教具多媒體教學(xué)設(shè)備考核對象全體學(xué)生復(fù)習(xí)舊課要點(diǎn)1、軟件界面設(shè)計(jì)的原則；2、軟件界面設(shè)計(jì)中的屏幕設(shè)計(jì)；新課重點(diǎn)1、應(yīng)用圖層樣式；2、設(shè)置混合模式選項(xiàng)；3、文字工具的使用新課難點(diǎn)及解決措施1、能夠掌握應(yīng)用圖層樣式技巧；2、能夠掌握設(shè)置混合模式選項(xiàng)技巧。3、能夠掌握文字工具的使用技巧多給學(xué)生展示作品并分析，是學(xué)生從講解中領(lǐng)會制作方法。課后總結(jié)及改進(jìn)措施學(xué)生能夠掌握應(yīng)用圖層樣式、設(shè)置混合模式選項(xiàng)、文字工具的使用技巧。備課時間2017.11.12主任審閱年月日涉及標(biāo)準(zhǔn)參考工具書時間分配10分、組織教學(xué)35分1、點(diǎn)名簽到2、復(fù)習(xí)舊課二、教學(xué)內(nèi)容、應(yīng)用

50、圖層樣式圖層樣式是圖層中最重要的功能之一，通過圖層樣式可以為圖層添加描邊、陰影、外發(fā)光、浮雕等效果，甚至可以改變原圖層中圖像的整體顯示效果。圖層樣式是PhotoshopCC最為強(qiáng)大的功能之一，受到廣大用戶的親睞。添加圖層樣式選擇需要添加圖層樣式的圖層，執(zhí)行“圖層圖層樣式”命令,通過“圖層樣式”子菜單中相應(yīng)的選項(xiàng)可以為圖層添加圖層樣式?！皹邮健泵姘濉皹邮健泵姘逯写娣胖罅砍Ｓ玫念A(yù)設(shè)樣式，用戶可以使用它們快速創(chuàng)建出各種立體效果，提高操作效率。打開“樣式”面板，在“樣式”面板中單擊選擇需要的樣式。導(dǎo)入外部樣式:PhotoshopCC預(yù)設(shè)的圖層樣式相關(guān)均存放在“樣式”面板中,執(zhí)行“窗口樣式”命令即可打

51、開“樣式”面板要導(dǎo)入外部樣式，單擊“樣式”面板右上方的按鈕，在彈出的面板菜單中選擇“導(dǎo)入樣式”選項(xiàng)。顯示“樣式面板”的方式使用“樣式”面板擴(kuò)展菜單中的“僅文本”、“小縮覽圖”、“大縮覽圖”、“小列表”和“大列表”5個選項(xiàng)可以設(shè)置樣式預(yù)覽圖的大小和模式。 期M34» IBSi,心（曲 轉(zhuǎn)片rffift-'-,一士邱,lBSi邑耽-Ht!'孑工五口前|L旭國） 詡劃fi 闞 S5土七五文事 M0#二、設(shè)置混合模式選項(xiàng)除了可以使用圖層的“混合模式”和“不透明度”混合圖層外，PhotoshopCC還提供了一種高級混合圖層的方法，即使用“混合選項(xiàng)”功能進(jìn)行混合。高級混合：填充不透明度、通道、挖空、將內(nèi)部效果混合成組、將剪貼圖層混合成組、透明形狀圖層、圖層蒙版隱藏效果、矢量蒙版隱藏效果?；旌项伾珟А盎旌项伾珟А庇糜诳刂谱罱K圖像中將顯示當(dāng)前圖層中的哪些像素，以及下方可見圖層中的哪些像素。三、文字工具的使用文字是設(shè)計(jì)作品的重要組成部分，