HW03

HW3-1 SONY 身歷其境3D展參觀之心得感想

其實我很少參觀類似這類有關資訊產業的展覽，其實大多數人對於

這類的展覽抱持著「應該很無聊吧」或是「我一定都看不懂」的心

態，以至於去參觀的意願都不怎麼高，但是親身經歷了一趟資訊旅

程之後，一切都改觀了。


這次SONY所舉辦的3D展真的是身歷其境、栩栩如生，不驚讚嘆科

技是如此進步，會場內有許多的攤位，每一個攤位都是一次不同的

歷險，然而其中最令我印象深刻的，就非3D電影院莫屬了，戴上3D

眼鏡，彷彿置身電影場景之中，一草一木有如伸手可及一般，非常

的真實，有種令人起雞皮疙瘩的感覺，實在是太驚人了，當下的我

只希望我的親朋好友們也能夠和我一起來體驗這夢幻的視覺饗宴。


在會場流連忘返的我，也覺得驚訝，逛展覽竟然能夠讓我如此癡迷，

參展之後，對於剛剛所看過的3D影像一直念念不忘，我的腦中浮現

了一個未來，在不久之後，所有人、不分男女老少，不管是富貴還

是貧窮，大家都帶著3D眼鏡，享受著前所未有的震撼，又或許在更

不久之後，連3D眼鏡都不需要戴了，立體擬真影像直接歷歷在目，

呈現在每個人眼前的，是實而不虛、虛而不實、如假似真的影像，

就如海市蜃樓一般，看的到卻摸不著，這樣的技術，實在是很吸引

人。


一個展覽，帶給我無限遐想；創新的科技，帶來的是無限的未來。






HW3-2 初探立體影像

竟然要自己動手做3D立體圖呢!!以前連想也沒想過，感覺似乎

很困難耶，現在趕緊來試看看吧。

首先，找一位MODLE、在此就找我最愛的DOMO君!

將模特兒放置在背景和模特兒本身有距離差的位置，才能夠

突顯立體的效果!

只拍一張是不能夠做出立體效果的，因此必須以兩種不同的

角度來拍攝，才可以唷!

DOMO君擺好POSE就開拍囉!!

喀擦喀擦!




(右眼視角影像)

恩恩~不錯不錯，換個角度再來一張!

喀擦喀擦!



(左眼視角影像)

看起來差異似乎不太大對吧?嘿嘿，將這兩張照片經過特殊

處理之後....



(3D立體影像)

將一張影像使用色調的處理，讓其只顯示藍色，而另一張

影像則是顯示紅色，處理過後再將兩張影像作重疊的動作

3D立體圖就完成囉!

此時，只要特製一副紅藍玻璃紙眼鏡(即眼鏡左右兩邊各貼

上紅色及藍色玻璃紙)，戴上觀看，就會發現DOMO君似乎

浮現出來了呢。

接下來，試試看使用PHOTOSHOP來製作3D立體圖吧!

先讀取我所拍的"左眼"DOMO影像，在該圖上覆蓋上紅色

布幕，以加深其紅色!

如下，將紅色布幕之透明度大約調整至50%

調整好之後，將布幕覆蓋上原圖，如下

覆蓋完成之後，就會看到下圖這樣的效果!




看看~這樣就覆蓋成功了!!



(左眼紅色DOMO)

左眼處理完成之後，接下來就是右眼，

重複上述之過程，只是"右眼"DOMO影像是覆蓋上藍色

下圖是覆蓋之後的成果



來看看覆蓋成功之後的藍色DOMO吧!



(右眼藍色DOMO)

將兩張處理過後的圖片，調整其透明度之後，將兩張

圖片重疊，來看看下圖



此即為成品~

在這邊，展示一張PHOTOSHOP內建之3D影像處理

功能應用之後的成品~



感覺起來就是比我做的專業了許多呢!



心得感想:

這次的3D作業真的花費了我好一番功夫呢!要拍攝並且製作出

一張成功的3D立體圖示一件相當不易且費工的過程，途中失敗

好幾次，上述所呈現都是我所作出最成功的，經過自己的親身

體驗，不得不更加佩服那些專業級的3D圖像或是3D電影技術

之強大，而其中，PHOTOSHOP也讓我花了非常長一段時間

去摸索和熟悉，從一開始的多次拍攝，到嘗試不同軟體去測試

但最後能夠製作出屬於自己的3D立體圖，很有成就感，但是

還是不夠好!其中一定還有許多知識和技巧是我還尚未發現的!

然而這門課程也到了尾聲，我所學習到的是一些基本的影像

知識，如影像於電腦之中存取的方式，影像大小之計算等等

一些基本的應用和原理略知一二，還有這市我第一次接觸到

BCB，這是一套很好的程式編輯器，遺憾的是我還是不夠熟悉

倘若有機會，日後希望能夠有機會多多接觸BCB。這學期最令

我印象深刻的也就是老師帶我們去參觀的SONY 3D展，這真

