網頁圖檔簡介 動畫製作 動態HTML效果 製作相片投影片秀

Slides:



Advertisements
Similar presentations
对本书、视频等任何 MATLAB 问题,作者做到有问必答! 你买的不仅仅是书,更是一种 “ 有问必答 ” 的服务!
Advertisements

E-portfolio 個人履歷網站教學
加入圖片.
網頁介面設計的基礎理論 講師:鄭靜怡 本教材內容出自於網頁界面設計藝術教程,人民郵電出版社.
第6章 网页图像处理 通过本章学习,应该掌握以下内容: 能够选择合适的网页颜色 了解网页图像的基本格式 掌握使用网页图像的要点
第6章 電腦科技的相關應用─影像處理 6-1 影像處理的基本知識 6-2 PhotoImpact 的基本操作 6-3 影像編輯技巧
DreamWeaver MX (V) 林偉川.
3-1 想做出甚麼樣的網站 現在您對網站、網頁已經有基本的概念了,不過要實際開始製作網站,還需要經過規劃的過程。本章中尚未開始動手設計網頁,而先來學習建立網站的重要觀念也就是網站的規劃與設定,首先您必須先對自己要建立的網站有基本的架構,才能動手建立網站,做好後續網頁設計的工作。可別看這個過程,這是能不能建構出一個好網站的重要關鍵,也是設計網站人員必須用心思考、規劃的部分。
DreamWeaver MX (II) 林偉川.
非常好色軟體應用研習 數立科技推廣組 2009/02/17.
主講人:資通中心李威頤 校內分機:6111 講義下載: 資料下載
數位典藏之數位影像處理技術探討 雲端上的寶藏~ 國立新港藝術高中 蘇淵源.
Q101 在701 SDX Linux上的標準安裝與使用程序v2
網頁圖檔簡介 動畫製作 動態HTML效果 網頁上傳
Dreamweaver 8 範例:201、202 潘雅真.
第 7 章 設定網頁背景與音樂.
MINITAB基本操作 說明者:吳東陽          2003/09/30.
R教學 安裝RStudio 羅琪老師.
安裝JDK 安裝Eclipse Eclipse 中文化
數位影像壓縮 技術簡介 第四組 陳孝賢.
自由軟體介紹(一) 把flash通通帶回家 報告人:陳俊銘.
Word與PowerPoint的結合 建功國小 陳旻杰 健行國小 張慧如.
2 数字图像基础 赵国庆 博士 北京师范大学教育技术学院
影像處理軟身操 數位影像的基本觀念與實作 劉明玲主講.
檔案與磁碟的基本介紹.
第二章 SPSS的使用 2.1 啟動SPSS系統 2.2 結束SPSS系統 2.3 資料分析之相關檔案 2.4 如何使用SPSS軟體.
1 功能.
私立南山高中 信息組 電腦研習 電腦資料的備份 中華民國 99年4月20日 星期二.
第一章 數位影像的概念.
VS.NET 2003 IDE.
圖片格式簡介 張啟中.
自由軟體在校園之應用 《XnView的認識與教學應用》
第12章 多媒體 12-1多媒體應用軟體 12-2 電腦視覺 12-3 資料壓縮.
Dreamweaver 8 潘雅真老師.
網頁製作 東海國中資訊組.
雙色鑰匙圈製作 Flashprint + Tinkercad
雙色鑰匙圈製作 Flashprint + Tinkercad
PowerPoint 2019/4/9.
會聲會影10 卓傳育 博士 電腦與通訊科技研發中心 會聲會影10教學-基本功能
Prepare by Jean Huang 黃瀞儀
伸峰科技股份有限公司 李書帆 SanfongWeb 網頁編修 伸峰科技股份有限公司 李書帆
第 5 章 加 入 圖 片.
把下列各音樂符號和它們的中文名稱配對起來
高中二資訊科 數碼圖像.
通識課程學生學習檔案 E化製作-上傳至blogger 佛光大學 教務處通識教育中心主辦.
安裝 / 操作 flashget SOP (以Win 7 作業系統為範例)
如何利用範本來製作網頁.
Google協作平台+檔案分享(FileZilla+網路芳鄰)
Power Point 教學單元 實作步驟簡表
W3C标准网页制作 主讲教师:张 涛.
個人網路空間 資訊教育.
VS.NET 2003 IDE.
Quiz7 繳交期限: 12/14 23:59.
FTP使用教學 簡介: 軟體名稱:FileZilla 軟體性質:Freeware 版本: 繁體中文版
數位相本製作(二) 軟體:3D-Album 主講:王志強.
国家职业资格全国统一鉴定管理系统 照片采集标准及操作规程 河南凯若管理培训中心 河南华盛职业培训学校 孙爱芳 制作.
Flash 8 基本簡介.
備審資料製作〈四〉 整合製作與應用
把下列各音樂符號和它們的中文名稱配對起來
Dreamweaver 進階網頁製作 B 許天彰.
Chapter 15 檔案存取 LabVIEW中的檔案存取函數也可將程式中的資料儲存成Excel或Word檔。只要將欲存取的檔案路徑位址透過LabVIEW中的路徑元件告訴檔案存取函數後,LabVIEW便可將資料存成Excel或Word檔;當然也可以將Excel或Word檔的資料讀入LabVIEW的程式中。
啟動PowerPoint,並選按『檔案/新增』選項,接著按佈景主題鈕,以檢視PowerPoint預先設定好的投影片樣式
5. 令圖畫動起來 Tween 功能介紹 移動效果 顏色漸變效果 形狀漸變效果 離開.
如何從政大圖書館館藏目錄匯出書目至EndNote
Brief Guide of FrontPage
6.1 動畫檔案的格式 6.2 建立合適的動畫元素.
Chapter 2 影像壓縮簡介.
第二步 做好准备让装修有条不紊 ——前期工作.
DreamWeaver MX (IV) 林偉川.
第五章 自訂佈景主題與文字處理 講授者:詹雅愔.
Presentation transcript:

