呢篇文係一篇好文。想知更多,請撳呢個掣。

電腦圖像

出自維基百科,自由嘅百科全書
Jump to navigation Jump to search

猶他茶壺(Utah teapot);呢個立體模型喺電腦圖像學當中成日俾人攞嚟做例子。
Blender 軟件整嘅一個立體模型;個模型係一隻黑猩猩塊面。
一幅用電腦畫、有三條軸嘅立體坐標圖;幅圖將一啲數據呈現出嚟,等研究者唔使齋靠睇啲數字,亦都方便佢哋發表研究結果俾人睇。

電腦圖像粵拼din6 nou5 tou4 zoeng6英文computer graphics / computer-generated imagery,簡稱「CG」或者「CGI」)係指用電腦整嘅圖像或者影片。呢啲圖像有好多各式各樣嘅用途,例如用嚟整等嘅影視娛樂作品、用嚟處理由現實世界探測到嘅影像、又或者喺科研上將一啲理論所模擬嘅現象呈現出嚟呀噉[1][2]

整電腦圖像大致上涉及以下嘅工作[3][4]

  1. 如果係二維(2D)嘅圖像,噉部電腦要以某啲方式記住幅圖,通常嘅做法係,幅圖嘅每一點都有一柞數字俾部電腦記住,而柞數字就代表咗嗰點「乜嘢色」同埋「有幾光」等嘅資訊;
  2. 如果係三維模型(3D model),噉部電腦要以某啲方式記住個模型嘅樣,例如個模型每隻角都有柞數字俾部電腦記住,數字表達佢個坐標位置,然後每兩隻角之間有數字表達佢哋之間「有冇表面」同埋「塊表面乜嘢色」等嘅資訊;
  3. 幾何變換(geometric transformation)喺整電腦動畫嗰陣會用到:部電腦會用一啲算式計出幅圖像或者個立體模型要點郁,達到某啲視覺效果。例:假想幅圖喺熒光幕中心點,佢會有個坐標值,然後下一刻部電腦將幅圖嘅 X 坐標值(打橫坐標值)加 40 個像素-就會令到幅圖向右手邊跳 40 像素(喺實際應用上,通常 X 坐標值愈右愈大)[5]:Ch. 4

電腦圖像呢家嘢係喺 1960 年嗰時由美國圖像設計師威廉·費他(William Fetter)同佢嘅同事搞起嘅[6]。及後電腦圖像大幅度噉改革咗好多行業,好似係電子遊戲產業呢個大行業,就係因為有電腦圖像先至搞得成嘅,而拍戲圖像設計等嘅領域亦都因為電腦圖像嘅技術而多咗好多花款。到咗廿一世紀,電腦圖像學經已係電腦科學上相當有影響力嘅一個子領域,大學同技術學院嘅電腦科學基礎課程基本上實會教電腦圖像嘅相關知識,而且科技界仲出咗好多專化嘅硬件同軟件幫手整電腦圖像[1][3][7]

概論[編輯]

睇埋:電腦圖像學

定義[編輯]

最廣義嚟講,「電腦圖像」呢個詞可以包嗮所有「用電腦整出嚟但係又唔係字或者聲嘅嘢」[1],多數包括咗以下呢幾樣:

  • 用電腦呈現同埋操作嘅影像;
  • 用嚟整同操作影像嘅電腦技術;
  • 電腦圖像學,專門研究點樣用數碼方式合成同操控視像訊息嘅電腦科學子領域。

到咗廿一世紀,第一同第二意義上嘅電腦圖像周圍都係,喺電視報紙天氣報告、各種嘅大眾媒體、同埋醫療上嘅程序都會用到,而喺科研上一幅整得靚嘅電腦圖像可以用嚟清楚噉表達啲數據,令到啲數據更加容易明同詮釋,而且又可以用嚟將研究緊嘅現象以視覺形式呈現出嚟[5][8]。因為電腦圖像咁有經濟價值,社會對識整電腦圖像嘅人才嘅需求開始提升,而電腦圖像學亦都變成咗電腦科學一個好緊要嘅子領域。喺廿一世紀頭,電腦圖像學嘅發展仲勁到開始有咗一啲子領域,好似係科學視覺化(scientific visualization)噉,就專門研究點樣有效同準確噉用電腦圖像模擬現實世界嘅現象,例如係建築物天氣、同人體呢啲嘢嘅影像化[9]

基本演算法[編輯]