的是一次非常難忘的經驗，從未想過上大學還能夠校外教學的

非常謝謝老師給我這樣難得的機會，而這學期的作業只有三樣

如果可以的話，個人建議能夠在稍微增加一些數量，我覺得

作業如果能夠循序漸進，每一次的作業量不要太多這樣最好，

這樣同學們也不會因為覺得作業太多或是太困難而放棄，少量

但卻多次這樣比較妥當，還有希望可以有更多能讓大家自行撰

寫程式的機會，以上為個人淺見，感謝這學期老師所教授的知識

謝謝老師~祝老師有個愉快的寒假!

HW02

HW2-1 GIF簡易動畫製作

這次的作業是要用GIF ANIMATOR製作簡易的小動畫

所以呢，我決定用DOMO君當我的model，找了一些他

的影片，從中截圖並將圖片轉成GIF檔，如下




為了讓動畫看起來較有連貫性，擷取的圖片都盡量和上

一張有關聯，讓別人知道這個動畫是在表達什麼，也比

較有劇情性，而這次我所製作的小動畫，DOMO由畫面

的右邊跑向左邊，之後他和他的好友一起拿著飲料走到

草原，DOMO喝了飲料之後，很享受。

以下就是此次作業的動畫





心得感想:

DOMO真的好可愛，很喜歡DOMO，這次能夠用自己喜

歡的圖案做作業，真棒，然而在製作過程中所遇到的困

難其實也還好，在找影片和截圖花了一點時間，做完之

後就太開心迫不期待執行，之後發現動畫閃的很快，什

麼也看不到，是忘記調整動畫的顯示時間，圖片的變換

速度正常了，卻發現每次動畫只跑一次就停住了，原來

是忘了勾選持續重複播放的選項，還真的是急不得呢，

這樣子就完成囉，非常的簡易，這套軟體真是十分的方

便好操作呢，以後想自製MSN頭像小動畫就可以使用它!

非常的好上手，而且網站上的教學也講得很清楚詳細。

我的收穫:

關於GIF圖片失真問題---

這作業，其美中不足的地方就是大部分的圖片轉為GIF檔

就變得很失真，圖片會模糊並且霧霧的，為何轉成GIF檔

失真呢?因為jpeg的圖片是24位元色彩，可以有將近1667萬

種顏色，而GIF圖片為8位元色彩，最多只有256色，因此

失真是無法避免的。

關於上傳動畫至部落格卻不會動的問題---

似乎有非常多的人遇到這樣的問題，家綺是說圖片原始大小

的問題，而喬立教了我一個好辦法，將動畫上傳至一個空間

在部落格中，修改Html的地方編輯，使用語法將動畫放上去

即可解決這個問題。







HW2-2 分析GIF動畫


首先，先開啟PSPad程式

選擇檔案->以HEX編輯器開啟




就以我的DOMO君動畫當做範例吧

開啟之後，就會看到一大片密密麻麻16進位的數字

如下




真是令人眼花撩亂，讓我們來一個一個解析

就從第一行開始吧




前12個數字(00~05，也就是6個位元組)是GIF檔的簽章(檔案--GIF89a)

06~0C即為電腦螢幕描述

0607是螢幕的寬度，換算方式為0706然後16進位改成10進位

而我的寬度是0280--->640

而後面的兩個位元組代表是螢幕的高度，換算同寬度

0908為16進位轉成10進位，0167--->359

而0A~0C那段F7

F7轉二進位11110111

在此，再將之分為1 111 0 111

m=1->螢幕描述後面接色彩對應圖

cr+1->顏色解析度位元數目

c=111轉十進位之後為7，c+1之後為8，因此顏色解析度位元數目為8

pixel+1->影像的位元/像素的數目

而0B的00為螢幕背景的顏色索引

在0C後面一大串的數字，都為GIF色彩對應圖

直到NETSCAPE之前都是

那麼NETSCAPE在哪裡呢?

如下




在上方工具欄有搜尋文字，點下去





在尋找欄位鍵入NETSCAPE

噹噹，就找到啦!







HW2-3 GIF圖像之調色盤分析


用BCB撰寫一程式，使之能夠讀取一GIF圖檔，


並將其調色盤顯示出來。

下圖即為讀取上述DOMO君之後的調色盤 ↓

真是五彩繽紛~原來我的DOMO君動畫是這些顏色組成的

接下來分析看看其他GIF圖檔試試

可愛的兔子彈吉他! 其調色盤 ↓



很明顯色彩就沒有這麼鮮豔，因為兔子的圖相對之下

就沒有非常色彩繽紛，該圖大致就是以黑、白、灰、

橙、紅、土黃色所構成，於是調色盤所顯示的顏色就

是這些，非常有趣。

之後發現JPEG、BMP檔讀取之後都沒有反應呢!


心得感想:

成功寫出程式後很興奮，雖然都是修改老師的範例，

不過還是有研究一下，因為這一項作業，更加了解其