網頁圖檔簡介 動畫製作 動態HTML效果 製作相片投影片秀 動畫圖檔製作與運用 網頁圖檔簡介 動畫製作 動態HTML效果 製作相片投影片秀 講師: 董建弘 陳鍶琦 日期: 96年7月5日

網頁圖檔簡介

網頁圖檔簡介 檔案格式 BMP GIF JPGE PNG

網頁圖檔簡介 BMP (Bit-Mapped) 壓縮 優點 缺點 應用 無 REL (Run-Length Encoding) 檔讀檔速度是最快 圖形品質最好 缺點 檔案十分龐大 沒有透明格式 應用 正方型圖片 按鈕 較小的背景圖

網頁圖檔簡介 GIF (圖形交換格式) 壓縮 256色調色盤 REL (Run-Length Encoding) 全彩 769KB

網頁圖檔簡介 GIF (圖形交換格式) 壓縮 優點 缺點 應用 256色調色盤 REL (Run-Length Encoding) 有透明及動畫的格式 較同規格(256色)的BMP還小 缺點 顏色流失 不適合作「會移動的圖形」 應用 不規則的圖形 按鈕 色彩簡單的背景圖 bmp gif

網頁圖檔簡介 JPEG (靜態影像壓縮標準) 壓縮 DCT (Discrete Cosine Transform) 全彩 769KB Q90 58KB Q50 24KB Q30 17KB

網頁圖檔簡介 JPEG (靜態影像壓縮標準) 壓縮 優點 DCT (Discrete Cosine Transform) 全彩壓縮 可自定壓縮比 漸進式呈現

