熱門: 手機教學 | 文書法寶 | 影片剪輯 | 廣告DM設計 | 電腦新手 | 動手做網站  線上學習人數:

Fireworks CS6教學 網頁版型設計實例課程 線上看

Fireworks CS6教學 網頁版型設計實例課程 線上看
版 本: Fireworks CS6 應用
回饋紅利點數: 120
庫存狀況: 尚有庫存
價格: 400元
含稅價: 400元
可使用紅利點數: 4000
購買數量:     - OR -   加入追蹤清單
本課程您可學到以下範例:
Fireworks CS6教學 網頁版型設計實例課程 線上看 Fireworks CS6教學 網頁版型設計實例課程 線上看 Fireworks CS6教學 網頁版型設計實例課程 線上看 Fireworks CS6教學 網頁版型設計實例課程 線上看 Fireworks CS6教學 網頁版型設計實例課程 線上看 Fireworks CS6教學 網頁版型設計實例課程 線上看 Fireworks CS6教學 網頁版型設計實例課程 線上看 Fireworks CS6教學 網頁版型設計實例課程 線上看 Fireworks CS6教學 網頁版型設計實例課程 線上看 Fireworks CS6教學 網頁版型設計實例課程 線上看

【課程簡介】

Fireworks 是由Adobe公司出品的網頁圖形設計開發的處理軟體,Fireworks 可以幫您製作網頁圖像處理網頁圖像與網頁版型開發設計、GIF動畫製作,或是建立網頁上的互動效果。同時支援點陣圖與向量圖,設計滑鼠變換影像、彈出式選單等網頁效果,裁切和最佳化圖像,以減少檔案大小,以及自動產生 JavaScript 程式碼,縮短設計專案所需要的時間。而最新版的Fireworks CS6還可以讓您快速的設計出目前最熱門的行動裝置UI操作介面JQuery Mobile,讓您可以輕鬆的開發在iPhone與Android智慧型手機APP介面上,撇步王在本次的課程中有詳細的教學介紹唷!

如果您想要設計網頁您一定要學… 
如果您要開發行動裝置您也要學習Fireowrks CS6

※本課程為線上觀看課程,自購買日起算,使用期限為一年。期限內,您可以在網站上觀看所購買的教學課程,不限觀看次數,下載範例檔案及相關試用版程式,讓您完整學習、更能夠輕鬆複習喔!

【試看影片】

《02-07繪製一個「回到首頁」的按鈕圖示》

《04-01影像變換效果範例實作:步驟一、插入參考線》

【課程目錄】

01.Fireworks CS6必學技巧
01-01啟動Fireworks CS6與建立新的文件檔案
01-02Fireworks CS6操作環境介紹
01-03如何開啟我自己拍的照片檔案?
01-04如何將多個檔案匯集在一個檔案中?
01-05工具的切換與簡單幾何圖形的產生
01-06如何將物件選取起來?
01-07何謂自動圖形?要如何調整?
01-08如何讓物件加上「陰影」與「光暈」效果?
01-09如何應用與區分「點陣圖」與「向量圖」的工具使用?
01-10為何我的物件不會顯示邊緣?

02.物件的繪製技巧教學
02-01「組合路徑」的操作介紹
02-02「合併路徑」的操作與編輯技巧
02-03使用工具來接合與分割物件
02-04繪製一個加號
02-05繪製一個放大鏡物件
02-06繪製一個「座標圖示」
02-07繪製一個「回到首頁」的按鈕圖示
02-08如何將路徑轉換成封閉的填色物件?
02-09繪製一個「郵件」圖示吧!
02-10路徑的接合與分離的技巧操作介紹
02-11繪製一個「重新整理」圖示
02-12繪製一個人物造型圖案
02-13繪製可愛人物,步驟一:繪製臉部
02-14繪製可愛人物,步驟二:使用『貼入範圍內』完成臉部繪製
02-15繪製可愛人物,步驟三:完成物件繪製
02-16繪製一個小貨車,步驟一:繪製車體
02-17繪製一個小貨車,步驟二:繪製後車廂
02-18將小貨車再做一個變化!