顯示電腦圖像嘅過程大致上可以想像成噉嘅演算法[1][3]

  1. 設定背景嘅影像;
  2. 計算下一刻嘅影像大致上係點嘅,包括「嗰一刻每件物件喺乜嘢位置」、(如果係立體嘅話)「光源喺邊」、(如果係立體嘅話)「鏡頭喺邊」呀噉;
  3. 基於步驟 2 所得嘅資訊,計算喺下一刻,畫面嘅每一點應該係乜嘢色水;
  4. 將步驟 3 嘅計算結果傳去個熒光幕嗰度,等個熒光幕將個影像顯示俾個用家睇;
  5. 返去步驟 2,直至用家叫部電腦收工為止。

好似係以下呢段簡單嘅 Processing 源碼噉(Processing 係一種專門用嚟整電腦圖像嘅程式語言[10]

float y = 100; // 設 y 呢個變數值做 100。
 
void setup() { // 喺 processing 當中,setup(){} 包括嘅碼淨係會喺個程式開始嗰陣運行一次。呢個係步驟 1。
  size(640, 360);  // 設定幅圖嘅大細做 640 x 360 粒像素。
  stroke(255);     // 設筆觸做白色(255 代表白色)。
  
  y = height * 0.5; // 設 y 做幅圖嘅高度嘅一半。
}

void draw() { // 喺 processing 當中,draw(){} 包括嘅碼會係噉重複運行直到個程式結束為止。呢個係步驟 2。
  background(0);   // 將背景設做黑色(0 代表黑色),呢個黑色背景會遮嗮一切之前畫落嘅嘢。
  line(0, y, width, y);  // 喺 (0,y) 同 (width,y) 呢兩點之間畫一條線,線嘅色水同筆觸嘅一樣。
  
  y = y - 1; // 將 y 嘅數值下降 1。
  if (y < 0) { 
    y = height; 
  } // 如果 y 跌到變咗做負數,將佢設做等如幅圖嘅高度。
  // 步驟 3 同 4 喺 processing 當中被省略咗。
} 
// 以上嘅碼會造出一幅背景係黑色嘅圖,背景上有一條白色嘅橫線,而且條橫線仲會一路向上郁,去到最上之後返去最落嘅地方。

圖像表示[編輯]

圖像表示(image representation)指部電腦內部要以某啲方式記住一幅圖像。喺一部數碼電腦入面,資訊係以「0」(冇電)同「1」(有電)嘅方式記住嘅,而部電腦可以安排若干個噉嘅位(例如係 240,000 個)用嚟記住一幅圖像,個圖像每一點有 24 個位嚟記住佢係乜嘢顏色(例:24 個 0 代表黑色)。如是者,呢一大串嘅數字就記錄咗一幅圖像,衹要有啱用嘅解碼方法,部電腦就會曉讀取呢串數字同顯示返幅圖像出嚟[3][4]

二維圖像[編輯]

內文: 二維電腦圖像

點陣圖[編輯]

內文: 點陣圖

一幅點陣圖(raster image)由若干粒像素(pixel)組成。一部電腦所顯示嘅點陣圖每一幅都係由一大柞像素所組成嘅,每一粒像素都有一個坐標記住佢喺邊個位置,並且有一隻色水,隻色水係由唔同濃度嘅紅、綠、同藍結合形成(例如紅溝藍會出紫),從而一齊組成一幅圖。舉個例說明,喺用紅綠藍色彩模式(RGB model)將一幅圖存入去佢嘅記憶體嗰陣,部電腦會記住「」噉嘅一系列數字,每組數字有三個數,每個最細係 0 最大係 255,第一個數代表嗰一點有幾多紅(R),第二個數代表嗰一點有幾多綠(G),而第三個數代表嗰一點有幾多藍(B),而成串嘢當中有 組「每組三個數」嘅數- 就係幅圖嘅像素;最後形成一個矩陣,令到部電腦可以記住幅圖嘅樣[11][12][13]

一幅點陣圖嘅解像度(resolution)係指幅圖有幾多粒像素(),解像度愈高,幅圖就會愈精細,但同時亦都需要嘥更多嘅記憶體嚟保存。廿一世紀嘅電腦經已先進到幅幅圖像都閒閒地都有過 1,000,000 粒像素,用佢哋整嘅圖像就噉用肉眼睇望落好似冇點點噉,但係無論一幅電腦圖像幾精細都好,如果靠得夠近,係可以睇到佢由一點點組成嘅[11]

一幅點陣圖近睇嘅話就會睇得出係由好多點點所組成嘅。

向量圖像[編輯]

內文: 向量圖像

向量圖像(vector graphics)係相對於點陣圖嘅一種圖像記憶法。點陣圖嘅做法將一幅圖像以一大柞像素同埋「每粒像素係乜嘢色水」嘅方式嚟代表,並且要部電腦死記住每粒像素嘅色水數值。相比之下,向量圖像用嘅係一種冇咁靠死記嘅做法:喺向量圖像當中,部電腦會記住幅圖有啲乜嘢形狀同每個形狀喺乜嘢位置(每種形狀都可以用一條數學式表達;睇幾何學),仲有係幅圖每一忽係乜嘢色水,當個用家想睇幅圖像嗰時,部電腦再用呢啲訊息即場砌返幅圖出嚟。例:部電腦記住一幅向量圖像當中背景係白色,有一個紅色嘅圓形,圓形直徑係幾多幾多,圓心坐標喺邊(唔使好似點陣圖噉死記一大柞數字),然後當個用家叫部電腦顯示幅圖像嗰時,部電腦就即刻按照佢所知嘅呢啲訊息即刻砌返幅圖出嚟。喺某啲情況下,向量圖像儲起上嚟比較慳記憶體,而且無論放幾大,幅圖都唔會起格[14][15]

記住啲顏色[編輯]

睇埋:紅綠藍色彩模式同埋HSV、HSL、HSB 色彩模式

電腦圖像學界有研究唔同嘅方法嚟向部電腦表示一點嘅顏色。頭先提到嘅紅綠藍色彩模式(Red Green Blue)係最常用嘅,幅圖每點用三個由 0 到 255 嘅數嚟表達嗰點有幾多紅幾多綠同幾多藍,但電腦圖像學界仲有第啲方法嚟向部電腦表示一點嘅顏色,例如 HSV 色彩模式(HSV model)噉,都係用三個數字代表一點嘅顏色,不過三個數字代表嘅唔係紅綠藍嘅濃度,而係代表色相(Hue;基本顏色屬性)、飽和度(Saturation;色彩純度)、同光度(Value;色彩光度)。有電腦圖像學方面嘅學者指出,一般人類思考一隻顏色嗰陣都係傾向諗「呢隻係乜嘢色」(色相),而唔係諗「呢隻係幾多紅幾多綠幾多藍」,所以 HSV 色彩模式比較合乎直覺,對唔係專業做圖像嘢嘅人嚟講比較易用[16]

坦克遊戲當中嘅平面圖像。喺二維電腦圖像當中,每幅圖都係由多幅細啲嘅二維圖像砌出嚟嘅,嗰兩架坦克喺個遊戲程式入面都有各自嘅精靈圖。

精靈圖[編輯]

內文: 精靈圖

精靈圖(sprite)係指一啲用嚟結合埋一齊,並且產生一部大嘅景嘅二維圖像。例如係喺一隻二維嘅超級瑪利奧(Super Mario)電子遊戲入面,個遊戲嘅程式會內含主角嘅精靈圖同埋啲怪獸嘅精靈圖,而個主角瑪利奧嘅精靈圖又會包含咗(例如)佢企喺度嗰陣嘅樣、佢行路嗰陣嘅樣、同埋佢跳嗰陣嘅樣等等。喺每一個時間點,個程式都會接收玩家俾嘅輸入(例:如果玩家撳咗個「跳」掣,就將遊戲主角向上移動),按照「個主角同每隻怪獸喺邊個位置,喺度做緊乜」呢樣訊息,揀應該用邊幾幅精靈圖,並且按照每件物件嘅位置(可以睇埋物件導向程式編寫),將呢啲精靈圖同個背景合拼埋一齊,最後形成一個畫面[17][18][19]

精靈圖喺廿世紀嘅電子遊戲當中極之常見,好似係香港本土出嘅小朋友齊打交(Little Fighter)系列都係用精靈圖嚟代表隻遊戲啲人物嘅。但係由廿一世紀開始,電子遊戲產業變成以三維圖像做主導,會用精靈圖嘅遊戲已經買少見少,多數都係喺一啲運算能力冇咁勁嘅平台上面出嘅遊戲嗰度先會見到,好似係手機遊戲[17]

三維圖像[編輯]

一個旋轉緊嘅三維模型;個模型由好多個細少嘅簡單立體物件(立方體錐體等等)組成。
內文: 三維電腦圖像

三維電腦圖像(3D computer graphics)會要部電腦記住一啲三維嘅圖像。呢啲圖像會要求部電腦記住三維嘅訊息,即係長度、闊度、同高度-相比之下,二維嘅圖像淨係使部電腦記住一幅圖像長度同闊度。三維電腦圖像嘅處理會用到一啲二維圖像會用嘅技術(例如記顏色嘅方法),但又會涉及一啲二維圖像唔需要嘅技術,例如係彩現(睇下面)噉。

三維模型[編輯]

內文: 三維模型

三維模型(3D model),或者叫「立體模型」,係指一個(對於部電腦嚟講)用數字呈現嘅三維物體。三維模型可以用自動或者手動嘅方法整:有研究者會用一啲架生掃描一件真實嘅物件,再將啲數據傳去部電腦嗰度,等部電腦計算出個三維模型嘅樣,例如個掃描器嘅感應器可以射啲出嚟,喺每一點嗰度量度吓「啲波射出去嘅時間」同「返到個感應器度嘅時間」之間差幾遠,噉就可以知道喺每個點度件物件嘅表面離個感應器幾遠,跟手將呢個數據傳過去部電腦,就係有關件物件嘅形狀嘅數據;另一方面,研究者又有得手動噉整啲 3D 模型出嚟。舉個簡單嘅例子說明,以下呢段 VRML 原始碼(VRML 係一種廿世紀常用嘅程式語言,專門用嚟整立體模型)代表咗一個喺一條好幼嘅藍色圓柱上面嘅紅色球體(即係好似珍寶珠噉嘅形狀)[20]

Shape {     // 整一件物體出嚟。
   geometry Cylinder {    // 設佢形狀係「圓柱體」。
      radius 0.1
      height 3.0}    // 碌圓柱嘅高度係 3.0 個單位,但係半徑得嗰 0.1 個單位-係一碌好幼嘅圓柱。
   appearance Appearance {
      material Material { diffuseColor 0.1 0.1 0.9 }     // 設佢色水係藍色。
   }
}

Transform {     // 整一件新物體
   translation 0 2.5 0     // 將佢移去第一件物體對上 2.5 單位高嘅位置。
   children [
      Shape {
         geometry Sphere { radius 1 }     // 設佢形狀係「球體」,半徑係 1 個單位。
         appearance Appearance {
            material Material { diffuseColor 1 0 0 }     // 設佢色水係紅色。
         }
      }
     ]
}

呢段碼係一個簡單嘅例子,一啲複雜啲嘅模型-好似係一個人類角色嘅立體模型-閒閒地可以有成幾千幾萬行呢啲噉嘅碼[21]

多邊形網格[編輯]

內文: 多邊形網格

多邊形網格(polygon mesh)係常用嘅三維模型。呢啲模型會用類似上面嗰段 VRML 碼噉嘅程式語言,話俾部電腦聽個模型有幾多個角(vertex)、每隻角嘅位置坐標、每兩個角之間有冇邊(edge)、同埋(如果有)塊表面係乜嘢色水呀噉。當個用家要睇個三維模型嗰陣,部電腦就會即場砌返個模型出嚟,再考慮個用家由乜嘢角度睇緊個模型,計出最後個平面影像應該係點嘅樣。廿一世紀開始嘅電腦運算能力勁到可以俾個用家即場改變觀察角度,即刻以肉眼睇唔到嘅速度計出由呢個新角度睇個模型會係乜樣,等個用家可以自由噉睇個模型嘅唔同面[22]

好似係以下呢個立方體嘅立體模型噉:

Mesh we2.jpg

上面幅圖嘅意思係:部電腦記住咗一串數字,代表每隻角嘅坐標位置(vertex list; 代表第 隻角),跟住另一串數字記住每條邊喺邊兩隻角之間(edge list; 代表第 條邊),最後再有一串數字記住邊啲邊之間有表面(face list; 代表第 塊面)。當要用個模型嗰陣,部電腦就會睇吓個用家由乜嘢角度睇緊個模型,計出個模型由嗰個角度睇應該係點嘅樣嘅[22]

材質貼圖[編輯]

內文: 材質貼圖

材質貼圖(texture mapping)指嘅係,個圖像處理程式要加一啲仔細位、色水、或者表面材質落一個立體模型嗰度。個電腦圖像設計師喺整好咗一個立體模型之後,好多時會想個模型表面唔淨係衹係得純色,而係想個模型望落似真實嘅物體,而真實嘅物體嘅表面好少可真係純色嘅,所以佢哋就會想加啲材質(texture)落個模型嗰度,令到個模型表面好似用(例如)木頭造嘅噉;佢要搵一幅二維嘅圖像返嚟,幅圖像望落似佢想要嗰款材質,然後再教部電腦將幅材質圖貼落去個模型嘅表面嗰度[23];成個過程可以想像成將一張有圖案嘅紙包落去一件立體物件嗰度噉[24]

材質貼圖嘅圖解;一個立體模型每個表面都有特定嘅材質。

幾何變換[編輯]

內文: 幾何變換

喺電腦圖像學上,幾何變換(geometric transformation)涉及操控圖像同模型各種屬性(位置或者角度),嚟到將想用嘅物體移去目標位置或者做某啲特定嘅變形。想像而家整二維電腦圖像,有一個簡單嘅四方形,個四方形可以表示為一柞點 ,當中 表示第 隻角(1 係最左上角,2 係最右上角,3 係左下角...),當部電腦俾用家要求佢顯示個四方形出嚟嗰陣,佢會做嘢係搵出嗰四個 ,並且喺四個 畫出適當嘅線,形成一個四方形-所以要將呢個四方形移位或者變形,基本上就係要對呢啲數字做一啲加減乘除。例如係縮放(scaling)噉,就係指將件物體按比例放大-例:將 之間嘅距離增加 倍,而 之間嘅距離等等... 同理[25]。專門處理電腦圖像嘅程式語言多數都會有特定嘅陳述式做幾何變換[26][27]

彩現[編輯]

一舊有濃淡嘅物體
內文: 彩現

彩現(rendering)係指運用電腦程式由一柞立體模型嗰度整一幅二維影像出嚟嘅過程。想做彩現嘅人會首先整一個景檔案(scene file)出嚟,呢個檔案會包含咗多種訊息,包括係「個景入面用咗啲乜嘢立體模型」、「每個立體模型喺邊個位置」、「光源喺邊」、「個鏡頭擺喺邊個位置」、同埋「幾何變換」(睇下面)呀噉,描述個景係點嘅。然後部電腦會將呢個檔案入面嘅數據傳去一個彩現程式嗰度,等個程式做一大柞人手做唔嚟嘅運算,計出個鏡頭會睇到嘅(二維)影像應該係點嘅樣嘅,並且將個鏡頭所睇到嘅影像俾出嚟做輸出(輸出會係一幅點陣圖或者第啲二維圖像)[28][29]

掃描線彩現(scanline rendering)係最常用嘅彩現演算法之一。是但搵一幅電腦圖像,幅嘢都係由一大柞(好多時數以百萬粒)像素組成嘅。掃描線係指一行像素,掃描線演算法會每粒像素睇一次,並且按照個鏡頭嘅位置、啲 3D 模型嘅位置、以及光源嘅位置同角度等嘅訊息嚟計出嗰粒像素應該顯示啲乜嘢色水。如是者,經過幾百萬次計算,部電腦就可以計出幅圖應該係乜嘢樣嘅。喺現代嘅電腦當中,呢啲運算快得好交關-唔使幾秒部電腦經已俾到幅圖出嚟[30][31]

個彩現程式通常都係內置咗喺個電腦圖像軟件入面嘅,而且好多時會有啲特殊功能嚟做一啲特殊效果。彩現嘅過程涉及好多唔同嘅演算法,例如[28][29]

  • 三維投影(3D projection)-係指將三維空間入面嘅點對應落去一個二維平面嗰度嘅過程。一個彩現程式要(例如)由鏡頭嗰度射多條虛想嘅線出去,再睇下鏡頭每點射出去嘅線最先接觸到個景入面邊舊嘢,從而計出個二維圖像每一點要顯示由邊舊嘢邊忽嚟嘅光。
  • 光線追蹤(ray tracing)-個程式又可以模擬物理學上嘅,假想有光由光源嗰度射出,並且計出每條光線會由乜嘢表面反射(同埋反射咗之後變成乜嘢顏色),最後進入個鏡頭嗰度變成乜嘢樣。呢種做法可以創造出好真實嘅圖像,但係計算量好大,所以好多時會造成要嘥好多時間做彩現。
  • 濃淡處理(shading)-個程式要能夠以唔同程度嘅黑暗,嚟描繪一個立體模型嘅唔同部份,就好似喺畫畫嗰陣用重啲嘅筆觸嚟令某啲地方深色啲,用輕嘅筆觸嚟令某啲地方淺色啲噉。某啲部份黑啲能夠令到一件物體望落有景深,令到佢望落比較似立體。喺現今嘅電腦圖像界,要做濃淡處理可以有好多演算法。

電腦動畫[編輯]

內文: 電腦動畫

電腦動畫(computer animation)係一種用電腦整曉郁嘅圖像嘅藝術,係電腦圖像同動畫嘅一個子領域。現代嘅電腦動畫多數係用立體模型嚟整嘅,但係有陣時啲人仲係會因為藝術風格或者低頻寬等嘅因素而用二維圖像整電腦動畫。呢種技術廣泛噉俾人攞嚟整戲(好似係彼思動畫製作室,就喺呢方面好出名)同埋電子遊戲,而當佢俾人用喺戲上面嗰陣,佢通常都會俾人稱之為「CGI」[32][33]

喺整電腦動畫嗰陣,部電腦會記住每個立體模型嘅各種屬性-包括個模型嘅位置、方位、同埋縮放呀噉,並且將呢啲訊息儲喺件物件嘅變換矩陣裏面,而動畫就即係呢啲屬性隨住時間嘅改變。要造出一幅曉郁嘅圖像有好多方法[32]

  • 最簡單嗰種電腦動畫做法係建基於關鍵格(keyframe)嘅逐一創造同編輯嘅-個設計者可以設一大柞關鍵格,再逐個逐個關鍵格噉編輯,要部電腦記實嗮喺每一個關鍵格當中,每一個立體模型要喺邊個位置同埋以啲乜嘢方位擺,再逐個關鍵格做彩現-每個關鍵格整返一幅二維嘅圖像,並且形成一串組成嗰段動畫嘅(定格)圖像,而如果關鍵格嘅數量夠多,每幅之間嘅時間間距夠短,噉將啲關鍵格逐幅逐幅播出嚟就會造成好似動畫噉嘅效果。
  • 除咗噉,又有所謂嘅動作捕捉(motion capture)技術;喺呢種技術當中,啲程式員會俾個受過訓嘅人員戴住啲感應器喺身上,再要呢啲人員做某啲動作,跟住每一個感應器就會將佢「每一個時間點喺乜嘢位置」嘅訊息傳返去部電腦嗰度,然後程式員就會將人物嘅立體模型嘅各忽對應落去相應嘅感應器數據嗰度(個人物模型嘅膝頭對應個人員嘅膝頭),令到部電腦知每個時間點個人物模型嘅每一忽應該要喺乜嘢位置。
  • 電腦圖像學上又有方法會將某啲特定嘅變化用數學算式嚟模擬,例如用牛頓運動定律(Newton's laws of motion;由牛頓諗出嚟,可以用嚟模擬物體郁動嘅一啲方程式),話俾部電腦聽物件應該係點郁動嘅,等部電腦自動計出(例如)一舊物件喺受到某啲力之後會以點嘅速度飛走(於是就計得出每個時間點每件物體應該喺乜嘢位置)。

同傳統動畫一樣嘅係,電腦動畫都係建基於人眼嘅錯覺嘅:一段動畫由好多幅靜態嘅圖組成,而喺播段動畫俾人睇嗰陣,部電腦查實衹係將嗰啲圖逐幅逐幅按佢哋先後次序播出嚟,但係因為每幅圖像之間嘅時間間距極之短,用肉眼睇望落好似啲嘢識郁噉[34][35]

電腦動畫可以用動作捕捉嘅方法整。最右手邊嘅係身上戴住啲感應器做動作嘅人員,啲感應器會話返俾部電腦知個人員每個關節同身體部位喺邊個位,跟手部電腦會用呢啲訊息令到個人物立體模型嘅身體跟住嗰啲位置排。

應用[編輯]

數據視覺化[編輯]

內文: 數據視覺化

數據視覺化(data visualization)可以話係數據科學嘅一個子領域,專門研究點樣將一啲數據視像化:喺科研上,科學家工程師會搜集一啲數據返嚟,用嚟驗證所研究嘅理論以及測試所研究嘅新機械設計係咪有用等;佢哋好多時都要嘗試用啲數據做滙報,話俾人聽自己嘅研究結果。呢個時候,佢哋就會想將自己手上嘅數據以圖像嘅形式呈現出嚟,等啲數據易理解啲。數據視覺化通常俾人認為係一門科學,但有陣時啲人又會研究點樣將啲數據以有美感嘅方式表達出嚟,令到呢個領域又有少少似藝術[36][37]

例子有下面嗰幅散佈圖(scatter diagram)噉:幅圖條 Y 軸表示通脹率,X 軸表示失業率,而每一點代表美國 2000 年至 2014 年 8 月之間嘅其中一個時間點,所以呢幅圖顯示咗,俾是但一個時間點,如果喺嗰點嘅通脹率愈高,噉喺嗰點嘅失業率傾向會愈低;而畫出嚟嗰條紅色嘅線顯示,「通脹率」同「失業率」呢兩個變數大致上成反比(睇埋迴歸分析[38]

圖例

電子遊戲[編輯]

睇埋:遊戲編程

電子遊戲(electronic game)好大程度上係能夠同玩家互動嘅電腦圖像,可以想像成以下嘅演算法[1][3][39]

  1. 設定背景嘅影像;
  2. 按照玩家俾嘅輸入,計算下一刻嘅影像大致上係點嘅,包括「嗰一刻每件物件喺乜嘢位置」、(如果係立體嘅話)「光源喺邊」、(如果係立體嘅話)「鏡頭喺邊」呀噉(例:如果玩家撳掣令佢控制嗰個人物向左移動,噉「主角人物」呢件物體就要向左移動);
  3. 基於步驟 2 所得嘅資訊,計算喺下一刻,畫面嘅每一點應該係乜嘢色水;
  4. 將步驟 3 嘅計算結果傳去個熒光幕嗰度,等個熒光幕將個影像顯示俾個用家睇;
  5. 返去步驟 2,直至用家叫部電腦停手為止。

電腦圖像技術上嘅進步對於電子遊戲嘅設計嚟講好緊要:研究顯示,一隻遊戲嘅圖像質素(以解像度、銳度、同雜點等指標量度)愈高,玩家就愈會傾向投入嗰隻遊戲同埋喺玩嗰陣經歷心流(flow experience;一種特殊心理狀態,指個玩家高度專注於隻遊戲,打後仲會好想再玩多次)。因為呢個緣故,有唔少電子遊戲設計者同製作者會投放資源研究點樣改善電子遊戲嘅圖像嘅質素[40][41][42]

睇埋[編輯]

電腦圖像始祖威廉·費他嘅相;呢幅相係喺 1963 年影嘅。

CG 程式語言[編輯]

CG 製作軟件[編輯]

參考書[編輯]

  • L. Ammeraal and K. Zhang (2007). Computer Graphics for Java Programmers, Second Edition, John-Wiley & Sons, ISBN 978-0-470-03160-5.
  • David Rogers (1998). Procedural Elements for Computer Graphics. McGraw-Hill.
  • James D. Foley, Andries Van Dam, Steven K. Feiner and John F. Hughes (1995). Computer Graphics: Principles and Practice. Addison-Wesley.
  • Donald Hearn and M. Pauline Baker (1994). Computer Graphics. Prentice-Hall.
  • Francis S. Hill (2001). Computer Graphics. Prentice Hall.
  • Jeffrey J. McConnell (2006). Computer Graphics: Theory Into Practice. Jones & Bartlett Publishers.
  • R. D. Parslow, R. W. Prowse, Richard Elliot Green (1969). Computer Graphics: Techniques and Applications.
  • Pearson, M. (2011). Generative Art. Manning Publications Co.
  • Peter Shirley and others. (2005). Fundamentals of computer graphics. A.K. Peters, Ltd.
  • M. Slater, A. Steed, Y. Chrysantho (2002). Computer graphics and virtual environments: from realism to real-time. Addison-Wesley.
  • Wolfgang Höhl (2008): Interactive environments with open-source software, Springer Wien New York, ISBN 3-211-79169-8.

[編輯]

  1. 1.0 1.1 1.2 1.3 1.4 What is Computer Graphics?, Cornell University Program of Computer Graphics. Last updated 04/15/98.
  2. Foley, J. D., Van, F. D., Van Dam, A., Feiner, S. K., Hughes, J. F., Hughes, J., & Angel, E. (1996). Computer graphics: principles and practice (Vol. 12110). Addison-Wesley Professional.
  3. 3.0 3.1 3.2 3.3 3.4 Foley, J. D., & Van Dam, A. (1982). Fundamentals of interactive computer graphics (Vol. 2). Reading, MA: Addison-Wesley.
  4. 4.0 4.1 Marschner, S., & Shirley, P. (2015). Fundamentals of computer graphics. CRC Press.
  5. 5.0 5.1 Schneider, P., & Eberly, D. H. (2002). Geometric tools for computer graphics. Elsevier.
  6. Herbert W. Franke: Computergraphik Computerkunst. Bruckmann, München 1971, first published.
  7. Machover, C. (1978). A brief, personal history of computer graphics. Computer, (11), 38-45.
  8. Vidal, F. P., Bello, F., Brodlie, K. W., John, N. W., Gould, D., Phillips, R., & Avis, N. J. (2006, March). Principles and applications of computer graphics in medicine. In Computer Graphics Forum (Vol. 25, No. 1, pp. 113-137). 9600 Garsington Road, Oxford, OX4 2DQ, UK.: Blackwell Publishing Ltd.
  9. Friendly, M., & Denis, D. J. (2001). Milestones in the history of thematic cartography, statistical graphics, and data visualization. URL http://www. datavis. ca/milestones, 32, 13.
  10. Loop. Processing.org.
  11. 11.0 11.1 Rudolf F. Graf (1999). Modern Dictionary of Electronics. Oxford: Newnes. p. 569.
  12. Noll, A. Michael (March 1971). "Scanned-Display Computer Graphics". Communications of the ACM. 14 (3): 143–150.
  13. Goldberg, Adele and Robert Flegal. "ACM president's letter: Pixel Art". Communications of the ACM. Vol. 25. Issue 12. Dec. 1982.
  14. Greenberg, Ira (2007). Processing: Creative Coding and Computational Art. Apress.
  15. Amy Arntson (2011). Graphic Design Basics (6th ed.). Cengage Learning. p. 194.
  16. Toby Berk; Arie Kaufman; Lee Brownston (August 1982). "A human factors study of color notation systems for computer graphics". Communications of the ACM. 25 (8): 547–550.
  17. 17.0 17.1 Hague, James. "Why Do Dedicated Game Consoles Exist?". dadgum.com.
  18. Schaul, T. (2013, August). A video game description language for model-based or interactive learning. In 2013 IEEE Conference on Computational Inteligence in Games (CIG) (pp. 1-8). IEEE.
  19. Khalifa, A., Green, M. C., Perez-Liebana, D., & Togelius, J. (2017, August). General video game rule generation. In 2017 IEEE Conference on Computational Intelligence and Games (CIG) (pp. 170-177). IEEE.
  20. Sikos, L. F. (2016). Rich Semantics for Interactive 3D Models of Cultural Artifacts. Communications in Computer and Information Science. 672.
  21. VRML Annotated Reference 互聯網檔案館歸檔,歸檔日期2007年1月9號,..
  22. 22.0 22.1 Bruce Baumgart, Winged-Edge Polyhedron Representation for Computer Vision. National Computer Conference, May 1975.
  23. Blythe, David. Advanced Graphics Programming Techniques Using OpenGL. Siggraph 1999.
  24. Wang, Huamin. "Texture Mapping" (PDF). department of Computer Science and Engineering.
  25. Fundamentals of Computer Graphics - CM20219 Lecture Notes. Ch. 3.
  26. Transformations - OpenGL.
  27. 2D Transformations. Processing.
  28. 28.0 28.1 Bouknight, W. J. (1970). "A procedure for generation of three-dimensional half-tone computer graphics presentations". Communications of the ACM. 13 (9): 527–536.
  29. 29.0 29.1 Phong, B-T (1975). "Illumination for computer generated pictures". Communications of the ACM. 18 (6): 311–316.
  30. Computer Graphics: Scan Line Polygon Fill Algorithm. Own shares in HackerNoon.
  31. Scanline Fill Algorithm.
  32. 32.0 32.1 Beane, Andy (2012). 3D Animation Essentials. Indianapolis, Indiana: John Wiley & Sons.
  33. Lasseter, J. (1987, August). Principles of traditional animation applied to 3D computer animation. In ACM Siggraph Computer Graphics (Vol. 21, No. 4, pp. 35-44). ACM.
  34. Beck, Jerry (2004). Animation Art: From Pencil to Pixel, the History of Cartoon, Anime & CGI. Fulhamm London: Flame Tree Publishing.
  35. Moore, M., & Wilhelms, J. (1988, August). Collision detection and response for computer animation. In ACM Siggraph Computer Graphics (Vol. 22, No. 4, pp. 289-298). ACM.
  36. Cleveland, William S. (1993). Visualizing Data. Hobart Press.
  37. Evergreen, Stephanie (2016). Effective Data Visualization: The Right Chart for the Right Data. Sage.
  38. Friendly, Michael; Denis, Dan (2005). "The early origins and development of the scatterplot". Journal of the History of the Behavioral Sciences. 41 (2): 103–130.
  39. Ultimate Guide to the Processing Language Part II: Building a Simple Game.
  40. McGloin, R., Farrar, K. M., & Krcmar, M. (2011). The impact of controller naturalness on spatial presence, gamer enjoyment, and perceived realism in a tennis simulation video game. Presence: Teleoperators and Virtual Environments, 20(4), 309-324.
  41. Bracken, C. C., & Skalski, P. (2009). Telepresence and video games: The impact of image quality. PsychNology Journal, 7(1).
  42. Hou, J., Nam, Y., Peng, W., & Lee, K. M. (2012). Effects of screen size, viewing angle, and players’ immersion tendencies on game experience. Computers in Human Behavior, 28(2), 617-623.

[編輯]