網頁圖檔簡介 JPEG (靜態影像壓縮標準) 壓縮 優點 缺點 應用 DCT (Discrete Cosine Transform) 全彩壓縮 可自定壓縮比 漸進式呈現 缺點 圖形品質可能因壓縮而變差 沒有透明格式 應用 大型背景圖 照片

網頁圖檔簡介 PNG 壓縮 優點 缺點 應用 全彩調色盤 有透明格式 較同規格(256色)的BMP還小 無失真 圖形品質可能因壓縮而變差 無動畫格式 應用 不規則的圖形 按鈕 色彩簡單的背景圖

網頁圖檔簡介 綜合比較 GIF JPEG BMP GIF JPG PNG 不失真 透明 256色圖形 全彩圖形 動畫 大型圖檔 瀏覽器

GIF動畫製作

動畫製作 可以做透空設定 ─背景可設透明 可以在一個GIF檔內部,包含多個圖形 ─動態影像

動畫製作 怎麼讓圖片動起來?

GIF動畫製作

LAB 1 製作兩張圖 特點 影像大小一樣 .GIF副檔名 小變化

LAB 1 下載<SUN.ufo>檔案 http://adm.nuk.edu.tw/~chtung/training20070705/lab.zip 下載lab.zip 打開下載好的<SUN.ufo>檔案 存成背景為透明的.gif檔,命名為<SUN1.gif> 將太陽眼睛SIZE調整為高度<10> 將太陽的墨鏡位置往上移為<110> 做完5&6步驟後,另存新檔,命名為<SUN2.gif>

LAB 1 把兩張圖合起來 變成一張動畫圖

LAB 1 開啟 選取動畫精靈 ,設定影像大小為300*300

LAB 1 新增影像,選擇剛剛存好的兩個檔案 <SUN1.gif> <SUN2.gif>

LAB 1 按下一步,做畫格期間的設定,將每秒畫格數設定為<2>

LAB 1 按下一步,完成

LAB 1-1 存成.gif檔案

LAB 1 將製做好的GIF動畫檔加入網頁中

動態HTML效果

動態HTML效果

LAB 2 開啟FrontPage2003 檔案→開新檔案 插入→圖片→從檔案,選擇 <lab01-1.gif>

LAB 2 4. 選取 <lab01-1.gif> 5. 格式→表現方式,出現表示方式視窗

LAB 2 6. 插入→交換圖像 7. 瀏覽→選擇選擇 <lab01-2.gif> 8. 在滑鼠移出時還原事件打勾→確定

實作 利用<Test-LAB2-1.jpg>與<Test-LAB2-2.jpg>做出動態HTML效果

製作相片投影片秀

LAB 3 開啟PhotoImpact Album10 建立新相簿:檔案→開新檔案 相簿範本→一般用途 標題→<jiaming-lake> 確定

LAB 3 6. 跳出插入檔案視窗→選擇<從資料夾插入檔案>→確定 7. 選擇範例檔中的photo資料夾裡的40張圖→插入

LAB 3 8. 完成jiaming-lake相簿建立

LAB 3 9. 編輯→全選 10.選擇右邊選項→ <匯出Web投影片秀> 匯出Web投影片秀

LAB 3 按此可開始製作 相關設定-輸出 在此選擇投影片產生後的存放路徑 →選擇儲存位置E:\20070705test\

LAB 3 將圖檔製作成投影片秀後,可在輸出資料夾內看到所產生的檔案 原先的圖檔會放在Image資料夾中 自動產生的網頁檔及小圖示GIF檔

LAB 3 將圖檔製作成投影片秀後,可在輸出資料夾內看到所產生的檔案 原先的圖檔會放在Image資料夾中 自動產生的網頁檔及小圖示GIF檔

LAB 3 將圖檔製作成投影片秀後,可在輸出資料夾內看到所產生的檔案 2.原先的圖檔會放在Image資料夾中 1.自動產生的網頁檔及小圖示GIF檔 3.執行main.htm可看見成果

LAB 3 可再做細項設定