GIF圖檔的儲存方式，我之前有學到它最多就是儲存

256種顏色，但是這樣還是太少，並沒有辦法把圖像

盡善盡美的呈現出來，因此有時將圖片轉為GIF檔時

會有失真的現象。

在撰寫程式的過程中，有一點小小的領悟，或許微不

足道，但是還是在此發表一下好了~

首先看看下圖



我和我室友有著同樣的困擾，一些文字描述的後段都

會被截掉，之後研究出來改善的方式



如圖，於欲輸出的事物(可以是一個檔名、變數等)後面

加上一串空白，字串被截掉的問題就解決囉!




而且還發現，空白鍵越多、能多顯示的字串就越長呢!!

HW01

ＨＷ０１

簡易版小畫家

功能介紹：

＊基本功能：能於畫板上任意塗鴉

＊讀取／儲存圖片：點選視窗左上角，可以選擇開啟圖片或儲存圖片

　　　　　　　　　開啟圖片－＞選擇欲使用的圖檔，呼叫之後顯示

　　　　　　　　　　　　　　　於視窗，並且能在圖片上任意塗鴉

　　　　　　　　　儲存圖片－＞將編輯過後的圖片做儲存的動作

＊圖片資料：於圖片右下方會顯示該圖片的檔案路徑，以及使用者滑

　　　　　　鼠所點該點之Ｘ和Ｙ座標、還有該點的顏色ＲＧＢ。

＊調色盤：有基本的五色供使用者選擇，分別為黑、白、紅、綠、藍

　　　　　只要點擊該顏色區塊一下，即可變換畫筆成為該顏色。

若覺得顏色不夠用，點取下方的＂自訂顏色＂按鈕，將會

跑出可自定義顏色之界面（如下圖）。





撰寫過程所遇之困難與心得：

第一個所遭遇到的困難就是畫板的部分吧，先前是、倘若沒有讀取任

何圖檔，就直接在畫板的位置點滑鼠左鍵，就會跑出錯誤，導致程式

強制結束，找了很久的問題，才發現，其實只要把以下這兩行用掉，

Graphics::TBitmap *BrushBmp = new Graphics::TBitmap;

BrushBmp->LoadFromFile(OpenPictureDialog1->FileName);

就不會錯了，而且可以直接在畫板的地方盡情塗鴉。

接下來就是畫筆的形狀部份了，正方形沒有問題，但是畫六邊形的時候

那個X，Y座標就讓我思考了一陣子，一開始做的形狀歪七扭八，不過經

過幾次嘗試，還是順利成功做出來了

TPoint points[6];
points[0] = Point(X,Y);
points[1] = Point(X+10,Y);
points[2] = Point(X+20,Y-15);
points[3] = Point(X+10,Y-30);
points[4] = Point(X,Y-30);
points[5] = Point(X-10,Y-15);

原來他是像人拿著一隻筆這樣，從第一個點畫到第二個點，從第二個

畫到第三個點，以此類推，要有依序的給予每個點正確的座標，不能

跳著給的。

還有常常會有，就是要刪掉不會用到的物件，結果刪除後造成程式跑

出ｅｒｒｏｒ，或是不小心誤刪了某個物件的函數結果造成程式無法

正常執行的窘境，我在撰寫的過程中也常常遇到這樣的問題，研究了

很久發現，還要把這個地方（如圖中的紅圈處）的東西刪除，才算是

真正刪乾淨唷！

（以下為圖例）



這裡就有點像是宣告各個物件函數的地方，如果只是在主程式那邊把

函數刪掉，沒有把這邊的也刪掉的話，就會造成錯誤，有的時候如果

看到一些例如某物件未定義的錯誤訊息，不彷來這邊看看，是名子弄

錯了還是怎麼樣。

其實我覺得自己對ＢＣＢ還不是很熟練，應該是還摸不夠久的關係，

而且程式語言這種東西不是說單看書本或是聽老師講解看示範就能夠

弄懂的東西，一定要實際撰寫，動腦筋去思考才能有所收穫，其實有

很多功能也是自己慢慢摸才發現的，沒實際去摸過幾遍真的會不知道

其實ＢＣＢ有很多好用的功能呢！

和同學討論也是很重要的，有時候遇到一些困難，與其自己苦思很久

或是上網找了老半天的資料，倒不如直接向同學詢問，而且多和同學

交流，會發現很多自己沒有想到的問題，例如程式是否會存在著某些

漏洞？亦或是這樣的程式寫法較簡潔清楚而不會過於冗長雜亂，學習

他人程式撰寫上良好的地方、並吸收之，記取他人撰寫程式時所遇到

的錯誤、以此警惕之。

非常感謝老師寬宏大量將繳交作業的時間延長，讓我能夠把這次的程

式再寫得更完整一點，研究了很久雖然花了不少時間，但是有學到東

西的感覺真的很不錯，每一次撰寫程式就是令自己成長一次，看來我

要多加練習，以增進自己的能力！

最後，附上這次作業的完成圖～