瘋狂站長之Flash5.0&Fireworks3.0 內容簡介
全書內容重點講述了flash 5.0的使用原理和技巧,包括Flash 5.0的簡單安裝及基礎知識,怎樣在Flash中繪畫和填色,使用對象、文字、導入的圖形、層組件和實體,創建動畫、互動電影和界面元素,Flash 5.0的核心內容--動作函式及語言;以及講述了有關Fireworks 3.0的操作技巧和原理,內容包含Fireworks 3.0的基本操作和高級套用技巧,圖形處理過程中必須用到的圖形色彩理論和將Fireworks 3.0與網路結合的套用。瘋狂站長之Flash5.0&Fireworks3.0 本書前言
在幾年前,網頁一直都是靜態的,缺乏變化和生動,就像一本雜誌的複印件一樣,再怎么好看也像是一幅被定了格的風景--簡而言之就是缺乏生氣。又因為網路的頻寬問題,使連線傳輸速率很慢,要製作具有動畫效果的WEB網站很困難。1995年,Sun公司開發了Java程式設計語言,它可以使程式設計人員能創建applet(套用小程式),這些applet能從伺服器下載到瀏覽器上,並可在用戶端計算機上運行。使用Java,程式設計人員可以創建生成能夠調用圖片和聲音的多媒體套用小程式。Java一經推出,就受到人們的寵愛,在短短一年內,Java就風行全球。進而在眾多的網頁中出現了如水面倒影、飄雪、彩虹字、滾動字幕等叫人愛不釋手的Java套用小程式。如果你是一個細心的瀏覽者,你會發現當你進入一個網頁時,它的動畫效果不再是以前那種單純的往復運動,而是可以在畫面里進行選單選擇和操作以及播放聲音檔案。你不禁要問:"這是什麼東西?",答案很簡單,這就是叫我一頭扎進去再也不想出來的Flash & Fireworks。
Flash是一種互動式矢量多媒體技術,它的前身是Future Splash,是早期網上流行的矢量動畫外掛程式。後來由於Macromedia公司收購了Future Splash,以後便將其改名為Flash 2.0,到現在這是最新的 Flash 5.0。現在網上已經有成千上萬個Flash站點,著名的微軟MSN新聞站就採用了大量的Flash動畫,Macromedia還有專門的Shockwave站點,全部採用了Shockwave Flash和Director。Flash與Dreamweaver和Fireworks並稱為Macromedia公司的網頁製作三劍客。Flash憑著其生成的矢量動畫檔案小,互動性強,先進的流技術等諸多優點,已逐步取代Gif動畫成為網路動畫的標準,未來網頁的一大主流。使用Flash將使你很快跟上時代的步伐。
1995年當Navigator 2.0還是當時最新最強大的瀏覽器時,Macromedia推出了Shockwave作為將Director電影套用於網際網路的渠道。從此,只要點擊含有Shockwave的網頁就可以看到Director電影。但是由於Director不是為網際網路設計的,所以Director最精彩的電影往往由於占用頻寬過大而不能在網際網路中播放。另一方面,由於頻寬的原因,網際網路也需要找到一種比標準的GIF和JPEG更靈活、體積更小的替代方法。
PostScript是abode系統的專利產品,它是一種向量圖形語言,它能利用指令生成圖形,而不是像GIF那樣靠像素貼圖來製作圖形。基於向量的圖形尺寸還可以隨意調整縮放,而不會影響圖形檔案的體積和質量。向量標準則可以在一定程度上解決網際網路頻寬這個問題。
Flash不像Director那樣可以編程(例如,你可以用其製作複雜的CD-ROM遊戲),但它的功能還是很強大的。你可以用其生成動畫,創建網頁互動性,以及在網頁中加入聲音。你還可以生成亮麗奪目的圖形和界面,而使檔案的體積只有5~50K。Flash的另一個優點是:它獨立於瀏覽器之外。只要給瀏覽器加入相應的外掛程式就可以觀看Flash動畫,你用3.0或更高版本的瀏覽器看到的效果幾乎完全相同。外掛程式的不利之處在於用戶必須下載和安裝了該外掛程式後才可以觀看。
而Fireworks的來頭就更大了。它使Web作圖發生了革命性的變化,因為Fireworks是第一個徹底為Web製作者們設計的軟體。作為一個圖像處理軟體,Fireworks能夠自由地導入各種圖像(如Macintosh的PICT、FreeHand,Illustrator,CorelDraw 8.0的矢量檔案、Photoshop檔案、GIF、JPEG、BMP、TIFF),甚至是ASCII的txt文本檔案,而且Fireworks可以辨認矢量檔案中的絕大部分標記,以及Photoshop檔案的層。作為一款為網路設計而開發的圖像處理軟體,Fireworks能夠自動切圖、生成滑鼠動態感應的JavaScript等等,而且Fireworks具有十分強大的動畫功能和一個幾乎完美的網路圖像生成器(Export功能)。
Macromedia公司發布了Fireworks 3.0。與前一代相比,Fireworks 3.0在許多關鍵功能上作了徹底的更新。比如:增加了樣式(style)功能使用戶在幾秒種里就可以做出專業水準的特效、在層方面增加了多種效果(有陰影、凹凸、幻燈……只是越看越像Photoshop 5.0的Layer Effect)、object面板可以讓您更加直觀、方便地控制單個圖案的屬性、並且增強了與Dreamweaver的聯繫,可以直接生成Dreamweaver的Library,甚至能夠導出為配合CSS式樣的網頁及圖片!
如何使用Flash和Fireworks非常容易學習,但是要想精通則需要較長的時間。許多還未接觸過的朋友們一定會問應該如何有效合理地開始學習。首先,你就應該有一套比較全面系統的教程。而在這本《瘋狂站長之Flash 5.0 & Fireworks 3.0》可以讓你一步步成長為大師。讀完這本書後,或許你就能領略"那一劍的風情"。
本書主要參與編寫人員除李昕、孫久文之外,還有杜建成、趙樹強、徐磊、朱曙光、簡濤巍、孫雲飛、岳志剛、朱文明、紀萌、王志明、張鵬等11人。
編者
2000年9月
瘋狂站長之Flash5.0&Fireworks3.0 本書目錄
前言
第1章 Flash 5.0閃亮登場
1.1 Flash簡介及軟體獲取
1.2 F1ash系統需求及安裝
1.2.1 Flash系統需求
1.2.2 安裝Flash
5.0 1.3 Flash 5.0的新增功能
1.4 創建FLASH電影實例
1.4.1 建立一個新的電影檔案
1.4.2 創建一個動態按鈕
1.4.3 使用可編輯的文本域
1.4.4 輸出電影並將其嵌入HTML
1.4.5 發布電影
第2章 Flash 5.0電影創作基礎
2.1 Flash 5.0的創作空間
2.1.1 瀏覽選單條
2.1.2 查看舞台
2.1.3 使用工具列及標尺
2.1.4 使用調色視窗
2.1.5 使用洋蔥皮視窗
2.1.6 使用庫視窗
2.1.7 時間軸及回放指示
2.1.8 時間軸的狀態欄顯示條
2.1.9 層及相關命令
2.1.10 面板的使用
2.1.11 Generator視窗的介紹
2.1.12 使用輸出視窗
2.2 Flash電影設定
2.2.1 電影的預覽及測試
2.2.2 Flash 5.0檔案的列印
2.2.3 提高Flash電影的顯示速度
2.3 Flash中的繪畫
2.3.1 用Pencil Tool進行繪畫
2.3.2 用Brush Tool進行繪畫創作
2.3.3 繪製直線、橢圓和矩形
2.3.4 填充圖形
2.3.5 擦除圖形
2.3.6 增添圖形色彩
2.3.7 吸管設定繪圖參數
2.3.8 圖形及輪廓的重繪
2.3.9 重繪線及輪廓形狀
2.3.10 創作特殊曲線效果
第3章 創建電影基本成員
3.1 成員對象的基本操作
3.1.1 對象的選擇
3.1.2 對象的移動、拷貝及刪除
3.1.3 對象比例的調整
3.1.4 對象的鏇轉
3.1.5 對象的傾斜
3.1.6 對象的定位控制
3.1.7 對象的組合控制
3.1.8 對象改變的恢復
3.2 Flash 5.0中的文本編輯
3.2.1 文字工具的使用
3.2.2 輸入文字
3.2.3 編輯及修改文字
3.2.4 可編輯文本及文本框
3.2.5 字元間距的調整
3.2.6 字元的整形
3.3 使用藝術圖片
3.3.1 將藝術圖片導入Flash
3.3.2 用點陣圖影像繪畫
3.3.3 設定點陣圖的屬性
3.3.4 點陣圖蹤跡
3.3.5 一個關於文字變形的例子
第4章 Flash 5.0電影中的高級套用(一)
4.1 影片中的組件及其套用
4.1.1 Flash 5.0中的組件和例子
4.1.2 建立一個圖形新組件及編輯圖形組件
4.1.3 按鈕及按鈕組件(舉一個動畫按鈕的例子)
4.1.4 影片片段
4.2 影片中圖層的變換
4.2.1 Flash 5.0中的層
4.2.2 創建及刪除影片圖層
4.2.3 編輯影片圖層
4.2.4 改變層的順序
4.2.5 使用遮罩層
4.2.6 使用運動軌跡層
4.2.7 使用嚮導層
4.2.8 一個實例
第5章 Flash 5.0電影中的高級套用(二)
5.1 影片動畫製作
5.1.1 影片動畫概述
5.1.2 創建逐幀動畫
5.1.3 建立漸變動畫
5.1.4 用層創建動畫
5.2 添加電影配音
5.2.1 電影配音概述
5.2.2 在影片中加入聲音
5.2.3 編輯聲音的控制
5.2.4 關鍵幀上聲音的播放和停止播放
5.2.5 添加聲音按鈕
5.2.6 導出帶有聲音的動畫影片
5.2.7 指定聲音的壓縮選項
第6章 Flash 5.0電影中的高級套用(三)
6.1 Action命令的介紹
6.1.1 如何快速進入Action編輯狀態
6.1.2 Action命令的介紹
6.2 Flash 5.0中的運算符號和函式
6.2.1 Flash 5.0的預置函式和屬性變數
6.2.2 其他Flash 5.0命令介紹
6.3 創建Flash互動電影
6.3.1 互動電影要素及概述
6.3.2 設計事件按鈕
6.3.3 目標間的跳轉
6.3.4 編輯動作
6.3.5 控制電影的聲道
6.3.6 創建互動表單處理動作
6.3.7 控制電影觀賞的方式
6.3.8 調整電影播放效果
6.4 電影剪輯
6.4.1 電影剪輯的創建
6.4.2 複製和刪除電影剪輯
6.4.3 改變電影剪輯的位置和外觀
第7章 Flash電影發布及網路實現
7.1 Flash電影的發布實現
7.1.1 Flash電影的導出
7.1.2 最佳化電影效果
7.1.3 影片預下載性能測試
7.1.4 Flash中多種檔案格式的發布
7.1.5 Flash影片發布並創建放映機
7.1.6 使用發布預覽
7.2 Flash電影的網路實現
7.2.1 連線網路中的URL
7.2.2 檢測幀是否被裝載
7.2.3 電影的裝載和卸載
7.2.4 創建發布HTML嚮導
7.2.5 創建Flash的Web伺服器
第8章 Fireworks 3.0來了
8.1 Fireworks 3.0簡介
8.1.1 Fireworks的安裝和運行
8.1.2 Fireworks 3的新特性
8.1.3 Fireworks與Photoshop的比較
8.2 Fireworks知識準備
8.2.1 進入Fireworks界面
8.2.2 不同的圖像檔案
8.2.3 網頁圖像的特殊要求
8.2.4 Fireworks的繪圖工具
第9章 Fireworks使用及技巧
9.1 Fireworks操作初步
9.1.1 打開和創建新檔案
9.1.2 畫布和圖像的控制
9.1.3 圖像中範圍的選取
9.1.4 Fireworks中的圖像格式檔案和圖像色彩模式
9.1.5 Fireworks最佳化圖像輸出
9.2 Fireworks實用技巧
9.2.1 Fireworks繪圖技巧
9.2.2 Fireworks的圖層技巧
9.2.3 使用Photoshop的Plugin中的效果
9.2.4 套用JavaScript
第10章 Fireworks高級套用
10.1 文字特效及套用
10.1.1 文字中遮色片的套用
10.1.2 文字顏色的填充..
10.1.3 文字的對齊
10.1.4 文字的環繞
10.1.5 查找和替換
10.2 實用動圓製作
10.2.1 動畫原理
10.2.2 創建圖像地圖
10.2.3 Symbol和Tween Instances動畫製作
10.2.4 洋蔥皮技術的使用
10.3 圖像瘦身魔法
10.3.1 用Fireworks切割靜態圖像
10.3.2 用Fireworks創建動態切圖
第11章 網頁製作綜合實例
11.1 Fireworks與Dreamweaver
11.1.1 HTML語言簡介
11.1.2 Dreamweaver中的庫操作
11.1.3 導入Flash動畫
11.1.4 在Dreamweaver中加入CSS圖層
11.2 網頁製作綜合實例
11.2.1 個人網頁設計技巧
11.2.2 網頁製作實例
瘋狂站長之Flash5.0&Fireworks3.0 文章節選
網頁製作綜合實例
Fireworks 3.0是用來製作網頁圖形的工具軟體,它可以從無到有、從頭到尾地完成一個帶有互動性網頁圖片的創建、潤色、修改、創建超文本連結、圖形最佳化等過程。
在本節中,我首先會介紹一些個人網頁製作的技巧,然後通過一些實例的介紹,深化對前面幾章中概念的理解和對某些操作的靈活套用。
11.2.1個人網頁設計技巧
(1)首先主題選擇不要落俗,有自己的特色。
現在許多的個人主頁就像"大鍋飯"。題材包羅萬象,內容雷同,淡而無味。人人都是"軟體速遞"、"音樂寶庫"、"主頁教程"等等。讓我一看就趕緊"Back",而我可是花錢上網的喔!題材的選擇少而精,又能堅持天天更新的話,會很快受到大家的歡迎,就像書路的電子圖書,龍翔的遊戲資訊等等。另外提醒你的一點就是,最好不要在主頁里設有關hacker(解密、註冊碼)的資料,國內大部分的免費空間提供商都不接受含此類信息的站點。製作時,內容不要全搬照抄他人的內容,適當加入一些自己的文章、評論和見解,會使大家更加相信你,尊重你。例如,翻譯一些英文教程、寫作一些軟體的用法、分析一些實例製作過程。畢竟是個人主頁,要體現你的個性和風格,讓大家了解並接受你的觀點,是個人主頁的精髓所在。
(2)做好網頁的規劃。
如果你準備建立新的個人主頁,千萬不要立刻開始製作頁面。一定要好好想一想,總體規劃一下整個網站的結構,特別要考慮到網站的維護更新方便。一時興起,想到什麼就做什麼,往往會使你的網站,虎頭蛇尾,條理混亂,最終因維護困難而夭折。開始製作時,請你千萬不要急著許多頁面一起製作。許多新手會及不可待地將收集到的各種資料填入各個頁面。轉眼首頁就速成了,好有成就感喔!可等你回味過來想要修改一些頁面元素時,卻發現一頁一頁改得好辛苦!所以我建議你先製作有代表性的一頁,將頁面的結構、圖片的位置、連結的方式統統設計周全。例如:每頁設定"返回首頁"的連結、Email地址、版權資訊等。然後Copy成n頁,再將相應的內容"填空"。這樣製作的主頁,速度快、整體性強。如果你能結合Borders的使用,可以天天輕鬆改變站點的風格。
(3)注意網路頻寬。
每個頁面不要使用超過2個的Java程式,能夠用JavaScript替代的則儘量不要使用Java。因為目前來講,Java的運行速度實在慢得讓人無法忍受,Java會使你的網頁速度減慢至少50%。由於瀏覽器的版本,有時候等候半天,卻告訴你Java Applet不能啟動,這種經歷相信你也曾經遇到過。單張圖片不要超過30K,每頁圖片一般總量不要超過60K。據統計分析,每頁圖片大小不超過60K網頁,其下載速度是可以讓人接受的。所有的圖片都必須"減肥"成小圖片(100×40),一般可以控制在6k以內,動畫控制在15K以內,較大的圖片可以"分割"成小圖片。合理採用JPG和GIF格式也是至關重要的,色彩鮮艷高解析度的用JPG,色彩單調低解析度的用GIF,採用GIF89a格式的圖片在Download時能交錯顯示。
(4)設定一個專門的"What's news"頁面。
及時醒目地告訴來訪者你主頁最新更新的內容,這樣能方便常客瀏覽和尋找他們所需要的內容。許多好的主頁乾脆將首頁的內容做成"What's news",如"歡樂天地"、"華軍主頁"等,讓你一目了然,不至於層層深入而一無所獲。
(5)為你的圖片加註解。
圖片的下載較慢,在沒有顯示出來時註解的標註有助於讓瀏覽者知道這是關於什麼的圖片,是否需要等待,是否可以點擊。特別考慮到純文本瀏覽者瀏覽的方便,你千萬要抽空為圖片加一個註解。這雖然是一個小的方面,卻體現一個網頁的製作水準,相信你應該能做得很好吧。
(6)備份你的主頁。
你可能要說,這也算竅門!像是在濫竽充數!你可千萬千萬不要這樣想。"機有不測風雲",在系統大戰,軟體BUG層出不窮,病毒橫行肆虐的年代,你保不準什麼時候機器罷工,辛辛苦苦製作的網頁付之東流。這樣的"慘痛教訓"我可不止遇到一次了。就算俺羅唆,你就老老實實備份了罷!