第一篇:Flash動畫視覺效果在網頁設計中的應用論文
摘要:隨著計算機技術的不斷發展,通過Flash設計網頁對提高網頁的質量具有重要的作用。本文網頁動畫設計概述為分析切入點,闡述Flash動畫的視覺運用的意義,最后提出Flash動畫視覺語言在網頁設計中的具體應用。
關鍵詞:網頁設計;Flash;應用
隨著互聯網技術的不斷發展,網絡已經成為人們生活中必不可少的部分,尤其是隨著網頁設計技術的發展,人們對傳統的靜態網頁表現出不滿,因此基于Flash動畫視覺的網頁成為網絡發展的主要趨勢。本文就是利用Flash動畫視覺效果設計網頁,以此增強網頁的視覺效果,提升網頁設計的質量。
1網頁設計的概述
網頁是網民瀏覽網絡信息的重要載體,網頁設計質量直接影響網民瀏覽信息的興趣,因此在網頁設計時既要保證網頁設計內容的質量,也要做到吸引網民眼球的目的,具體要求就是:優化網頁頁面的排版,注重網頁具有清晰的主次,強調中心,色彩和諧,重點突出,當然動態效果不易太多。Flash屬于一種交互式多媒體技術,因此其在網頁設計中的應用具有以下特點:一是Flash動畫的情節表現比較夸張,能夠直接體現設計的核心思想;二是具有交互性優勢。網民可以通過控制系統自主的決定Flash動畫的運行過程,實現了網民的參與性;三是減少網頁制作成本,提高網頁質量。通過Flash動畫可以直觀的表現網頁的核心內容,從而降低了網頁的制作成本。
2Flash動畫的視覺運用的意義
在網頁設計中運用Flash動畫的視覺效果具有重要的現實意義:
2.1能夠提高網頁設計的知名度
網頁設計的最終目的就是吸引眼球,而吸引眼球的關鍵就是在網頁打開的瞬間具有清晰的畫面效果,而通過合理應用視覺可以豐富網頁的效果,從而達到吸引眼球的最終目的。
2.2提高了網頁設計的科學性
傳統的網頁設計以內容為主,雖然內容是網頁設計的關鍵因素,但是在互聯網快速發展的時代背景下,單純的文字設計風格已經不能滿足信息需求者的需要,因此需要充分利用Flash動畫視覺效果,通過對網頁顏色、文字、圖案以及排序等方面的設計,大大優化了網頁設計的科學性,達到了資源的優化配置。以某網頁設計為例,通過對Flash動畫的運用使得瀏覽者在第一眼就獲悉了網頁的主要內容,提高了瀏覽者瀏覽信息的速度。
2.3提升用戶的滿意度
針對當前網絡技術的不斷發展,網頁設計必須要考慮客戶的蛤睡點,例如當客戶在第一眼瀏覽時就被吸引,那么網頁就又存在的必要性,因此網頁設計必須要充分利用Flash動畫視覺效果,通過優化不同視覺元素達到優化網頁設計風格的目的,讓客戶感到品牌意識和對網頁產生依賴感與忠誠感。
3Flash動畫視覺元素在網頁設計中的應用
3.1文字
文字是網頁設計中最主要的元素,也是網民直觀看到的內容。文字承載著重要的網頁信息,因此文字是Flash動畫中的重要媒介物。文字的目的主要有兩個:一是審美功能。文字審美功能的實現主要通過以下手段,文字的排版模式、文字的圖形構成以及文字的視覺設計等等。以文字的排版設計為例,文字的不同排版模式對Flash動畫設計的視覺影響是不同的,比如字體之前的子距對網民游覽信息的質量是有影響的,如果字距過小,就會導致網民瀏覽信息時表現的比較吃力,進而導致他們對該網頁內容失去興趣;二是傳遞信息。傳遞信息是文字的重要目的。實現傳遞目的的功能就需要從:(l)合理選擇字體的搭配。在Flash動畫設計中,選擇合適的字體搭配可以吸引眼球,從而提高網頁信息傳播的速度。具體的搭配原則是“大標題、小內文‘、”字體少、字型少“.(2)字的變形設計。合理的字型變化可以吸引眼球。(3)特殊效果字體應用。特效文字應用應該注意,素面反白字、圖片上反白字、圖片上設計字等問題。
3.2圖形
圖形是美化網頁內容的重要形式,圖形設計的主要目的是建構能表達信息內容的、視覺形式的、獨立完整而有序的”語句“,因此圖形的設計應該遵循:設計主題定位準確、。符合受眾者心理與社會心理的需求、。設計主題避免”一般化“、。圖形與字體、色彩等因素協調統一的原則。因此將圖形元素在網頁設計中應用時需要注意以下問題:一是保證圖形的簡單,能夠直觀的體現網頁的核心內容。能夠通過圖像直接了解到設計的最終目的。例如在Flash動畫設計中可以采取平面化圖形(見圖1);二是圖形在設計時需要具有一定的藝術性,優秀的設計創意,無疑會打動人并激發人的思想感情,吸引人去關注設計所表達的思想內容,從而達到圖形藝術設計所要表達的視覺傳達信息的目的。
3.3色彩
色彩是刺激人的視覺感官的,也是Flash動畫設計的重要形式內容。將色彩應用到Flash動畫設計中主要是從以下人手:一是色彩的形式。色調是Flash動畫內容的理性感覺,因此需要設計統一的色調,以此實現畫面的美感;二是色彩的心理感覺。當人觀看到色彩之后會刺激大腦,進而產生一種情感心理活動,可以說色彩對人的影響是不同的,不同的人在不同的環境下會相同的色彩會產生不同的心理變化,但是其還是存在一定的共性的,因此需要側重色彩的冷暖感、輕重感以及軟硬感;三是現代色彩設計。網頁動畫設計的演示平臺多為數字化終端設備,另外在色彩的運用過程中,由于生活的地理位置、文化修養等的不同,不同的人群對色彩的喜惡程度有著很大的差異。總而言之,正確選擇動畫中的色彩,有助于利用動畫中的背景、角色等元件對欣賞者進行心理暗示,達到突出主題的效果。
一個Flash動畫的制作是一項既復雜嚴謹又充滿創造性的工作,它需要設計者掌握動畫的基本原理和動畫的系統知識,更需要設計者把美的形式規律同現代網頁動畫設計的具體問題相結合起來,認真研究、掌握并主動地、有意識地運用這些規律,才能創作出好的作品。
參考文獻:
[1]張蕾。網頁設計中Flash動畫的視覺應用[J].2009,08.[2]阿依夏木·力提甫。偽碼調相系統的Simulink仿真設計與實現[J].新疆師范大學學報(自然科學版),2013,04:39~42.
第二篇:flash網頁設計畢業(論文)
遼寧警察學院畢業設計(論文)
Flash網頁設計
系: 高職計算機系 專業: 計算機應用技術 學生: 陶帥帥 指導教師:楊 虹
完成日期:2017年4月3日
遼寧警察學院畢業設計(論文)
Flash網頁設計
總計 畢業設計(論文)表格 0表 插圖 24幅
頁
摘 要
本論文主要論述了本人所做畢業設計課題《Flash網頁設計》的技術背景、設計理念、概要設計、詳細設計以及最后效果展示等方面內容,詳細的介紹了本人對于設計簡單Flash網頁的一整套設計過程和相關技術難點的解決方法。
Flash設計網頁成為越來越多動漫愛好者和非動漫愛好者獲得信息和交流的平臺,它滿足了廣大用戶隨時隨地進行交流和溝通的需要,為網上用戶提供交流場所,實現高效動態信息交換,而網頁恰恰是由一個個小小的網頁集結而成,沒有網頁就沒有強大的網頁?,F在雖然有很多動漫網頁,但版面千篇一律,缺乏個性化、前瞻性,頁面設計混亂,不利于用戶查看,網頁的交互性比較差,因此我針對以上問題為動漫網頁設計一個個性化的動漫網頁。關鍵詞:動漫網頁,Flash
I
Abstract This paper mainly discusses the graduation design which I do the Anime Web Design Theme of technical background, design concept design, detailed design, summary and display effect etc, detailed introduces himself to design a simple Flash web design process and related technical difficulties in solving methods.Animation design website become more and more anime fans and the anime fans access to information and communication platform, it can meet the the needs of the masses of users communicate and communication anytime and anywhere, provide communication place for online users, efficient dynamic information exchange, and site is composed of little web pages gathering, no web, no powerful web site.Although there are a lot of DongManWang stand now, but the layout of the same, the lack of personalized, prospective, page design, unfavorable to the user to see, website interactivity is poorer, so I have to solve above problems as DongManWang station design a personalized anime web pages.Key words: Web Design;Flash;Flash web design
II
目錄
前 言..............................................................................................................................1 第1章 概述..................................................................................................................2
1.1 Flash軟件的介紹.........................................................................................2 1.1.1Flash的歷史.......................................................................................4 1.2 Flash軟件的特點.........................................................................................4 1.2.1普通網頁設計的特點.........................................................................4 1.2.2Flash網頁...........................................................................................5 第2章 網頁設計的開發工具與開發語言..................................................................7
2.1 網頁使用的開發工具.....................................................................................7 2.1.1Macromedia Flash 8.0 Pro..............................................................7 2.1.2Adobe Photoshop CS2........................................................................7 2.2 網頁開發語言.................................................................................................7 第3章 Flash網頁設計中的各種技術解析................................................................9
3.1 主頁界面設計解析.........................................................................................9 3.1.1Flash網頁加載時的進度條設計..........................................................9 3.1.2網頁LOGO與站點設計...................................................................10 3.1.3網頁導航條的設計.............................................................................10 3.1.4進入主頁界面前動態效果設計.........................................................12 3.1.5進入主頁時的音效設置.....................................................................13 3.2 “賞漫軟件”Flash子頁面設計......................................................................14 3.2.1“賞漫軟件”目錄的制作..................................................................14 3.2.2賞漫軟件的圖片文字介紹部分制作.................................................15 3.3 “精品動漫”Flash子頁面設計......................................................................15 3.4 “酷站導航”Flash子頁面設計......................................................................17 3.5 “酷炫漫畫”Flash子頁面設計......................................................................18 3.6 “關于作品”Flash子頁面設計......................................................................19 結論..............................................................................................................................20 致謝..............................................................................................................................21 參考文獻......................................................................................................................22 III
遼寧警察學院高職計算機畢業設計(論文)
前 言
世界因Internet的出現而在逐步改變,網絡經濟雛形因此而形成,由于Internet具有信息容量大、方便迅速、形態多樣、覆蓋全球等特點,直至今日已發展成為信息傳播的主要載體,所以幾乎全球的各個企業、機構紛紛建立自己的web站點。Internet信息資源龐大、圖文互動、高速高效的特點給傳統設計媒體帶來了巨大的沖擊,再加上網絡經濟對設計行業的影響,由此而產生了一個新的設計領域--網頁設計。
Flash產業作為我國發展中的產業,網頁設計技術的發展推動了該產業的傳播,使得各類Flash網頁紛紛崛起,為廣大Flash愛好者帶來了諸多便利。
本課題設計的是一個以Flash設計為主題的網頁設計,以信息發布、分享為主要的。通過發布一些關于Flash的信息、圖片和Flash等為有同樣喜好的人們提供一個分享的空間。同時訪客用戶可以在網頁中的劇情交流上發表自己的看法以及可供共享的信息,使人們在獲取信息的同時,還可以發表自己的感受。在如今網絡高速發展的時代,發布信息與分享興趣已成為大多網頁設計的主要目的。
Flash網頁設計
第1章 概述
Flash網頁設計是指用用Flash軟件制作的網頁,網頁內容多數甚至全部是Flash。全Flash網頁基本以圖形和Flash為主,所以比較適合做那些文字內容不太多,以平面、Flash效果為主的應用。如:企業品牌推廣、特定網上廣告、網絡游戲、個性網頁等。
在因特網飛速發展的今天,多姿多彩的網絡頁面總是讓我們目不暇接,創建富有個性的個人主頁更是每一個網絡愛好者的夢想。作為一個優秀的多媒體網頁設計平臺,Flash從眾多的網頁設計軟件中脫穎而出,成為大多數網絡愛好者設計網頁的首選工具。能夠為大多數人所認同的東西總有它的獨特之處,Flash正是以其獨特的魅力征服了網絡發燒友。
首先,Flash的一個很重要的特點是創建的文件體積很小,Flash是完全基于矢量的Flash處理技術,而矢量圖形就是用少量的向量數據來描述一個復雜的對象,存儲時只占很小的空間,而且圖像的質量也很高。想必許多網友們也曾對自己掛在網上的一些Flash作品的體積擔心,那么,用Flash來創建網絡Flash作品也正是我們的首選。
其次,Flash使用的是插件的工作方式,用戶只要安裝一次插件,以后就可以快速啟動并觀看Flash,而不必像Java那樣,每次都要花費大量的時間啟動虛擬機。
再次,Flash動漫采用的是“流式”的Flash播放技術,用戶不必等到Flash下載完全再去欣賞,而是一邊下載一邊欣賞。
最后,Flash簡單易學,盡管它不能像一門高級語言一樣進行編程,但功能還是很廣泛的。使用內置的ActionScript語句結合JavaScript,也可以制作出互動性很強的主頁來
1.1 Flash軟件的介紹
Flash是美國Macromedia公司所設計的一種二維矢量動畫軟件(現Adobe公司產品),用于設計和編輯Flash文檔,最新版本為:Animate CC 2015.5。Flash通常也指Macromedia Flash Player(現Adobe Flash Player),用于播放Flash文檔。
遼寧警察學院高職計算機畢業設計(論文)
檔案格式:
圖1-1影片檔
“swf ”這是一個完整的影片檔,無法被編輯。有時會被念做“swiff”。Swf在發布時可以選擇保護功能,如果沒有選擇,很容易被別人輸入到他的原始檔中使用。然而保護功能依然阻擋不了為數眾多的破解軟件,有不少閃客專門以此來學習別人的程序代碼和設計方式。
圖1-2原始檔
“fla ”是Flash的原始檔,只能用Macromedia Flash打開編輯或Adobe Flash CS3及更高版本打開編輯
Actionscript是一種程序語言的簡單文本文件.FLA檔案能夠直接包含Actionscript, 但是也可以把它存成AS檔做為外部連結檔案(如定義ActionScript類則必須在寫在as文件里,再通過import加入類),以方便共同工作和更進階的程序修改。
Flash 是一種創作工具,設計人員和開發人員可使用它來創建演示文稿、應用程序和其它允許用戶交互的內容。Flash 可以包含簡單的Flash、視頻內容、復雜演示文稿和應用程序以及介于它們之間的任何內容。通常,使用 Flash 創作的各個內容單元稱為應用程序,即使它們可能只是很簡單的Flash。您也可以通過添加圖片、聲音、視頻和特殊效果,構建包含豐富媒體的 Flash 應用程序。
Flash 特別適用于創建通過 Internet 提供的內容,因為它的文件非常小。Flash 是通過廣泛使用矢量圖形做到這一點的。與位圖圖形相比,矢量圖形需要的內存和存儲空間小很多,因為它們是以數學公式而不是大型數據集來表示的。位圖圖形之所以更大,是因為圖像中的每個像素都需要一組單獨的數據來表示。
Flash網頁設計
1.1.1Flash的歷史
Flash是由macromedia公司推出的交互式矢量圖和 Web 動畫的標準,由Adobe公司收購。做Flash動畫的人被稱之為閃客。網頁設計者使用 Flash 創作出既漂亮又可改變尺寸的導航界面以及其他奇特的效果。Flash的前身是Future Wave公司的Future Splash,是世界上第一個商用的二維矢量動畫軟件,用于設計和編輯Flash文檔。1996年11月,美國Macromedia公司收購了Future Wave,并將其改名為Flash。后又于2005年12月3日被Adobe公司收購。Flash通常也指Macromedia Flash Player(現Adobe Flash Player)。2012年8月15日,Flash退出Android平臺,正式告別移動端。2015年12月1日,Adobe將動畫制作軟件Flash professional CC2015升級并改名為Animate CC 2015.5。
Flash的過去無疑是異常輝煌的,然而它的現在和將來卻飽受非議。在移動互聯網和Html5的強烈沖擊之下,Flash在網頁方面的應用逐漸衰退,如今已經很難再看到純正的Flash整站了。有人因此斷言Flash已經成為一種“過時”的、“應被拋棄”的技術,更有人提出“Flash將死”的預言。然而,換一種客觀的眼光來看現實情形,就會發現Flash并未完全衰退,在網頁游戲、互動設計、媒體應用、教育課件等領域,仍然能夠看到Flash異常活躍的身影。在動畫效果的流暢性、互動設計的便捷性、代碼開發的簡易性、程序應用的廣泛性等方面,目前還沒有任何一款軟件能夠與Flash相比擬。因此,也有許多開發者認為Flash還“大有可為”。無論Flash的未來何去何從,在當下,它仍然是一門值得所有人認真學習的技術。特別是對于有志成為網頁設計師的學習者而言,Flash更是一門必修課。
1.2 Flash軟件的特點
1.2.1普通網頁設計的特點
網頁設計要注意的兩個要點:整體風格和色彩搭配。
1、確定網頁的整體風格
網頁的整體風格及其創意設計是最難以學習的。難就難在沒有一個固定的模式可以參照和模仿。給你一個主題,任何兩人都不可能設計出完全一樣的網頁。
風格(style)是抽象的。是指站點的整體形象給瀏覽者的綜合感受。這個“整體形象”包括站點的CI(標志、色彩、字體、標語)、版面布局、瀏覽方式、4
遼寧警察學院高職計算機畢業設計(論文)
交互性、文字、語氣、內容價值、存在意義、站點榮譽等等諸多因素。舉個例子:我們覺得網易是平易近人的,迪斯尼是生動活潑的,IBM是專業嚴肅的。這些都是網頁給人們留下的不同感受。
在這里,我提供給大家一些參考經驗:
(1)將你的標志logo,盡可能的放在每個頁面上最突出的位置。(2)突出你的標準色彩。
(3)總結一句能反映貴站精髓的宣傳標語!
(4)相同類型的圖像采用相同效果,比如說標題字都采用陰影效果,那么在網頁中出現的所有標題字的陰影效果的設置應該是完全一致的!
2、網頁色彩的搭配
無論是平面設計,還是網頁設計,色彩永遠是最重要的一環。當我們距離顯示屏較遠的時候,我們看到的不是優美的版式或美麗的圖片,而是網頁的色彩。
關于色彩的原理有許多,在此我們不可能一一闡述,大家可以看看相關設計書籍,有利于系統地理解。在此我們僅僅想告訴大家一些網頁配色時的小技巧。
(1)用一種色彩。這里是指先選定一種色彩,然后調整透明度或者飽和度,這樣的頁面看起來色彩統一,有層次感。
(2)用兩種色彩。先選定一種色彩,然后選擇它的對比色。
(3)用一個色系。簡單的說就是用一個感覺的色彩,例如淡藍,淡黃,淡綠;或者土黃,土灰,土藍。
3、在網頁配色中,還要切記一些誤區:
(1)不要將所有顏色都用到,盡量控制在三至五種色彩以內。
(2)背景和前文的對比盡量要大(絕對不要用花紋繁復的圖案作背景),以便突出主要文字內容。
1.2.2Flash網頁
Flash網頁具有設計精美,擁有更多聲效、Flash、流媒體剪輯、美術效果及兼顧互動性等特征,非常適合公司作在線產品展示。Flash網頁基本以圖形和Flash為主,所以比較適合做那些文字內容不太多,以平面、Flash效果為主的應用。如:企業品牌推廣、特定網上廣告、網絡游戲、個性網頁等。
制作全Flash網頁和制作Html網頁類似,事先應先在紙上畫出結構關系圖,包括:網頁的主題、要用什么樣的元素、哪些元素需要重復使用、元素之間的聯系、元素如何運動、用什么風格的音樂、整個網頁可以分成幾個邏輯塊、各個邏輯塊間的聯系如何、以及你是否打算用Flash建構全站或是只用其做網頁的前期
Flash網頁設計
部分等等,都應在考慮范圍之內。
實現全Flash網頁效果多種多樣,但基本原理是相同的:將主場景作為一個“舞臺”,這個舞臺提供標準的長寬比例和整個的版面結構,“演員”就是網頁子欄目的具體內容,根據子欄目的內容結構可能會再派生出更多的子欄目。主場景作為“舞臺”基礎,基本保持自身的內容不變,其它“演員”身份的子類、次子類內容根據需要被導入到主場景內。
遼寧警察學院高職計算機畢業設計(論文)
第2章 網頁設計的開發工具與開發語言
2.1 網頁使用的開發工具
2.1.1Macromedia Flash 8.0 Pro Macromedia Flash 8.0 Pro相對于Macromedia Flash MX 2004增強了為移動設備開發的功能,方便創建Flash Web增強的網絡視頻。雖然有更高的版本,但是Macromedia Flash 8.0 Pro仍是現在最主流的Flash制作軟件,配合其內置的ActionScript 2.0能夠完美實現網站設計中所需要的各種動態效果和交互效果,而我此次所做的Flash網站就是在Macromedia Flash 8.0 Pro的環境下制作。
新版本的Flash 8中引入了幾種高級技術:實時渲染濾鏡、運行時位圖緩沖、FlashType字體渲染引擎、自定義淡入淡出功能、改進的視頻播放組件、增強的文本工具、增強的描邊屬性、高級漸變控制。其中一種非常棒的技術是,Macromedia減輕了Flash Player 8的渲染工作,在Flash文件中使用標簽,Flash Player 8現在可以在用戶與Flash文件交互時實時渲染濾鏡。這意味著Macromedia已經能夠合并內建的濾鏡效果,象陰影、模糊、內外發光、倒角、漸變倒角、顏色調整,以獲得更豐富的用戶體驗。這些濾鏡或可視效果能夠被應用到影片剪輯(MovieClips)和文本域,當在網頁中運行時,通過播放器渲染并顯現出來。2.1.2Adobe Photoshop CS2 作為Adobe公司出品的最出色的圖形圖像處理軟件,Photoshop以其強大的功能向我們證明著它的名至實歸。在falsh網頁設計時一些圖片素材如背景圖片、按鈕、LOGO等在載入Flash庫前有必要用Photoshop做適當的處理.2.2 網頁開發語言
Html(Hyper Text Markup Language)即超文本標記語言或超文本鏈接標示語言,它是一種計算機程序語言,是目前網絡上應用最為廣泛的語言,也是構成網頁文檔的主要內容。
Html文件是用ASCLL代碼編寫成的,可以保存為最簡單的TXT文本文件,Flash網頁設計
這樣用任何一個文字處理軟件都可以進行編寫,這也是他能夠迅速迅速普及,并十分受歡迎的一個原因。
遼寧警察學院高職計算機畢業設計(論文)
第3章 Flash網頁設計中的各種技術解析
3.1 主頁界面設計解析
3.1.1Flash網頁加載時的進度條設計
(1)新建Flash文檔index.fla,設置舞臺的大小為550*550像素,設置背景的顏色為#786e28。
(2)建立進度條設計主要是幫助觀察Flash網頁載入的進度,建立進度條設計樣式如圖3-1,時間軸上各層設計如圖3-2。
圖3-1進度條
圖3-2進度條在時間軸上各層
Actions:幀1代碼: total = _root.getBytesTotal();loaded = _root.getBytesLoaded();baifenshu = int((loaded/total)*100);baifenbi = baifenshu+“%”;setProperty(“jindutiao”, _xscale, baifenshu);Actions:幀2代碼:
Flash網頁設計
if(baifenshu == 100){
gotoAndPlay(4);} else { gotoAndPlay(1);} 3.1.2網頁LOGO與站點設計
網頁LOGO設計:
(1)新建圖形元件“元件42”。
(2)利用矩形工具建立一個白色矩形,在矩形正中建立一稍小些的背景色矩形形成白色矩形框。
(3)利用任意變形工具將白色矩形框變形成為白色平行四邊形框。用線條工具進行分割裁剪,旋轉變換得到要設計的網頁LOGO。(如圖3-3)
圖3-3 logo展示圖
3.1.3網頁導航條的設計
(1)新建圖形元件“元件22”(如圖3-4),作為導航條背景。
圖3-4導航條背景
遼寧警察學院高職計算機畢業設計(論文)
(2)建立6個圖形元件分別在各元件中設計各導航按鈕文字,字體樣式雅黑,字號12,顏色黑色,分別載入各影片剪輯做出動態效果,對應每個影片剪輯做一個與影片剪輯等大的按鈕,按鈕與影片剪輯放于不同層疊加在一起均勻排列與導航條上(如圖3-5)。
圖3-5導航按鈕
(3)給每個按鈕附加動作。(如圖3-6)
圖3-6按鈕b1動作目錄
代碼如下: 圖層4:幀1: stop();元件11: on(rollOver){ } on(press){
} 元件11: on(rollOut){
gotoAndPlay(1);
tellTarget(“/”){
}
loadMovieNum(“index101.swf”, 100);
gotoAndPlay(2);11
Flash網頁設計
} on(press){
} 圖層4:幀9: Stop(); 元件11: on(rollOut){ } on(press){
} 3.1.4進入主頁界面前動態效果設計
(1)新建圖形元件“元件29”,創建長條圖行,作為三個小窗口推薦酷站、本站作品、站內更新的上框(如圖3-7)。建立三個圖形元件分別制作各個小窗口的名稱(如圖3-8)。
圖3-7小窗口的上框 圖3-8小窗口的名稱
tellTarget(“/”){
}
loadMovieNum(“index101.swf”, 100);
gotoAndPlay(1);
tellTarget(“/”){
}
loadMovieNum(“index101.swf”, 100);
(2)新建圖像元件,在其上創建與小窗口等大的白色和背景色的矩形色塊,在不同圖層中各小窗口的上框和窗體依次在時間軸上載入并做形狀補間Flash(如圖3-9)。
遼寧警察學院高職計算機畢業設計(論文)
圖3-9小窗口動態載入效果時間軸設置
(3)導航條、網頁頭尾的圖片條以相同方式在時間軸上依次載入并做形狀補間效果(如圖3-10),就可以完全載入主頁界面獲得完整的主頁框架界面。
圖3-10導航條、網頁頭尾的圖片動態載入效果時間軸設置
3.1.5進入主頁時的音效設置
(1)挑選合適的音效載入庫中。
(2)選擇適當的音效添加到時間軸上的適當位置(如圖3-11),使動態效果更具表現力。
圖3-11在時間軸上添加聲音效果
主頁框架界面到現在已經基本上設計完成了,主頁框架界面為一個獨立的Flash文檔,發布之后形成index.swf文件。此外,我們還要針對各個導航卡設計其對應的swf文件,各swf文件之間通過as代碼連接形成一個整體,則構成了本Flash網頁的主體結構,再通過as代碼連接一些必要的網頁就構成了一個完整
Flash網頁設計
Flash網頁。以下幾章我將對各個導航卡所對應的.swf文件及它們所鏈接的網頁頁面的制作做進一步的詳細說明。
3.2 “賞漫軟件”Flash子頁面設計
3.2.1“賞漫軟件”目錄的制作
“賞漫軟件”子頁面載入效果和“迷你游戲”子頁面相仿不再贅述。賞漫軟件目錄的制作大體上與游戲目錄相仿,所不同的是不需要轉換和滑動,也就比游戲目錄要好做多,同時目錄中軟件按鈕的制作也和游戲目錄中按鈕一樣,再此不在贅述目錄和按鈕的制作方法。我們來看一下做好的目錄的大概形狀樣式(如圖3-12),用以上做目錄的經驗可以輕松做好。
按鈕附加動作代碼: on(press){
} unloadMovieNum(3);loadMovieNum(“此處最好填所連接swf文件的相對位置”, 2);
圖3-12軟件目錄樣式
遼寧警察學院高職計算機畢業設計(論文)
3.2.2賞漫軟件的圖片文字介紹部分制作
該部分是以一個小的swf文件單獨存在的,在點擊軟件按鈕時會載入相應的swf文件在界面的適當位置。
接下來我們來做一下這個小swf文件,就那ACDSee圖片瀏覽軟件所對應的swf文件來說明吧。
(1)新建空白fla文件,命名.fla。將通過Photoshop設計好ACDSee軟件的圖片素材,載入到s2庫中。并生成影片剪輯。以影片剪輯動態效果實現是通過逐幀Flash方式完成的(如圖3-13至3-14)
圖3-13本影片剪輯動態效果的時間軸設置
圖3-14本影片剪輯動態效果
3.3 “精品動漫”Flash子頁面設計
“精品動漫”Flash子頁面是一個與前幾個子頁面略有不同的子頁面,頁面的設計風格與前幾個頁面有些許差異,不規則的背景使得頁面整體顯得翹起生動。(如圖3-15)子頁面載入動態效果及顯示出動漫按鈕前的動態效果在前面都有涉及不在贅述。
Flash網頁設計
圖3-15“精品動漫”Flash子頁面
(1)新建空白fla文件,命名為index003。將通過Photoshop設計好Flash按鈕圖片素材,大小50*50像素,載入到index003庫中。
(2)新建圖形元件,將圖片載入圖形元件中并在圖片上面覆蓋一層多半透明的與圖片等大的色塊。(如圖3-16)
圖3-16圖像上覆蓋了透明色塊的圖形元件
(3)將圖像元件做成按鈕,按鈕元件第一幀是將該圖形元件透明度略調高一些(如圖3-17),在第二三幀恢復正常(如圖3-18)。
遼寧警察學院高職計算機畢業設計(論文)
圖3-17按鈕第一幀
圖3-18按鈕第二三幀
(4)給每個按鈕附加動作代碼以連接到要播放的swf文件。代碼如下: on(press){
} tellTarget(“/”){ } loadMovieNum(“xinFlash9.swf”, 2);3.4 “酷站導航”Flash子頁面設計
目錄的制作、按鈕的制作、子頁面載入動態效果及顯示目錄時的動態效果等在前面都有涉及不在贅述。這里僅提供該子網頁設計好后的最后效果。(如圖3-19)
Flash網頁設計
圖3-19“酷站導航”子網頁設計好后的效果
其中各個網頁按鈕附加動作的代碼為: on(press){ } 其中對網頁的圖片展示和介紹部分同“賞漫軟件”子頁面中的小swf文件制作方法一致,可仿照其制作不再贅述。loadMovieNum(“需要讀取的swf文件的相對url地址”, 2);3.5 “酷炫漫畫”Flash子頁面設計
絕大部分和“賞漫軟件”子頁面中的設計保持一致,只是按鈕需要重新制作,右側的圖片展示部分也沒太多的改變,完全可以仿照其設計制作不再贅述。再次提供該子網頁設計好后的最后效果。(如圖3-20)
遼寧警察學院高職計算機畢業設計(論文)
圖3-20“酷炫漫畫”子網頁設計好后的效果
3.6 “關于作品”Flash子頁面設計
本網頁就只有一個文字面板,文字面板的設計和其他頁面中目錄的設計比較相似,都是先在圖形元件中設計好其輪廓和背景,再在時間軸上通過形狀、亮度、透明度改變進行形狀補間最終獲得文字面板(如圖3-21)。再次提供該子網頁設計好后的最后效果。(如圖3-22)
圖3-21文字面板設計在時間軸上的設置
圖3-22“關于作品”子網頁設計好后的效果
Flash網頁設計
結論
Flash網頁具有設計精美,擁有更多聲效、Flash、流媒體剪輯、美術效果及兼顧互動性等特征,非常適合公司作在線產品展示。Flash網頁基本以圖形和Flash為主,所以比較適合做那些文字內容不太多,以平面、Flash效果為主的應用。如:企業品牌推廣、特定網上廣告、網絡游戲、個性網頁等。
制作全Flash網頁和制作Html網頁類似,事先應先在紙上畫出結構關系圖,包括:網頁的主題、要用什么樣的元素、哪些元素需要重復使用、元素之間的聯系、元素如何運動、用什么風格的音樂、整個網頁可以分成幾個邏輯塊、各個邏輯塊間的聯系如何、以及你是否打算用Flash建構全站或是只用其做網頁的前期部分等等,都應在考慮范圍之內。
因為本人水平有限,雖然已從很多方面進行闡述和講解,但終究是不能十全十美的,理論與實際永遠是有距離的。希望能在今后的學習和工作中能不斷完善、進步!
遼寧警察學院高職計算機畢業設計(論文)
致謝
畢業設計完成之際,我由衷地感謝楊虹老師的大力幫助和支持,感謝我的同學和朋友,在我遇到各種各樣復雜問題的時候,給予我鼓勵和幫助,使我分析問題和解決問題能力有了很大提高
本論文是在楊虹老師的悉心指導下完成的。楊虹老師淵博的專業知識,誨人不倦的高尚師德,嚴以律己、寬以待人的崇高風范,樸實無華、平易近人的人格魅力對我影響深遠。不僅使我樹立了遠大的學術目標,還使我明白了許多待人接物與為人處世的道理。所有這一切都將成為我受益終生的寶貴財富!本論文從選題到完成,每一步都是在導師的指導下完成的,傾注了導師大量的心血。在此,我向導師表示崇高的敬意和由衷的感謝!我在研究思想方法上得到了啟發,并且在工作中采用他們的部分研究成果與資料。盡管與他們為我付出的一切相比,所有的語言都顯得蒼白無力,但我仍要真誠地說聲:謝謝!感謝三年來各位老師和同學對我學習、生活的關心和幫助。在論文即將完成之際,我的心情久久無法平靜,從開始進入課題到論文的順利完成,有多少可敬的師長、同學、朋友給予了我無言的幫助,在這里請接受我誠摯的謝意!
最后感謝我的母?!|寧警察學院三年來對我的栽培。畢業設計完成之際,我由衷地感謝論文指導老師的大力幫助和支持,感謝熱心的同學與朋友,在我遇到種各樣復雜問題的時候,給予我鼓勵和幫助。
Flash網頁設計
參考文獻
[1]向玫玫,林強,馬杰,薛雅娟,王亞冰,范文南.Flash設計(21世紀全國普通高等院校美術藝術設計專業十二五精品課程規劃教材),遼寧美術出版社,2014.04.[2]李錫澤,王喆.《Flash動畫網頁設計》,武漢大學出版社,2015年.[3]劉歡.《Flash ActionScript 3.0交互設計200例》,人民郵電出版社,2015.05.[4]劉斌.基于Flash的課件制作與應用[J],科技廣場,2012(7).P102-P103.[5]莫仲心.淺談Flash動畫在網頁設計中的應用[J].信息通信.2012(1).P135-P136.22
第三篇:《網頁制作:Flash動畫制作》課程設計具體要求
《網頁制作:Flash動畫制作》課程設計具體要求
一、Flash動畫設計作品設計題目
1、見“題目1”。
2、見“題目2”。
上述題目任選其一,這兩個題目的素材均已給出,考生須按照所給素材及“考試說明”中的操作步驟完成設計作品,完成的最終.swf作品形式可參考“題目1”或“題目2”中的相關實例。
二、Flash作品參考實例
可以參考題目1或題目2的“考試說明”文件或《網頁制作:Flash動畫制作》課件中的“單元九 綜合實例”中的“任務1時裝廣告動畫”、“任務2精品購物網站”。
三、Flash動畫設計需要提交的文檔及要求
1、所制作完成的作品.swf格式及作品對應的源文件.fla格式。
2、課程設計報告(報告附錄部分為所使用的全部素材的截圖),字數為800~1000字,寫作模版參見“課程設計報告寫作模板”。
3、所提交的作品(含源文件及最終作品)和設計報告應放在一個壓縮包內,命名規則為:姓名+Flash動畫設計稿件,如吳名Flash動畫設計稿件。稿件大小應控制在10M以內。
4、作品的命名規則為:姓名+作品主題,如吳名題目1。
第四篇:FLASH動畫教學設計
篇一:《制作flash動畫》教學設計
《制作flash動畫》教學設計 [教材分析] [教學目標分析] 1.知識目標
⑴啟動并認識flash8的操作界面;
⑵初步理解動畫制作中的基本概念,并嘗試制作簡單的flash動畫。2.能力目標
⑴學會使用flash工具箱繪制動畫的基本元素;
⑵培養學生自主探索、團隊合作的意識。3.情感目標
⑴讓學生通過欣賞優秀作品,激發良好的創作欲望和學生學習計算機的濃厚興趣; ⑵通過對動畫結構及層次的分析,培養學生從整體到局部,再到整體的系統認識事物的習慣和能力。[教學重難點分析] 重點:動畫角色移動的制作方法。
難點:界面的理解與認識;對幀的初步理解。[教學方法分析] 任務驅動教學法:上課之前先讓學生知道本節課的知識任務是制作一個小球從高處落下,著地后再反彈回去的flash動畫。
演示法:給學生演示本節課的知識要點。[學生分析] 本節課的學習對象是初二學生,這些學生一般都接觸過網絡,對flash動畫不是很陌生,但是對這些動畫是如何制作出來的有很大的神秘感,所以學習起來會有很大的興趣。另外我校學生在小學階段的學習中已經掌握了畫圖軟件的使用方法,所以在學習flash圖形繪制工具的時候不用講得太多,學生就可以初步掌握這些軟件的使用方法。[教學設計思路] 本教學設計是以制作模擬游戲“打地鼠”和制作模擬運動“撞球”flash動畫作為任務,讓學生體驗flash動畫制作的一般步驟,初步理解flash動畫制作中的一些基本概念,學會創建和調用圖形元件,嘗試制作簡單的補間動畫。通過對制作過程的了解,讓學生消除動畫制作的神秘感,激發學生學習flash動畫制作的求知欲。[教學過程]
一、導入
欣賞兩段經典flash動畫:⑴簡單愛mv⑵小小系列武打動畫。[設計意圖]第一段動畫讓學生欣賞豐富多彩的動畫畫面,讓學生體會動畫所帶來的樂趣,激發他們的創作欲望,第二段動畫則點燃學生創作的熱情,調動他們的興趣。
二、新授
⑴啟動flash8軟件。
在學習flash軟件之前介紹什么是動畫,并說明動畫的基本單位是“幀”,而不是人們常用的“分”、“秒”等。⑵介紹flash界面
通過角色類比導出元件、庫、場景、時間軸等概念。1.時間軸
包括“時間線”和“圖層控制區”兩部分?!皶r間線”可以顯示動畫中各幀的排列順序。此對象好比是電影拍攝中所使用的劇本,“幀”則就可以看作是各個分鏡頭。2.舞臺
此對象好比電影中的舞臺一樣,在“舞臺”外面的內容是無法看到的,所以在制作動畫過程中把握好對象的進出。3.工具欄
和我們之前學過的畫圖板有很多類似的地方,主要是用來繪制和修改動畫中的對象。4.其它工具面板
這些對象就像我們拍電影時的美工一樣,對動畫過程中的對象進行修飾與美化。(表1)[設計意圖]簡單介紹“幀”的概念,讓學生初步的了解,由于學生第一次接觸flash,不講述太多的理論內容,所以簡單地交代一下界面。類比生活中的概念,有助于學生接受flash軟件中遇到的概念,便于更深入的學習。
⑶動畫的制作過程
師:語文課上我們寫記敘文六要素是什么? 生:時間、地點、人物、事情的起因經過結果。
師:其實flash動畫和它很類似,下面我們就一起來學習簡單動畫的制作方法。步驟: 1.選擇“插入”菜單下新建元件->繪制小球并設置相關屬性;
2.回到“主場景”打開“庫”面板,將庫中小球元件拖入主場景中第一幀; 3.在時間軸30幀即停止幀處插入“關鍵幀”;
4.將當前幀中將小球元件移動到場景右側目標位置; 5.在時間軸第1幀處創建補間動畫; 6.最后測試動畫。
[設計意圖]通過與語文中記敘文類比進行引導,拓展學生的想象空間,同時也有助于學生理解動畫制作過程的概念。
⑷布置任務
基礎任務:制作一個小球,要求小球從舞臺左側移動到屏幕右側。
提高任務:制作一個小球,要求小球從舞臺左側移動到右側,然后反彈回左側。[設計意圖]以學生為中心,分層教學,對于基礎差的學生只要求完成“基礎任務”,基礎較好的同學可以在完成“基礎任務”的基礎上繼續完成“提高任務”,加強學生對場景、時間軸、幀、關鍵幀的印象。
⑸總結學生在制作動畫過程遇見的問題(見課件)。
⑹思考:如果移動的元件是一個人,結果會是怎樣?
補充任務:1.制作一輪緩緩移動的明月。
2.制作兩片移動的云彩相向而動,形成薄云繞明月的怡人景象。3.根據所學知識自行設計一個動畫。
[設計意圖]讓學生自主探索學習flash動畫,開發他們的想象力與創造力,拓展學生的知識面。
⑺自由練習。
⑻展示學生作品。
[設計意圖]給學生展示一部分優秀的作品,可以讓大家體會到自己完成一個動畫作品的成就感,也容易使學生有激情進一步學習動畫,從而創作出更多的作品。篇二:flash簡單動畫制作教案 flash簡單動畫制作教案
陳英
一、教學目標:
了解計算機動畫制作原理和方法,掌握幾種簡單動畫的制作
二、教學對象: 09級學生
三、本此課程主要內容
1、flash工作界面及基本操作及概念簡要介紹
2、實例講解
四、教學重點:
1、計算機動畫的分類;關鍵幀、空白關鍵幀的概念;
2、簡單對象的移動、變形動畫的制作方法
五、教學難點:
引導層的制作
六、教學手段:
演示講授法,邊演示邊操作,學生同步跟隨學習。
七、教學方法:
實例講解法。即通過一個flash實例,講解其所涉及到的概念與基本技術,激勵學生學習的興趣。
八、教學主要內容講解:
(一)、導入:
首先播放一段flash動畫,該動畫包含了本節課所要學習的主要操作內容——對象的移動及變形;引導學生了解flash動畫,并激發其學習flash動畫制作的激情。
(二)、基本概念講解:
1、元件:一個位圖、矢量圖形、音樂片斷或是一段獨立的flash動畫(好比是演員),通俗的講就是對象作為一個模塊,在不同幀中重復使用.這樣的好處在于因為可以在重復使用,減小了flash的體積便于傳輸,也減小了flash制作者的工作量。元件都被放置在庫中,使用時只用將其拖放到場景中即可,在場景中只能對其位置和形狀進行編輯,如果要對元件進行編輯,需要切換到元件編輯狀態。元件分為:圖形元件、按鈕元件和電影剪輯元件。元件中圖形就是指動態或者靜態的圖片元件,電影剪輯是flash小片段,按鈕就是具有一定圖形功能的按鈕圖形了。
庫:存放動畫元件的地方(好比是一場戲的后臺)
2、場景:動畫的表現場所(好比是舞臺)
3、時間軸:動畫制作的最重要的區域,是編輯動畫的工作臺,是加工動畫的流水線,包括了層編輯區、幀編輯區和時間線。(好比是劇本)
我們要制作一個動畫,就好比是在導演一出戲,需要找好演員(制作好元件),置于后臺(放在庫里),然后把演員放在舞臺上(把元件放在場景上),讓演員照著劇本演出(在時間線上設置開始、結束時的狀態,生成動畫)。
4、幀:就是時間軸上的小格子,一幀其實就是一幅圖,是構成動畫的基本單位。可分為關鍵幀、空白關鍵幀和過渡幀。
5、關鍵幀:是動畫演示的基礎,可以放入各種對象~聲音、圖片、按鈕、視頻等等,所有這些都只能放置到關鍵幀上,如果沒有關鍵幀,就沒有動畫。兩個關鍵幀之間可以做補間動畫,這樣兩個關鍵幀就可以確定物體移動的兩個關鍵點。關鍵幀用含有實心圓圈的方格表示。
6、空白關鍵幀:這個關鍵幀在場景上什么都沒有(不包括聲音和代碼),用含有空心圓圈的方格表示;如果加入對象后自動變為關鍵幀。
兩個關鍵幀之間帶粉紅色有長線箭頭標志的幀:漸變動畫~也叫補間動畫,能讓一個物體在這段幀之間作出來,漸變移動的效果(可以改變透明度等等)。
兩個關鍵幀之間帶綠色有長線箭頭標志的幀:形變動畫~第一幀的動畫到最后一幀的時候可以變化出另外一種圖形、形狀。
(三)、基本操作講解
1、移動動畫的制作
“插入”菜單欄à“新建元件”à設置名稱”c1”,行為”圖形”,點“確定”à點“工具”面板里的“橢圓工具”à設置“橢圓工具”的相關屬性(包括筆觸顏色、粗細、樣式及填充顏色)à繪制橢圓(如果要繪制圓,請按住“shift”)à點擊“場景1”,回到場景里à點擊“窗口”菜單欄,選擇“庫”(可看到“庫”窗口被打開,剛才建立的c1元件在庫里)à點擊“時間軸”里的第1幀,把“庫”里的c1拖到場景的左邊à點擊“時間軸”里的第20幀,點擊右鍵,選擇“插入關鍵幀”(可在時間軸上看到第20幀處有“·”)à把剛才的對象從左邊拖到右邊à在時間軸第20幀以前的任意一幀點擊左鍵,在屬性面板里的“補間”后的下拉列表里選擇“動作”,即可看到從第1幀到第20幀的時間軸背景為粉紅色并有一條帶箭頭的實線à回車,欣賞剛才制作好的動畫。
2、關鍵幀動畫:先行設計出若干關鍵性動作的圖像畫面,然后利用計算機圖形技術的算法來自動生成兩個關鍵幀之間的一系列過渡畫面。flash動畫主要就是運用關鍵幀動畫技術,比如我們剛才的這個“移動動畫”的制作。
3、運動路徑動畫:首先確定運動對象的移動軌跡,并設定在移動過程中對象需要改變的旋轉方向、色彩及形狀等參數,軟化將整個運動過程交給計算機來完成。
4、變形動畫:適合模擬形狀變化頻繁的任務、動物和自然現象,主要用于表現模擬自然或生活中實際的動作,或科幻電影中虛幻、夸張的動作(如電影《功夫》、《少林足球》等里面的夸張動作)。
5、物理模型動畫:基于物理模型技術的三維動畫制作,需要從外形、顏色、燈光、紋理、材質等多方面模擬真實物理的各種物理屬性(如cctv6里《光影周刊》的虛擬主持人小龍)。
6、逐幀動畫:通過一幀幀地繪制,并按先后順序排列在時間軸上通過順序播放達到的動畫效果。
說明:
學生根據老師剛才的演示,自行練習移動動畫的制作(3-5分鐘)。
學生記住flash原始文件和flash影片的擴展名(分別為fla和swf)。
(四)、實例講解——flash引導線制作雪花飄飄動畫
1、新建一個flash影片。設背景為“黑色”,其他的用默認值。
2、按ctrl+f8新建一個組件,類型為“影片剪輯”,命名為“雪花”。在它的正中用“鉛筆”工具畫一個不規則的多邊形,然后用“顏料桶工具”將它填上白色。(如圖1-1所示)
3、再用ctrl+f8建一個組件,類型為“影片剪輯”,命名為“前層”。
4、將組件“雪花”拖到其中,用“選定工具”中的“比例”功能把它縮小(小技巧:先用“放大鏡”將它放大,然后再用“比例”功能,可縮得更?。T诘?0幀上“插入關鍵幀”,在“圖層1”上用鼠標右鍵的“添加引導線”功能(見圖1-2)。
在新增加的“引導線:圖層1”的第1幀上,從“雪花”開始,畫一條彎曲的曲線。將第80幀上的“雪花”沿曲線從頭拖到曲線的末尾。然后在“圖層1”的第1幀上點鼠標右鍵,選“創見動畫動作”功能,見圖1-3。
5、第4步是制作一片雪花,下雪不是只下一片的吧。插入圖層,將第4步重復做10次。做好后的效果見圖1-4。
6、把第3至5步重復做兩次,不同之處是組件的命名分別為“中層”和“后層”。“雪花”的大小和“引導線”的路徑不要一樣。這是為了多做幾個圖層,看起來效果細膩一點。
按ctrl+enter就可以看到效果了。篇三:flash動畫制作教案 信息技術興趣小組活動教案
王德 億利東方學校
第一周 flash的基本知識
教學目標:
1、熟悉flash的界面。
2、掌握幾個基本工具的使用:選取工具、變形工具、填充工具、線條工具、橢圓工具、矩形工具、顏料筒工具、墨水瓶工具。
3、掌握幾個基本術語:圖層、元件
4、記住幾個快捷鍵
5、完成四幅繪制圖案 教學重點: 應用工具畫圖 教學難點: 復雜遮照的創建。教學過程:
一、界面環境介紹
二、工具箱的介紹
工具箱提供了用于圖形繪制和圖形編輯的各種工具。工具箱內從上到下分為4個欄:“工具”欄、“查看”欄、“顏色”欄和“選項”欄,單擊某個工具的按鈕,即可激活相應的操作功能,以后把這一操作叫作使用某個工具。(1)“工具”欄:工具箱之“工具”欄內的工具用來繪制圖形、輸入文字和編輯圖形。(2)“查看”欄:工具箱之“查看”欄內的工具是用來調整舞臺編輯畫面的觀察位置和顯示比例的。其中兩個工具按鈕的名稱與作用如表1-1-3所示。(3)“顏色”欄:工具箱之“顏色”欄的工具是用來確定繪制圖形的線條和填充的顏色。其中各工具按鈕的名稱與作用如下。
(筆觸顏色)按鈕:用于給線著色,也叫作描繪顏色。(填充色)按鈕:用于給填充著色。
(從左到右分別是:黑白、沒有顏色和交換顏色)按鈕:單擊“黑白”按鈕,可使筆觸顏色和填充色恢復到默認狀態(筆觸顏色為黑色,填充色為白色)。在選擇了橢圓或矩形工具后,“沒有顏色”按鈕才有效,變為,單擊它可以在沒有顏色和有顏色之間切換。單擊“交換顏色”按鈕,可以使筆觸顏色與填充色互換。(4)“選項”欄:工具箱之“選項”欄中放置了用于對當前激活的工具進行設置的一些屬性和功能按鈕等選項。這些選項是隨著用戶選用工具的改變而變化的,大多數工具都有自己相應的屬性設置。在繪圖、輸入文字或編輯對象時,通常應當在選中繪圖或編輯工具后,再對其屬性和功能進行設置,才能順利達到預期的效果。
三、動手用一下工具
1、使用工具制作一個“笑臉”或“哭臉”
2、漸變工具的使用:幾個關鍵概念
顏色調板填充變形工具的使用
3、用橢圓畫個畫環 操作步驟:
1、用填充色畫圓,并設置筆觸的粗細。
2、設置邊線的填充色為“七彩色”。
3、將該線形圓環轉換成填充色:修改--形狀--將線條為填充。
4、使用“墨水瓶”工具給圓環加邊線。效果如右:
4、用多邊形工具畫太陽 操作步驟:
1、用多邊星形工具制作太陽的外圍,作以下設置:(1)將矩形工具轉換成多角星形工具
(2)設置多角星形的“屬性”中的“選項”
(3)設置“樣式”為星形,輸入星形數,及星形頂點大小(頂點越小,星形越尖)
2、設置填充色為放射性,無邊線
3、開始畫星形。
4、創建一個同心的圓為太陽的臉。
5、使用直線工具畫眼、嘴。(注意:用選擇工具調整其曲線度,利用變形工具作旋轉)
四、課堂習題:自創月亮
五、課后作業
1、書本p34頁的實例6:茶杯。
第二周 各類特效文字的制作
教學進度:正常 教學目標:
1、要求學生掌握漸變工具、多角星形工具、墨水瓶工具、文字工具、濾鏡的使用。
4、掌握位圖的導入及矢量圖的轉換。
教學重點:
1、掌握空心文字、投影文字、點框文字、彩虹文字、金屬文字、雪花文字的制作
教學難點: 復雜遮照的創建。教學過程:
一、點框文字 制作步驟:
1、用文字工具輸入文字
2、將文字使用“分離”或按下(ctrl+b)組合鍵
3、再將每個分離的文字使用“分離”,即直到文字被選中時呈現點型。
4、使用“墨水瓶”工具,設置線型為“點型”,設置線的顏色(注意務必使用與文字顏色不同的一種顏色),用鼠標單擊文字
5、所有文字的邊線勾勒完畢后,用選取工具選取文字內心,并刪除。
二、彩虹文字 制作步驟:
1、用文字工具輸入文字
2、將文字使用“分離”,(分離二次)
3、選擇填充顏色,再用顏料筒單擊文字即可
三、彩圖文字 圖片下載 制作步驟:
1、用文字工具輸入文字
2、將文字使用“分離”
3、選擇填充類型為“圖片”,圖片填充有二類
4、再用墨水瓶工具勾勒邊緣
5、將邊緣線條轉化為填充
6、“修改”--“形狀”--“柔化填充邊緣”
四、雪花文字
五、補充知識:倒影字的制作
六、課后作業:制作一個圖案文字
小技巧:ctrl+v與ctrl+shift+v的區別:后者是復制時保持前后位置都一樣。
第三周 直線運動和變形運動
教學目標:
1、要求學生掌握直線運動和變形運動的補間。
2、掌握直線運動的特點:元件與普通形狀對象都可以制作直線運動。
3、掌握變形運動的特點:普通形狀對象可以變形。
4、掌握影片元件的制作方法。
教學重點: 運動補間的設置;影片元件的創建。> 教學難點: 關鍵幀/普通幀的區別; 教學過程:
一、導入:動畫制作的關鍵要素
1、幀——是進行flash動畫制作的最基本的單位,每一個精彩的flash動畫都是由很多個精心雕琢的幀構成的,在時間軸上的每一幀都可以包含需要顯示的所有內容,包括圖形、聲音、各種素材和其他多種對象。
2、關鍵幀——顧名思義,有關鍵內容的幀。用來定義動畫變化、更改狀態的幀,即編輯舞臺上存在實例對象并可對其進行編輯的幀。
3、空白關鍵幀——空白關鍵幀是沒有包含舞臺上的實例內容的關鍵幀。
4、普通幀——在時間軸上能顯示實例對象,但不能對實例對象進行編輯操作的幀。
5、以上四種幀的區別
① 關鍵幀在時間軸上顯示為實心的圓點,空白關鍵幀在時間軸上顯示為空心的圓點,普通幀在時間軸上顯示為灰色填充的小方格 ② 同一層中,在前一個關鍵幀的后面任一幀處插入關鍵幀,是復制前一個關鍵幀上的對象,并可對其進行編輯操作;如果插入普通幀,是延續前一個關鍵幀上的內容,不可對其進行編輯操作;插入空白關鍵幀,可清除該幀后面的延續內容,可以在空白關鍵幀上添加 新的實例對象。
③ 關鍵幀和空白關鍵幀上都可以添加幀動作腳本,普通幀上則不能。
6、應用中需注意的問題
① 應盡可能的節約關鍵幀的使用,以減小動畫文件的體積;
② 盡量避免在同一幀處過多的使用關鍵幀,以減小動畫運行的負擔,使畫面播放流暢。
二、基本動畫
1、變形動畫:要求參與動畫的對象必須是形狀,不得使用元件。
例如:以下動畫中a-->b-->c之間、五角星——>十角形即為形狀變形。操作步驟: ①設置背景色
②插入第一關鍵幀,并繪制一個五角形。
③在第30幀上插入空白關鍵幀,并繪制一個十角星形。
④利用時間軸上的“編輯多幀”工具,對齊第一、二關鍵幀的各自五個角。⑤在第一關鍵幀上設定五個“形狀提示點”,修改--形狀--添加形狀提示點。⑥在第二關鍵幀上設定各提示點的對應終點位置。⑦對第一關鍵幀設定“形狀”動畫補間。思考:
2、直線運動動畫:任何對象都可以設置直線動畫,只需二個關鍵幀 例如:素材下載
3、漸變運動動畫
① 淡入、淡出動畫:使用實例才能完成此項動畫,一般通過調整關鍵幀的透明度來設置場景中的各實例的出現方式。
一般淡入淡出式動畫是用二個關鍵幀完成,第一關鍵幀為全透明(100%)或部分透明,第二關鍵幀透明度為0。
②閃爍動畫:一般用三個關鍵幀完成,即從淡入到淡出的過程,即全透明--不透明--全透明的設置過程。
例如:以下例子中星星,就是用影片元件來完成的。
4、旋轉動畫:一般旋轉度數在360度以上,則采用實例,即旋轉的對象必須是通過元件調入的。而旋轉度小于360度,則旋轉對象可以是形狀。動畫設定只需二個關鍵幀。
例如:拖影文字(課后完成)操作步驟:
①建立文字元件,拖到舞臺
②創建第一圖層,設定第一、二關鍵幀(同幀),并設制“動畫”補間,旋轉為1次。
②創建第二圖層,此層為陰影層,復制第一層的關鍵幀,用方向箭頭控制。③創建第三至第九圖層,這些層均為拖影層,每層之間涉后二幀。與第一圖層相比,這些層均要逐漸調整透明度。
三、總結鞏固:
1、圖形元件的制作
2、圖形元件的應用: ①實例:元件調入到場景后,就叫實例,實例可以取名,以后便于以后寫代碼(編程)時調用。②對元件的編輯: ③對實例的編輯:與元件編輯最大區別在于對元件本身不修改,主要的編輯方法有改變色調、透明度等。
第五篇:項目教學法在中職Flash動畫制作課程中的應用
項目教學法在中職Flash動畫制作課程中的應
用
項目教學法是在建構主義指導下,以實際項目為對象,先由教師對項目進行分解,并作適當示范,然后讓學生分組,圍繞項目進行討論、協作學習,最后以共同完成項目的情況來評價學生是否達到教學目標的一種教學方法。本人在項目教學法的指導下,結合技能大賽和培養實用型人才,將Flash動畫的具體教學過程分為以下幾步。
1.基于項目教學法的項目的選擇和優化
根據省級技能標準對Flash課程的要求,將Flash動畫制作分為若干個教學項目,每個項目由項目名稱、教學任務、教學模塊等組成。例如用Flash制作動畫短片的教學項目,本人在實際教學中,就把這個項目具體劃分為五大模塊(見表1)。
2.基于項目教學法的項目的實施
項目教學法的計劃由教師設計,但是學生應該是實施項目的主體,教師在項目實施的過程中是一個指導者和幫助者。由項目課題組教師帶領學生開展項目活動,指導學生完成各項項目作業。如動畫短片項目的實施過程
①創設情境,設計項目。
第 1 頁
教師可以先向全體學生展示一組精彩的Flash動畫短片,激發學生的學習興趣,從而引出教學任務,并引導學生設計相關項目。
②確定項目,分組分工。
確定了某個項目后,為了充分調動學生學習的積極性,可要求學生按照自己的興趣愛好,自由組合成不同的學習小組,學習小組每組5~8人,確定組長人選及小組成員的角色分配,明確分工,各負其責。
③收集素材,探究協作。
收集素材是動畫制作的基本要求,也是學生應該具備的基本技能。當素材收集完成后,每個小組把收集到的素材在小組內進行交流匯總,通過討論確定作品制作的具體方案。
④完成項目,展示成果。
每個小組在項目完成后進行自我展示,采用這一方法,既能提高學生的專業知識能力和語言能力,又能增強學生的自我成就感。
3.基于項目教學法的項目評價
在職業活動為導向的教學模式下,教學評價方式也發生巨大的變化,考核是通過學生自評、小組評分和教師評分形
第 2 頁 成交叉評價體系,讓學生在做項目中學習,在學習中做項目,加深對專業的理解,培養學生的綜合能力。例如動畫短片的教學項目中,對評價內容進行了具體設置(見表2)。
在實施完成項目以后,教師和學生要對項目的完成情況進行反思和總結。分析項目的重點和完成的過程,梳理知識點,增強自己的職業技能。
實踐證明,項目教學法在Flash動畫制作課程中發揮了它的優勢,取得了很好的效果,極大地提高了學生的學習興趣,提升了對知識的掌握及靈活運用能力,加強了學生的小組合作意識,使學生從“要我學”變成“我要學”,增強了學生的學習能力及創造能力。
第 3 頁