03.GIF動畫實做範例
03-01如何製作一個自轉動畫?
03-02準備製作GIF動畫與「符合畫布」的用法
03-03如何調整動畫的變化時間?
03-04如何正確的將GIF動畫匯出?
03-05準備製作閃字動畫:步驟一文字的建立
03-06產生閃字效果的方式
03-07將閃字動畫輸出成動畫檔案
03-08將文字轉換成動畫元件
03-09改變動畫位置與時間
03-10讓文字消失的動畫效果製作
03-11我們也可以使用CS6內建的動畫物件

04.簡單好用的影像變換範例實做
04-01影像變換效果範例實作:步驟一、插入參考線
04-02步驟二:繪製版面方塊
04-03步驟三:匯入四張小圖片
04-04步驟四:匯入四張大圖片
04-05步驟五:套用『創造性』特效
04-06步驟六:重製『狀態』並且調整圖層顯示
04-07步驟七:插入矩形分割的方式
04-08步驟八:套用影像變換效果
04-09步驟九:將大圖片也套用調換影像效果
04-10步驟十:文字的插入方式
04-11步驟十一:完成製作並且匯出成網頁檔案
04-12補充步驟:如何在小圖示加入超連結?

05.用Fireworks CS6設計網頁畫面
05-01準備使用Fireworks CS6設計網頁版型
05-02步驟一:繪製白色矩形物件
05-03步驟二:繪製一個圓角矩形方塊
05-04步驟三:將物件轉成遮色片
05-05步驟四:加入文字位置
05-06步驟五:匯入小圖示並改成白色
05-07步驟六:貼成遮色片的技巧
05-08步驟七:標題文字的插入
05-09步驟八:匯入AI與PSD圖檔的方式
05-10按鈕元件的概念介紹
05-11步驟九:將文字轉換成按鈕元件
05-12步驟十:再製按鈕的技巧
05-13步驟十一:更改按鈕文字與圖示插入
05-14步驟十二:套用『簡易變換影像』效果
05-15完成版型設計步驟

06.重要的分割操作
06-01分割的基本操作方式介紹
06-02Fireworks CS6網頁版型分割的規則
06-03匯出預設值的儲存方式
06-04如何調整輸出品質與格式?
06-05用表格式方式匯出我們的網頁版型技巧
06-06如何使用CSS樣式的方式匯出版型?
06-07分割重點整理說明

07.網頁範本的建立
07-01開啟Dreamweaver CS6建立網站準備編輯版型
07-02步驟一:將網頁版型置中
07-03步驟二:把上方橫幅變成背景圖片
07-04步驟三:製作網頁內容區域的延伸
07-05步驟四:完成最後頁尾區域的設定

08.用CSS來建立網頁範本
08-01準備用CSS來製作網頁版型的整理動作
08-02步驟一:建一個新的網頁檔案
08-03步驟二:建立DIV區塊
08-04步驟三:插入TOP的背景圖片
08-05步驟四:將內容區的背景圖片加入
08-06步驟五:將按鈕文字貼入
08-07將按鈕文字加上超連結功能
08-08將清單範圍標示出來
08-09準備製作導覽列按鈕的命名方式
08-10完成按鈕超連結文字的隱藏
08-11將按鈕圖示全部加入進來
08-12增加Wrapper讓按鈕正常顯示
08-13用DIV去補上按鈕列的區塊
08-14準備用CSS製作影像調換效果
08-15將圖片的區塊移動到指定位置
08-16完成第一個影像變換效果
08-17製作完成第二個影像變換效果
08-18完成第三個按鈕

09.新功能!JQuery Mobile主題設計教學
09-01Fireworks CS6全新功能介紹JQuery Mobile主題建立方式
09-02如何預覽與測試JQuery Mobile主題畫面?
09-03如何更改JQuery Mobile的圖示顏色?
09-04如何建立一個新的JQuery Mobile圖示
09-05如何快速有效的修改主題色彩?
09-06匯出JQuery Mobile主題樣式
09-07如何將Fireworks的JQuery Mobile樣式套用到網頁中?
09-08如何增加JQuery mobile的頁面
09-09自行設計回到MENU的按鈕
09-10將MENU按鈕複製到所有頁面
09-11修改MENU底線的問題,完成設計

 

發表評論

評論者:


評論內容:   注意: 不支援 HTML 語法

評價: 很差           非常好

請輸入驗證碼:



  - OR -   加入追蹤清單
相關課程 (4)