Download
1 / 53
530 likes | 654 Views
《 相片的數位處理 》 本校運用實例 & 實用基本觀念. 數位教材製作系列課程. 教學卓越中心. 廣告： 為什麼沒有我？！. 爹地媽咪 為什麼 沒 有 我 ？！. 話說有一天爸媽正在客廳裡看電視， 小明突然拿著一張照片跑過來 …. 廣告： 為什麼沒有我？！. 小孩子 講了也聽不懂 ！ 孩子的爹， 照片先處理一下吧 …. 《 相片的數位處理 》 第一場 大綱. 2 開場白 ( 剛看過的那兩張 ) 5 本校運用實例 11 何謂 “數位影像處理”？ 27 影響檔案大小的因素 31 影像大小 & 解析度 39 色彩深度 50 軟硬體
E N D
《相片的數位處理》本校運用實例 & 實用基本觀念 數位教材製作系列課程 教學卓越中心
廣告：為什麼沒有我？！ 爹地媽咪為什麼沒有我？！ 話說有一天爸媽正在客廳裡看電視， 小明突然拿著一張照片跑過來…
廣告：為什麼沒有我？！ 小孩子講了也聽不懂！孩子的爹，照片先處理一下吧…
《相片的數位處理》第一場 大綱 2 開場白(剛看過的那兩張) 5 本校運用實例 11 何謂 “數位影像處理”？ 27 影響檔案大小的因素 31 影像大小 & 解析度 39 色彩深度 50 軟硬體 54 大家來練習吧 別怕！ 字眼看似艱深，其實講的很簡單， 而且大都是 漫畫版的喔！
本校運用實例 不論是各單位、教師或學生，大家數位照片用的越來越多了… (生活上當然也是)
以圖檔為主的網站 • 《世新生活》多媒體資料庫http://media.shu.edu.tw
各單位以網頁方式展示活動成果 世新電台展現廣播營成果 http://shrs.shu.edu.tw/aboutshrs.asp
教師的教學或演講簡報 • 例：人社院李振清院長的簡報 掃描 照片
學生作業逐漸使用大量照片 數媒系學生的作業(Powerpoint檔) (張恩光老師指導) 有的直接擺照片…
學生作業逐漸使用大量照片 數媒系學生的作業(仿魔戒) 有的還做了很多處理…
何謂 “數位影像處理”？ 以前要透過暗房, 花好幾天工夫現在可以用電腦處理, 真是方便太多了！ 數位暗房…
Computer graphics 點陣 Bitmap images﹙創作方式：painting﹚ 相片 手繪 向量 Vector graphics﹙創作方式：drawing﹚ 就是像 Office 裡 「繪圖工具列」的那種啦！ 電腦繪圖 (CG)兩大陣營 將局部放大後, 就能瞧出端倪… 一時很難理解，以後想到再來看…
點陣繪圖 向量繪圖 何謂 “數位影像處理”？ • 主要處理對象：現有點陣圖檔 O X
點陣圖的最小單位：像素 • 像素：pixel = picture element (1) 最小的獨立單位 ( 大小一樣的矩形，約 1 ： 1 ) (2) 位置 ( 排列非常整齊 ) (3) 色彩值 就是一格一格的這種東東 像 素﹙放大圖﹚ 你可以再靠近點…
何謂 “數位影像處理”？ • 處理結果：改變像素的色彩值 • 色彩三要素： H色相、S彩度、 B明度
改變像素的色彩值 • 色彩三要素： H色相、S彩度、 B明度 原圖 B 明度 (Brightness)：很暗 ←→ 很亮
改變像素的色彩值 • 色彩三要素： H色相、S彩度、 B明度 原圖 S 飽和度：鮮豔 ←→ 灰階
改變像素的色彩值 • 色彩三要素： H色相、S彩度、 B明度 原圖 H 色相﹙Hue﹚ 好奇妙喔！
何謂 “數位影像處理”？ • 也可以加上一些有趣的濾鏡(Filter)特效 處理後 處理前
日常照片的常見處理 • 歪了轉正 • 不要的裁掉 • 太大張的縮小些 • 太暗或太亮 • 灰濛濛的對比不夠 • 有點模糊的稍微清楚些 • 女生變美一些 • …
日常照片的常見處理：去背 要很小心、很有耐心地把範圍 圈出來
日常照片的常見處理：調整色彩、合成 雖然拍得不好 但萬一還是要用， 也可以處理看看喔！
除了處理現有的點陣圖檔， 當然你也可以完全自己創作。
點陣圖：相片 繪圖 • If… then紐約‧2006 話說如果那時候賓拉登成功了 那麼以後 男生得這個樣子… 女生得這個樣子… 除非您認識這兩位，不然您可能想不到照片被做了處理…
點陣圖：相片 繪圖 • 畫家：GrandPre • 哈利波特：魔法地圖是她畫的 • GrandPre 官方網站 算了，自己畫好難，還是拿現成的來處理吧！
PowerPoint上照片才沒放幾張，簡報檔為什麼就變這麼大呢？PowerPoint上照片才沒放幾張，簡報檔為什麼就變這麼大呢？ 影響檔案大小的因素 該大的要大，該小的要小！ 為什麼印出來品質這麼差呢？
世新起飛 幾種主要 來源 與 成果 來 源 成果 圖檔或網頁(在電腦上看) 數位相機 要小 掃描 海報、印刷品(平面輸出) 要大 底片幻燈片 (建議送外轉檔再回來處理) 相片光碟(在電視上看)
照片 通常是 JPG 檔 全彩(色調連續, 膚色自然) 美工(卡通)圖案 通常是 GIF 檔 最多256 色(色塊明顯) 照片 vs 美工(卡通)圖案
影響照片類檔案大小的幾大因素 待會介紹 • 影像大小(解析度) • 長*寬= 多少像素? • 壓縮品質(尤其是 JPG) • 品質越高, 檔案當然越大 • 品質高到某個程度, 螢幕上其實也看不太出來 • 色彩深度(尤其是 GIF) 才 6 K 耶 另場介紹 原來拍攝品質就很好, 所以壓縮到這麼小還是很清楚。 影像大小：259*380 檔案大小：6.07 KB照片來源： http://www.msn.com.tw/news/afppic/default.asp 待會介紹
這大概就是讓你照片檔很大 的最常見原因了！ 也就是指長寬各多少啦！ 影像大小 & 解析度 螢幕上看的不要太大 平面輸出的不能太小
您的電腦桌面有多少像素？ • (桌面空白處按右鍵) > 內容> 設定值 > 螢幕設定 1024 x 768 2 3 1
1024 個 768 個 1024 x 768 是什麼意思？
以 Nikon Coolpix 3100 為例 (300 萬畫素) CCD 有效畫素 320萬畫素 可選擇影像尺寸(像素) 2048* 1536 1600* 1200 1024* 768 640* 480 數位相機拍出來的照片有多大？
數位相機拍出來的照片有多大 現在相機的解析度都很高，拍出來的比螢幕大了許多！ • 800萬(3264*2448) • 500萬2560*1920 • 300萬(2048*1536) • 1792*1344 • 1600*1200 • 1280*960 • 1024*768 2560*1920 1600*1200 螢幕1024*768
注意：解析度的決定 依最後呈現媒體，自一開始即應決定 • 印刷用 • 解析度高 (而且可能很高很高很高…) • 只在螢幕上看(如網頁裡) • 解析度低 • 一般不要超過螢幕 • 也儘量讓瀏覽器不需拉動捲動
注意：逝者難追 • 捨棄的資訊、細節再也回不來 例：影像大小：大 → 小 色彩資訊：彩色 → 黑白﹙灰階﹚
來源> 處理> 結果 處理照片時，最好將原來拍攝的較高品質的檔案保留起來，以備後用。 最後存成網頁等某些格式時，最好也將處理檔保留起來。
色彩深度 也就是說, 有展現多少色的能耐！ 嗚~~我只有 12色的… 我有 36色的雄獅蠟筆！
色彩深度 (位元) 同樣長寬時, 在不壓縮情況下 檔案大小的比較, 就看位元的倍數… 1位元 黑 白 黑白2色變化 8位元 灰 階 256色灰階變化 16位元 高 彩65,536種色彩變化 24位元 全 彩16,777,216種色彩變化 ----------------------------------------------------------- 8位元 索引色最高256種變化
色彩深度 --1 位元 (bit) 21=2 黑白 2 色變化 雖然只有 2 色，處理得好，竟然也不錯…
色彩深度 --2 位元 (bits) 22=4 黑灰白 4 階變化
色彩深度 --8 位元 (bits) 28=256 256 灰階變化 當您的眼睛已分辨不出一階階時 連續色調 ﹙和觀看距離之遠近有關﹚
色彩深度 --24 位元 (bits) 28x28x 28 =16,777,216 (1千6百多萬) RGB 大自然色彩遠超過這個不過在螢幕上，諒你的眼睛也沒這麼厲害到都分辨的出來…
色彩深度 --索引色 最多 256 色 從 2色到最多 256色 網頁上常用的 GIF檔就是屬於這種。 因為顏色少，所以檔案可以壓縮到很小。
色彩深度 --索引色 8 色(14 K) 4 色 (10 K) 顏色雖然少，但也許會有特別的風格喔…
網頁安全色彩（216色） 全彩 網頁安全色彩 顏色少多了，而且色階明顯地不連續…
畫家的色盤 --畢卡索 滑過去看看，不同色彩各是什麼感覺？ http://webexhibits.org/colorart/picasso.html
軟硬體 別急！ 只剩幾張就要實做練習了！
Photoshop -- Adobe公司 -- 台灣代理：上奇科技 PhotoImpact -- 友立﹙Ulead ﹚公司 Firework -- Macromedia公司 -- 台灣代理：上奇科技 影像處理軟體 真難選擇ㄝ… 國際最專業最知名的… 支持國產品、對一般人比較好用而且便宜… 方便搭配設計網頁使用…
