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