陳明坤*
(麗江師范高等??茖W(xué)校,云南麗江,674199)
FLASH 技術(shù)在網(wǎng)站制作中應(yīng)用探討
陳明坤*
(麗江師范高等專科學(xué)校,云南麗江,674199)
隨著互聯(lián)網(wǎng)信息技術(shù)的發(fā)展,網(wǎng)站制作也成為熱門的互聯(lián)網(wǎng)行業(yè)之一。其中 Flash技術(shù)主要負(fù)責(zé)網(wǎng)站中的視頻制作,并聯(lián)合Dreamweaver等網(wǎng)頁制作工具,完成網(wǎng)頁的代碼編輯工作。本文首先對Flash技術(shù)的主要內(nèi)容分析進(jìn)行了簡要介紹,其次通過分析內(nèi)置ActionScript、高級語言編寫等內(nèi)容,并提出FLASH動畫的設(shè)計制作方案并給出了網(wǎng)站制作流程以及應(yīng)用。希望本文能給相關(guān)工作領(lǐng)域工作人員提供一些參考。
Flash技術(shù);網(wǎng)站制作;應(yīng)用
當(dāng)前Flash技術(shù)廣泛應(yīng)用于網(wǎng)站開發(fā)、游戲制作、網(wǎng)絡(luò)教學(xué)等方面,其具有的鮮明視覺沖擊與良好的交互特性,贏得了眾多網(wǎng)站開發(fā)群體的喜愛。Flash動畫依托于HTML語言編寫的網(wǎng)頁平臺,通過在網(wǎng)頁平臺中添加相應(yīng)的視頻代碼,來實現(xiàn)網(wǎng)頁視頻的添加與播放。因此使用Flash技術(shù)進(jìn)行網(wǎng)頁視頻的開發(fā),能有效拓寬網(wǎng)站的傳播途徑,提升網(wǎng)站的交互性與審美觀感。
流媒體屬于多媒體視頻的播放形式,其主要通過在網(wǎng)頁中安裝多媒體播放插件,來實現(xiàn)網(wǎng)頁的視頻播放任務(wù)。流媒體引入到網(wǎng)站視頻的制作中,能夠有效解決視頻的在線觀看難題。用戶無需對觀看的視頻進(jìn)行下載,而只要打開相應(yīng)的網(wǎng)絡(luò)播放端口,就能觀看已經(jīng)加載完畢的視頻。而且該流媒體插件只需進(jìn)行一次安裝,就能夠在之后進(jìn)行視頻的快速播放。而且在視頻播放的過程中,流媒體只占用較少的內(nèi)存空間,還可以同時開始視頻的播放與下載活動。這種依賴系統(tǒng)緩存的多媒體播放形成,能夠大大縮短用戶的等待時間。
Flash技術(shù)為網(wǎng)頁動畫制作的主要工具,其能夠制作出集合聲音、圖像、動畫等于一身的媒體素材。Flash技術(shù)所制作出的圖像為矢量圖,矢量圖中不包含相應(yīng)的像素點,而是由具有統(tǒng)一色調(diào)的色塊構(gòu)成。所以矢量圖不會隨著圖像的放大,而產(chǎn)生分辨率失真的現(xiàn)象。相比于傳統(tǒng)的位圖而言,矢量圖所占用的存儲空間較小,其顯示的色彩效果非常的明艷與抽象。而且在網(wǎng)頁動畫的制作中,矢量圖上傳與加載耗費的時間短,所占用的網(wǎng)絡(luò)帶寬少,也能一定程度上提高網(wǎng)頁的瀏覽速度。同時Flash技術(shù)還支持PSD、Illustrator等格式圖像的導(dǎo)入,還能對大多數(shù)格式圖像進(jìn)行編輯。
Flash技術(shù)中另一個重要部分為動態(tài)交互,這是Flash產(chǎn)生視覺沖擊的主要手段。用戶只要點擊鼠標(biāo),就能在相應(yīng)部位出現(xiàn)動畫或者執(zhí)行框,然后引導(dǎo)用戶完成整個網(wǎng)頁的瀏覽活動。動態(tài)波紋、飄落的樹葉或者美妙音樂,都可以在用戶點擊瀏覽的過程中實現(xiàn),這使得網(wǎng)站的頁面交互更加生動有趣。而且在用戶與網(wǎng)站的交互中,F(xiàn)lash內(nèi)置的ActionScript語言結(jié)合JavaScript,能夠?qū)崿F(xiàn)用戶與網(wǎng)頁的雙向互動。對于網(wǎng)頁中所有的操作事項,用戶都可以通過引導(dǎo)式的點擊來完成,還可以在點擊中自由的選擇選項,從而決定最終的操作目標(biāo)。例如:用戶可以通過執(zhí)行相應(yīng)流程,來了解網(wǎng)頁中的產(chǎn)品內(nèi)容,并對其中的相關(guān)聯(lián)鏈接進(jìn)行訪問,這可以大大縮減用戶的執(zhí)行步驟。
逐幀動畫屬于靜幀動畫的一種延伸,其時間線中包含一系列的靜幀圖片,靜幀圖片按照一定的時間節(jié)奏播放,就能夠形成逼真的動畫形式。但與傳統(tǒng)逐幀動畫相比,F(xiàn)lash逐幀動畫的制作不需要對每一幀進(jìn)行改變,而只需對播放過程中的關(guān)鍵節(jié)點進(jìn)行更改,就可以完成相應(yīng)的角色動作。逐幀動畫利用眼睛的視覺殘留原理,其本質(zhì)仍然是一連串的單幀圖像。F'laah逐幀動畫只需要對某些動作進(jìn)行復(fù)制粘貼,并對相應(yīng)的動作實現(xiàn)稍加修改,就可以呈現(xiàn)出逼真的動畫效果。因此Flash逐幀動畫的制作,能夠在占用較小存儲空間的前提下,提高動畫制作的效率。
通過在時間線起始位置、終止位置的兩幀處點擊,就能夠完成動作補間動畫的制作。起始位置和終止位置的兩幀圖像,會存在亮度、飽和度和色調(diào)等方面的差異,在動作方面也有相應(yīng)的改變。而Flash動畫開發(fā)者只需要按動按鈕,就能夠自動填補起始位置、終止位置之間的動畫幀。這種動作補間動畫的制作耗費時間短,但缺點是其制作出的動畫較為生硬,角色的立體感不強。
相比于動作補間動畫的制作,形狀補間動畫具有更加復(fù)雜的變化。形狀補間動畫中圖像的形狀、色調(diào)、亮度和位置,都會隨著時間推移而發(fā)生變化。Flash動畫開發(fā)者在時間線起始位置、終止位置的兩幀處點擊,就能夠完成形狀補間動畫的制作。這其中所存在的動畫效果,都由ActionScript語言程序在計算后,對中間幀的演進(jìn)形態(tài)進(jìn)行填補。因此形狀補間動畫只存在起始位置、終止位置的兩幀,其在動畫存儲中所占用的空間較小。但形狀補間動畫仍然存在動作生硬、角色立體感不強等方面問題。除以上Flash動畫類型以外,還存在遮罩動畫、引導(dǎo)路徑動畫等類型,其主要用于制作簡單的波紋和路徑效果。
通過制作網(wǎng)站頁頭的動態(tài)卷軸動畫效果,來演示Flash動態(tài)技術(shù)的應(yīng)用方向。首先,新建背景為白色的Flash文檔,舞臺大小設(shè)置為950*400px。ctrl+F8新建圖形元件命名為轉(zhuǎn)軸,點擊矩形工具(筆觸顏色無),填充顏色黑色,繪制轉(zhuǎn)軸兩端位置。點擊矩形工具(筆觸顏色黑色),線條粗2、填充顏色線性,左右顏色配置適當(dāng)?shù)念伾纯伞|c擊場景1回到場景舞臺,將圖層1改名為軸1,并將轉(zhuǎn)軸圖形元件拖到舞臺,調(diào)整到適當(dāng)?shù)拇笮『臀恢?。將?zhǔn)備的圖片素材導(dǎo)入到舞臺,調(diào)整設(shè)當(dāng)?shù)拇笮『臀恢?,圖片素材可以準(zhǔn)備png的無背景圖片,或者用Photoshop處理后再導(dǎo)入到Flash,并使用遮罩進(jìn)行處理。新建圖層命名為軸2,復(fù)制軸1第一幀粘貼到軸2圖層第一幀處,并調(diào)整好轉(zhuǎn)軸位置。選中所有圖層在第100幀處添加幀,在第100幀處將軸2及矩形拖到適當(dāng)位置,使動態(tài)卷軸動畫能夠全部顯示。然后右鍵單擊鼠標(biāo)插入補間動畫,點擊Flash軟件“控制”、“測試影片”,對動態(tài)卷軸動畫的最終效果進(jìn)行測試。接著為卷軸動畫添加背景音樂,新建圖層導(dǎo)入 mp3格式的音頻文件,并將音樂元件插入到場景舞臺中。最后卷軸動畫插入到網(wǎng)站頁頭,測試最終的動畫呈現(xiàn)效果。
導(dǎo)航欄是網(wǎng)頁制作中的另一個重要環(huán)節(jié),用戶通過導(dǎo)航欄可以完成網(wǎng)站各個類目的瀏覽工作。Flash軟件技術(shù)可以進(jìn)行文字、圖片和動態(tài)圖像的制作,其中文字類導(dǎo)航欄是最為常見的網(wǎng)站導(dǎo)航方式。大多數(shù)網(wǎng)站都使用文字進(jìn)行不同類別的導(dǎo)航,而圖片常常位于頁面的中部或者右部,用于展現(xiàn)新聞資訊、商品購物等內(nèi)容,在新聞網(wǎng)站或者電子商務(wù)網(wǎng)站中應(yīng)用非常廣泛。而具有動態(tài)效果的圖像導(dǎo)航,則常常出現(xiàn)在商品廣告或網(wǎng)站公告中。這些導(dǎo)航形式需要JavaScript、ActionScript等技術(shù)才能完成,運用Flash的導(dǎo)航制作流程如下:首先要在剪輯元件內(nèi)部新建子菜單,并將創(chuàng)建好的菜單文件插入場景,增加鼠標(biāo)懸停的播放腳本,從而完成菜單的編輯工作。
Flash技術(shù)在網(wǎng)站制作中,只承擔(dān)頁頭、導(dǎo)航欄、鼠標(biāo)跟隨等內(nèi)容的制作。對于網(wǎng)站中鼠標(biāo)跟隨的制作,首先在Flash文檔中建立剪輯元件,并在場景中隨意繪制鼠標(biāo)運動的跟隨軌跡圖形。之后回到主場景舞臺,將剪輯元件的文件插入到主場景舞臺圖層的第一幀,然后輸入 ActionScript編碼 onClipEvent(load)j startDrag("",true);};,最后將制作完成的swf文件導(dǎo)出,并將其置入網(wǎng)頁鼠標(biāo)跟隨動畫中。
Flash技術(shù)能夠?qū)崿F(xiàn)網(wǎng)頁中的頁頭、導(dǎo)航欄和狀態(tài)欄等的制作,也可以在特定位置加入Flash視頻。但Flash只負(fù)責(zé)網(wǎng)站中動態(tài)效果的制作,其不能完成整個網(wǎng)站的制作任務(wù)。只有先使用
Dreamweaver等專業(yè)的網(wǎng)站制作工具,制作出網(wǎng)站的整體框架,才能在其中添加需要的 Flash內(nèi)容。所以 Flash技術(shù)需要與
Dreamweaver、Fireworks等網(wǎng)頁制作技術(shù)結(jié)合,才能完成網(wǎng)頁動態(tài)內(nèi)容的表現(xiàn)活動。
[1]趙志建. Flash動畫在網(wǎng)站設(shè)計中應(yīng)用[J]. 信息通信,2012,(03):125-126.
[2]張麗萍. 網(wǎng)頁設(shè)計中 Photoshop與 Flash的結(jié)合應(yīng)用[J]. 煤炭技術(shù),2013,(04): 158-159.
[3]孫鐵輝,等. 交互設(shè)計在flash課件中的應(yīng)用[J]. 計算機(jī)光盤軟件與應(yīng)用,2012,18: 181.
[4]吳準(zhǔn)輝. 淺析純Flash網(wǎng)站的現(xiàn)狀及發(fā)展[J]. 電子制作,2013,7: 103.
[5]宋曉鳴. Flash在網(wǎng)頁設(shè)計中的應(yīng)用[J]. 電子技術(shù)與軟件工程,2015,3:89.
Application of FLASH Technology in Website Making
CHEN Mingkun*
(Lijiang Teachers College,Lijiang Yunnan,674199,China)
With the development of Internet information technology,website production has become one of the hottestInternet industries.Among them,Flash technology is mainly responsible for the video production in the website,and combined with Dreamweaver and other web authoring tools to complete the code editing work of the web page. In this paper,the main content of Flash technology is briefly introduced,and then through the analysis of built-in ActionScript,high-level language writing and other content,and put forward the FLASH animation design and production program,and gives the website production process and application. I hope this paper can provide some reference for the relevant work field staff.
Flash technology; website production; application
TP393.092
A
1672-9129(2017)06-0168-02
10.19551/j.cnki.issn1672-9129.2017.06.061
陳明坤. FLASH技術(shù)在網(wǎng)站制作中應(yīng)用探討[J]. 數(shù)碼設(shè)計,2017,6(6): 168-169.
Cite:CHEN Mingkun. Application of FLASH Technology in Website Making[J]. Peak Data Science,2017,6(6): 168-169.
2017-01-23;
2017-03-07。
陳明坤(1987-),男,云南省麗江市,畢業(yè)于黑龍江科技學(xué)院,就讀期間于2007年6月至2008年9月到加拿大北阿爾伯塔理工學(xué)院交流學(xué)習(xí)一年,本科,助理工程師。研究方向:計算機(jī)應(yīng)用、網(wǎng)絡(luò)管理。
Email:chenmingkun01@163.com