今天的課程主題是期末目標分享。作法是同學互相仔細閱讀彼此的期末目標(im-hwshow), 然後用我們最新開發的互評系統, 選出大家公認最好的期末目標, 也給大家認為最需要加油的同學建議。
93360311 劉哲宇 圖片轉換類型
93360336 蔡函書 碰碰球
93363650 許峰賢 生活照大頭貼
94360034 李宛諭 塗鴉板
92360054 葉家甫 跳跳球
94360095 蔡佳儒 射擊小遊戲
94360105 闕士凱 21 點
94360184 邱怡瑄 桌布製作器
94360326 劉彥鋒 十八豆仔
94360424 潘怡妌 打小人遊戲
94360531 楊龍廉 吃角子老虎機
94360592 黃岱涵 造型精靈
94360725 陳佳玉 倉庫番
94360770 程奕少 拍貼機
94360786 何博欽 看圖程式
93360833 徐煥傑 大頭貼
94360841 陳韋任 大家來找碴
94360875 溫俊翔 迷宮闖關
94360982 蔡康俊 拼圖遊戲
94361046 鍾穆華 閃躲遊戲
94361064 賴柏翰 BLACK JACK
94361082 林豪鋒 視訊照相浮水印
94361091 王世昭 拉霸
94361180 蕭卉妤 資訊隱藏
94363011 王柏盛 水彩畫與水墨畫
94363125 黃國唐 打磚塊遊戲
94363170 蔣允慎 拍貼機
星期四, 12月 28, 2006
星期四, 12月 21, 2006
Week 14: 課程紀實 (2006/12/21): 期末目標發想
星期日, 12月 17, 2006
Reading: 用熱情做好細節 實現不可能
If the wonder insight, you can do anything.
他設計的電子恐龍，被《時代》雜誌評選為今年最佳發明！15歲輟學，曾靠街頭賣藝討生活……他有什麼過人的能耐，為什麼會這麼紅？
本篇文章摘自：商業周刊第 995 期
作者：曠文琪、彭媁琳
「如果你有發自內心的渴望，你可以做任何事情！」這是一個藝術家母親對她兒子的叮嚀。
她的兒子雖然沒念大學，十五歲就輟學，做過街頭藝人。但抓住母親的這句話，四十九歲的鍾少男（Caleb Chung，有華人血統），九年前設計出電子玩具菲比（Furby），在全球大賣五千萬個、締造十二億美元（約合新台幣三百八十九億元）營收。
今年，他設計的電子恐龍Pleo，更被《時代》（Time）雜誌票選為年度最佳發明，預估明年一上市就能創造逾兩億美元（約合新台幣六十五億元）的商機。
《時代》雜誌形容，Pleo是「有生命形態（Life form）的寵物」。只要主人回到家，Pleo會對主人搖頭擺尾，順著它的毛摸，它會高興得搖尾巴，會打噴嚏、打哈欠，搔它的背，它還會一百八十度回過頭來，看是誰在跟它玩。因為內建八個處理器，讓這隻電子寵物有靈敏的觸覺、視覺與聽覺。
繼續閱讀, 原文網址: http://www.businessweekly.com.tw/webarticle.php?id=23884
他設計的電子恐龍，被《時代》雜誌評選為今年最佳發明！15歲輟學，曾靠街頭賣藝討生活……他有什麼過人的能耐，為什麼會這麼紅？
本篇文章摘自：商業周刊第 995 期
作者：曠文琪、彭媁琳
「如果你有發自內心的渴望，你可以做任何事情！」這是一個藝術家母親對她兒子的叮嚀。
她的兒子雖然沒念大學，十五歲就輟學，做過街頭藝人。但抓住母親的這句話，四十九歲的鍾少男（Caleb Chung，有華人血統），九年前設計出電子玩具菲比（Furby），在全球大賣五千萬個、締造十二億美元（約合新台幣三百八十九億元）營收。
今年，他設計的電子恐龍Pleo，更被《時代》（Time）雜誌票選為年度最佳發明，預估明年一上市就能創造逾兩億美元（約合新台幣六十五億元）的商機。
《時代》雜誌形容，Pleo是「有生命形態（Life form）的寵物」。只要主人回到家，Pleo會對主人搖頭擺尾，順著它的毛摸，它會高興得搖尾巴，會打噴嚏、打哈欠，搔它的背，它還會一百八十度回過頭來，看是誰在跟它玩。因為內建八個處理器，讓這隻電子寵物有靈敏的觸覺、視覺與聽覺。
繼續閱讀, 原文網址: http://www.businessweekly.com.tw/webarticle.php?id=23884
星期五, 12月 15, 2006
Week 13: 課程紀實 (2006/12/14): 專研展創意發想
本週資訊學院正舉辦專研展, 因此我和黃老師決定讓同學利用上課時間讓同學去參觀資訊展, 然後再回來寫下自己的『創意發想』放到 im-hwshow 中。
本週黃老師用 電子恐龍 Pleo 的故事 鼓勵大家: 「如果你有發自內心的渴望，你可以做任何事情！」, 希望同學思考自己內心的渴望是什麼? 本課程未來的一個月, 將是以同學設定想做的目標為主軸, 面對目標, 遭遇困難, 解決問題...
本週黃老師用 電子恐龍 Pleo 的故事 鼓勵大家: 「如果你有發自內心的渴望，你可以做任何事情！」, 希望同學思考自己內心的渴望是什麼? 本課程未來的一個月, 將是以同學設定想做的目標為主軸, 面對目標, 遭遇困難, 解決問題...
星期四, 12月 07, 2006
Week 12: 課程紀實 (2006/12/07): Image Size & Resolution
為了讓課程內容更貼近我們的生活, 我和黃老師討論後定下今天的課程主題為如何用數位相機製作證件照片。課程主題分成兩大主軸:
一、撰寫 BCB 程式去除背景, 並討論 Photoshop 中的 Magic Wand 的程式寫法。
1. 色彩差異該怎麼計算? ( Tolerance )
2. 相連像素該怎麼定義? (Contiguous )
二、用影像處理軟體 Photoshop 講解影像大小(Image Size) 的各個基本屬性, 如:
1. Pixel Dimensions: Width, Height
2. Document Size: Width, Height,
並示範如何製作證件照片。
另外, 我們還示範了 Photoshop 圖層(layer) 的觀念, 並用複製圖層的方法, 將一張長 45mm*35mm 的圖片, 複製成 8 個圖層, 擺成一張 4 * 6 吋的照片。
用自己拍攝的照片, 辦好身分證換新了喔!!
一、撰寫 BCB 程式去除背景, 並討論 Photoshop 中的 Magic Wand 的程式寫法。
1. 色彩差異該怎麼計算? ( Tolerance )
2. 相連像素該怎麼定義? (Contiguous )
二、用影像處理軟體 Photoshop 講解影像大小(Image Size) 的各個基本屬性, 如:
1. Pixel Dimensions: Width, Height
2. Document Size: Width, Height,
並示範如何製作證件照片。
另外, 我們還示範了 Photoshop 圖層(layer) 的觀念, 並用複製圖層的方法, 將一張長 45mm*35mm 的圖片, 複製成 8 個圖層, 擺成一張 4 * 6 吋的照片。
用自己拍攝的照片, 辦好身分證換新了喔!!
星期四, 11月 30, 2006
Week 11: 課程紀實 (2006/11/30): 3D Watermarks
本週程式撰寫主題是: 使用者可以使用滑鼠任意點選浮水印要放置的位置。由於今天同學們在黑板上所提出的問題剛好是 10 個, 所以課程不用測驗的方式進行, 改採用引導的方式。同學的問題中, 有提到 3D 的浮水印製作, 因此, 黃老師請同學先用 Powerpoint 中的文字藝術師先製作一張屬於自己的 3D姓名, 放到我們作業的專屬部落格 im-hwshow 中, 然後就可以將這張 3D 浮水印用程式加入到圖片中。
第二堂課我們根據同學填寫的教學反應問卷回應的內容, 與某些同學做個別訪談。小溫認為我們的課程應該更生活化一點。因此, 我介紹了這星期天我在新竹煙波飯店所接觸到的創意小舖。創意小舖主要是將現場拍攝的個人數位相片經過去除背景處理, 再與美麗的風景照片合成, 最後製作成各種商品。基本上, 我認為受過我們多媒體課程訓練過的學生, 要寫這樣的程式是沒有問題的, 同學應該可以清楚知道自己擁有哪些能力, 接下來, 同學應該努力在這些能力上發揮自己的創意, 將來才有可能靠此能力在社會上存活下來!
煙波小舖現場拍攝相片的背景為單純的綠色, 這樣的設計可以方便去除背景!!
當場製作出來的馬克杯, 一個要價NT. 250, 比起一般的馬克杯高出了數倍。
第三堂課, 我們一一解答同學寫在黑板上的各個問題, 除了再次講解 ScrollBar 這個元件之外, 也介紹了 ProgressBar 這個元件與其使用方式。比較值得一提的是 卉妤 提出了一個將浮水印在藏在影像色彩值的最低位元(LSB)之中的神奇問題, 我和黃老師都很好奇卉妤竟然知道這樣的作法, 真的很不簡單呢! 對於資訊隱藏有興趣的同學, 可以前往我的 研究興趣 網頁看看!!
本週同學除了必須完成程式作業外, 我們還讓同學領取了 數位內容月刊 9 月號, 同學必須選讀其中一篇文章, 並在自己的網誌中寫下心得與大家分享。
第二堂課我們根據同學填寫的教學反應問卷回應的內容, 與某些同學做個別訪談。小溫認為我們的課程應該更生活化一點。因此, 我介紹了這星期天我在新竹煙波飯店所接觸到的創意小舖。創意小舖主要是將現場拍攝的個人數位相片經過去除背景處理, 再與美麗的風景照片合成, 最後製作成各種商品。基本上, 我認為受過我們多媒體課程訓練過的學生, 要寫這樣的程式是沒有問題的, 同學應該可以清楚知道自己擁有哪些能力, 接下來, 同學應該努力在這些能力上發揮自己的創意, 將來才有可能靠此能力在社會上存活下來!
煙波小舖現場拍攝相片的背景為單純的綠色, 這樣的設計可以方便去除背景!!
當場製作出來的馬克杯, 一個要價NT. 250, 比起一般的馬克杯高出了數倍。
第三堂課, 我們一一解答同學寫在黑板上的各個問題, 除了再次講解 ScrollBar 這個元件之外, 也介紹了 ProgressBar 這個元件與其使用方式。比較值得一提的是 卉妤 提出了一個將浮水印在藏在影像色彩值的最低位元(LSB)之中的神奇問題, 我和黃老師都很好奇卉妤竟然知道這樣的作法, 真的很不簡單呢! 對於資訊隱藏有興趣的同學, 可以前往我的 研究興趣 網頁看看!!
本週同學除了必須完成程式作業外, 我們還讓同學領取了 數位內容月刊 9 月號, 同學必須選讀其中一篇文章, 並在自己的網誌中寫下心得與大家分享。
星期四, 11月 16, 2006
Week 9: 課程紀實 (2006/11/16): Programming Test
實測的題目是一組與可視浮水印 (visible watermarking) 相關, 由淺到深的連鎖題, 前面兩題同學的表現普遍都很不錯, 第二題第一位做完的同學是柏盛, 這個我們一點也不意外, 不過, 第二位做完第二題的同學是 怡妌, 這點就大大超乎我和黃老師的預期! 因此, 下課前我們給了怡妌一點小小的鼓勵, 希望班上其他同學能夠快快跟上進度!!
星期四, 11月 09, 2006
Week 8: 課程紀實 (2006/11/09): Color Histogram
今天的第一堂課, 黃老師首先介紹我們的下一個程式實作的目標: Visible Watermarking, 並用 實例 讓同學了解什麼是 Visible Watermarking。
接著, 黃老師請同學開始練習將一張彩色影像的 R, G, B 顏色分別萃取出來, 有不少同學, 如 彥鋒, 兩三下就把程式寫出來了, 表現很不錯。
第二堂課, 我開始講解什麼是 Color Histogram。為了讓同學了解 Color Histogram 對一張影像的意義為何, 我從影響數位相機的光圈, 快門, ISO, 曝光值 開始講解, 然後問同學一張曝光過度的相片, Histogram 可能的分布為何?
第三堂課, 我們談到了什麼是 Dynamic Range, 也介紹了一篇國科會簡訊網的相關文章: 高動態範圍影像(High Dynamic Rang Imaging): 數位攝影跟數位錄影的新生代。
下星期, 我們希望同學可以帶數位相機到課堂上來, 然後當場拍一些照片, 實際去分析影像的Histogram, 這樣同學會更有感受。另外, 今天課堂上講解到的數位相機基本概念, 請參考 "數位相片編修聖經" (施威銘主編, 旗標出版), 第五章: 曝光調整！同學們, 請在下星期上課前, 研讀一些有關數位相機的相關文章, 在課堂上分享心得。（列為學期成績重大參考依據, 請大家告訴大家！）
課程實作目標: Visible Watermarking
我在另一部落格 Lee's Stego Research Notes 的 Google AdSense 廣告, 無意間看到了這個專門做 Visible Watermarking 的軟體, 就想到其實這個軟體的基本原理非常簡單, 和之前在 影像處理課程 的 Homework 3 是一樣的, 因此就決定將這門課的色彩處理部分的程式實作目標設定成寫一個具有簡單的 Visible Watermarking 功能的程式。
要完成這樣的目標, 當然會有一些色彩處理的基本能力需要養成, 我們課程會在未來幾週將一些基本觀念讓同學了解, 希望同學可以盡早達到所設定的目標。
Software for adding visible watermarks to digital photos
星期五, 11月 03, 2006
Week 7: 課程紀實 (2006/11/02): 8-Puzzle Using Top & Left
本週的課程主題同樣是 8-puzzle 程式實作, 接續上週的討論, 繼續完成遊戲。由於同學們的進度快慢不一, 因此我們今天的策略是讓進度快的同學上台分享他對整個程式設計的構想與如何完成實作。
課程一開始是由 博欽 開始分享, 然後是 柏盛。 為了達到移動分割後小圖片的目的, 博欽用上星期所教的 TCanvas::CopyRect method; 柏盛則是用 TPicture::TBitMap::Assign method 的方式。
至於如何判斷空白的位置, 博欽使用了一個變數來儲存, 柏盛則是用來一個陣列 ImageFlag[3][3] 的方式來記錄。
最後, 黃老師比較了各種不同的方式, 點出差異點在哪, 而不是直接評論哪個方法較好... 希望同學都能夠用自己的方式思考、實作、找出問題、解決問題、然後分享。
在第三堂課, 我則是示範了我的方式, 直接將影像物件的位置移動, 而不去改變影像內容。換句話說, 就是直接改變 Top 與 Left 兩個屬性值。每一張小影像我分別用 im00, im01, im02, im20, ... im22 來表示。im22 設定為空的影像, 把其 Visible 屬性設定為 true, 然後將 im22->Top 與 im22->Left 分別用 iEmptyTop 與 iEmptyLeft 紀錄之。
當每一張小影像被滑鼠 Click 時, 則啟動 OnClick 事件處理程序: 判斷空格是否在旁邊, 如果在旁邊, 則該影像的位置與 iEmptyTop 與 iEmptyLeft 值交換。如果不在旁邊則不做任何處理。
假設我們用 iDeltaTop 與 iDeltaLeft 來記錄某個影像與空影像的差距。所以,
iDeltaTop = abs(im00->Top - iEmptyTop);
iDeltaLeft = abs(im00->Top - iEmptyLeft);
有了這個差值, 我們就很容易用下列式子來判斷 im00 這張影像是否在空格的旁邊,
if ((iDeltaTop==0)&&(iDeltaLeft==100) || (iDeltaTop==100)&&(iDeltaLeft==0))
每一張小影像的大小為 99*99, 加上白色分隔線, 所以相鄰小影像的距離為100, 相鄰的兩張小影像, 至少必須再同一排, 或是同一列, 所以必須有一個差值為 0。
至於兩個數值要互換, 只要用一個 iTemp 即可。同學應該是沒問題的！
課程一開始是由 博欽 開始分享, 然後是 柏盛。 為了達到移動分割後小圖片的目的, 博欽用上星期所教的 TCanvas::CopyRect method; 柏盛則是用 TPicture::TBitMap::Assign method 的方式。
至於如何判斷空白的位置, 博欽使用了一個變數來儲存, 柏盛則是用來一個陣列 ImageFlag[3][3] 的方式來記錄。
最後, 黃老師比較了各種不同的方式, 點出差異點在哪, 而不是直接評論哪個方法較好... 希望同學都能夠用自己的方式思考、實作、找出問題、解決問題、然後分享。
在第三堂課, 我則是示範了我的方式, 直接將影像物件的位置移動, 而不去改變影像內容。換句話說, 就是直接改變 Top 與 Left 兩個屬性值。每一張小影像我分別用 im00, im01, im02, im20, ... im22 來表示。im22 設定為空的影像, 把其 Visible 屬性設定為 true, 然後將 im22->Top 與 im22->Left 分別用 iEmptyTop 與 iEmptyLeft 紀錄之。
當每一張小影像被滑鼠 Click 時, 則啟動 OnClick 事件處理程序: 判斷空格是否在旁邊, 如果在旁邊, 則該影像的位置與 iEmptyTop 與 iEmptyLeft 值交換。如果不在旁邊則不做任何處理。
假設我們用 iDeltaTop 與 iDeltaLeft 來記錄某個影像與空影像的差距。所以,
iDeltaTop = abs(im00->Top - iEmptyTop);
iDeltaLeft = abs(im00->Top - iEmptyLeft);
有了這個差值, 我們就很容易用下列式子來判斷 im00 這張影像是否在空格的旁邊,
if ((iDeltaTop==0)&&(iDeltaLeft==100) || (iDeltaTop==100)&&(iDeltaLeft==0))
每一張小影像的大小為 99*99, 加上白色分隔線, 所以相鄰小影像的距離為100, 相鄰的兩張小影像, 至少必須再同一排, 或是同一列, 所以必須有一個差值為 0。
至於兩個數值要互換, 只要用一個 iTemp 即可。同學應該是沒問題的！
星期四, 10月 26, 2006
Week 6: 課程紀實 (2006/10/26): TCanvas::CopyRect
今天的課程是延續上週 8-puzzle 控制介面實作 的題目, 同學回家思考後, 在課堂上白板寫下的問題集中在程式開發的前半段。
因此, 今天的課程重點在於:
1. 如何將影像內容複製到另外其他影像之中。
2. 如何讓一個影像物件移動。
我在課堂上當場寫了以下這個示範程式, 左圖是一張 300*300 大小的 bmp 影像, 當我們用滑鼠在影像上啟動 MouseDown 的事件時, 我們利用 OnMouseDown 事件處理程序中的 ( X, Y ) 座標定義出一個 TRect 物件 - Rect(X, Y, X+100, Y+100), 然後在使用 TCanvas::CopyRect 這個 method 從大張影像中複製 Rect(X, Y, X+100, Y+100) 這個範圍到小張影像的 Canvas 中。
程式包含宣告的部份, 僅僅只有短短的四行, 如下:
TRect TileRect, OIRect; //宣告兩個 rectangle 物件
TileRect = Rect(0,0,100,100);
//必須貼滿小張影像, 所以範圍從 (0, 0) 到 (100, 100)
OIRect = Rect(X,Y,X+100,Y+100);
//大張影像滑鼠點擊在 (X, Y) 上
Image2->Canvas->CopyRect(TileRect, Image1->Canvas, OIRect);
// 利用 TCanvas::CopyRect method 來處理複製的動作
為了讓同學明白什麼是 method? 我們決定用另外一種直接對 TCanvas::Pixel property 直接做處理, 希望同學可以體會出其實 method 就是針對該物件常會用到的程式, 用 method 這個名詞包裝起來而以。
for (i=0;i<100;i++)
for (j=0;j<100;j++)
Image2->Canvas->Pixels[i][j]=Image1->Canvas->Pixels[i+X][j+Y];
上面這段程式, 是一樣可以做到同樣的複製效果的!!
至於如何讓影像物件移動, 其實只要去改變影像的 Top 與 Left 兩個屬性值即可。
Image2->Top = Image2->Top + 100;
//影像往下移動 100 點
Image2->Left = Image2->Left + 100;
//影像往右移動 100 點
本週程式的實作過程, 我們發現同學們對於影像的開啟後, 顯示於螢幕的大小與影像本身的大小之間的關係是模糊的, 因此, 本週我們希望同學回去研究影像元件的 AutoSize 與 Stretch 兩個屬性的關係。同學可以嘗試在 form 上放置四個大小為 200*200 的影像元件, 設定成不同組合的 AutoSize 與 Stretch。程式執行時, 開啟一張100*100 大小的影像, 比較看看有什麼不同的執行結果。另外, 再針對一張 300*300 的影像實驗, 分析兩次實驗結果有什麼不同 ?
因此, 今天的課程重點在於:
1. 如何將影像內容複製到另外其他影像之中。
2. 如何讓一個影像物件移動。
我在課堂上當場寫了以下這個示範程式, 左圖是一張 300*300 大小的 bmp 影像, 當我們用滑鼠在影像上啟動 MouseDown 的事件時, 我們利用 OnMouseDown 事件處理程序中的 ( X, Y ) 座標定義出一個 TRect 物件 - Rect(X, Y, X+100, Y+100), 然後在使用 TCanvas::CopyRect 這個 method 從大張影像中複製 Rect(X, Y, X+100, Y+100) 這個範圍到小張影像的 Canvas 中。
程式包含宣告的部份, 僅僅只有短短的四行, 如下:
TRect TileRect, OIRect; //宣告兩個 rectangle 物件
TileRect = Rect(0,0,100,100);
//必須貼滿小張影像, 所以範圍從 (0, 0) 到 (100, 100)
OIRect = Rect(X,Y,X+100,Y+100);
//大張影像滑鼠點擊在 (X, Y) 上
Image2->Canvas->CopyRect(TileRect, Image1->Canvas, OIRect);
// 利用 TCanvas::CopyRect method 來處理複製的動作
為了讓同學明白什麼是 method? 我們決定用另外一種直接對 TCanvas::Pixel property 直接做處理, 希望同學可以體會出其實 method 就是針對該物件常會用到的程式, 用 method 這個名詞包裝起來而以。
for (i=0;i<100;i++)
for (j=0;j<100;j++)
Image2->Canvas->Pixels[i][j]=Image1->Canvas->Pixels[i+X][j+Y];
上面這段程式, 是一樣可以做到同樣的複製效果的!!
至於如何讓影像物件移動, 其實只要去改變影像的 Top 與 Left 兩個屬性值即可。
Image2->Top = Image2->Top + 100;
//影像往下移動 100 點
Image2->Left = Image2->Left + 100;
//影像往右移動 100 點
本週程式的實作過程, 我們發現同學們對於影像的開啟後, 顯示於螢幕的大小與影像本身的大小之間的關係是模糊的, 因此, 本週我們希望同學回去研究影像元件的 AutoSize 與 Stretch 兩個屬性的關係。同學可以嘗試在 form 上放置四個大小為 200*200 的影像元件, 設定成不同組合的 AutoSize 與 Stretch。程式執行時, 開啟一張100*100 大小的影像, 比較看看有什麼不同的執行結果。另外, 再針對一張 300*300 的影像實驗, 分析兩次實驗結果有什麼不同 ?
星期四, 10月 19, 2006
Week 5: 課程紀實 (2006/10/19): Study Sharing
一早在往學校的車上, 和黃老師討論著今天課程的主題, 我們發現雖然大部分同學寫出了部分塗鴉板的功能, 不過程式細部的觀念仍然有待釐清, 我們考量到這門課是未來多媒體學程相關課程的基礎, 因此, 我們當下決定今天課程除了 思考 8-puzzle 的作法 之外, 程式練習的部份, 不要有新的進度, 讓同學停下腳步, 好好回顧一下自己寫的每一行程式, 是不是都能完全掌握, 也趁著這個機會, 讓同學彼此分享程式開發的甘苦與學習所得。
首先, 黃老師請同學先互相討論 8-puzzle 程式的演算法, 然後請 小溫 上台分享牠的想法 ( 左圖 )。接著, 在圖片分割的部份, 家甫 指出可以使用 TCanvas::CopyRect method 從一張圖片複製到另外一張圖片。
在塗鴉板的程式開發上, 哲宇的程式 寫的很不錯, 我們也請他上台分享程式開發的歷程與心得, 我們也藉由哲宇的程式來請同學思考哪些指令應該放在哪一個事件處理程序中才合理。接著, 由 博欽 分享如何讓塗鴉時, 螢幕不致發生閃爍的情況, 關鍵就在 TWinControl::DoubleBuffered 這個屬性必須設定為 true。
除此, 同學也比較了用 TCanvas::Pixels 這個屬性 (property) 來劃一個點的方法, 與用 Tcanvas::LineTo 這個 method 來劃一條線兩者之間在塗鴉板程式之間的差異性。這邊還有一個題目可以請同學去思考, 就是 BCB 的 method 到底是什麼? 用 method 來處理與直接對 property 處理有什麼差別 ?
今天的課程, 我和黃老師都感受到雖然表面上許多同學都可以寫出塗鴉功能來, 其實程式的細節還是有許多空間可以去仔細思考與討論的!!
首先, 黃老師請同學先互相討論 8-puzzle 程式的演算法, 然後請 小溫 上台分享牠的想法 ( 左圖 )。接著, 在圖片分割的部份, 家甫 指出可以使用 TCanvas::CopyRect method 從一張圖片複製到另外一張圖片。
在塗鴉板的程式開發上, 哲宇的程式 寫的很不錯, 我們也請他上台分享程式開發的歷程與心得, 我們也藉由哲宇的程式來請同學思考哪些指令應該放在哪一個事件處理程序中才合理。接著, 由 博欽 分享如何讓塗鴉時, 螢幕不致發生閃爍的情況, 關鍵就在 TWinControl::DoubleBuffered 這個屬性必須設定為 true。
除此, 同學也比較了用 TCanvas::Pixels 這個屬性 (property) 來劃一個點的方法, 與用 Tcanvas::LineTo 這個 method 來劃一條線兩者之間在塗鴉板程式之間的差異性。這邊還有一個題目可以請同學去思考, 就是 BCB 的 method 到底是什麼? 用 method 來處理與直接對 property 處理有什麼差別 ?
今天的課程, 我和黃老師都感受到雖然表面上許多同學都可以寫出塗鴉功能來, 其實程式的細節還是有許多空間可以去仔細思考與討論的!!
星期一, 10月 16, 2006
Week 5: 課程實作預告: 8-puzzle 的遊戲介面實作
數位媒體概論 Week 5 的程式課程實作題目為: 8-Puzzle 的遊戲介面實作。同學可以參考 iafrica.com 網站中的 slider puzzle game 當作範例。已經完成上週程式的同學, 可以預先思考本週的題目, 把遭遇的問題先準備好, 一進教室就可以先寫在白板上。8-Puzzle 是資訊相關科系的資料結構討論到 Search 主題, 或是在人工智慧課程討論到 Heuristic Search 主題, 必定會使用的範例。同學們在我們的課程中, 利用滑鼠觸發事件處理程式, 就可以把控制介面完成。將來, 有興趣還可以替你的程式加入 "人工智慧", 讓你的程式可以自己完成 puzzle ! 對一個資工大二的學生, 應該很酷, 也很了不起的 ! 同學, 衝吧! 加油!
星期四, 10月 12, 2006
Week 4: 課程紀實 (2006/10/12): TCanvas & TColor
今天的數位媒體課程一開始, 黃老師同樣延續上星期的題目, 出了一題程式給同學思考: 如何在影像上塗鴉。
第二堂課, 我開始講解要完成這個題目, 需要具備什麼基本概念, 引導同學去探究 TImage::Canvas 這個 property 有什麼好玩的地方。我們從音樂創作與繪圖創作本質的異同開始談起, 希望同學了解一張影像 ( image ) 或者一張畫布 ( canvas ) 的最基本組成元素就是一個像素或畫素 ( pixel )。在一張乾乾淨淨的畫布上, 塗上各式各樣的顏色, 就變成一張影像了。
接著, 我們說明如何透過 TCanvas::Pixels 這個 property 來讀取或寫入像素的色彩值。BCB 提供了 TColor type 這個列舉資料型態 ( enum ), 而所有常用的色彩值, BCB 也都事先定義了相對應的以cl 為開頭的常數 ( const ) 提供程式設計師方便使用, 例如: clBlack = 0x00000000; clRed = 0x000000FF; clGreen = 0x0000FF00; clBlue = 0x00FF0000。除此, BCB 還提供了一個方便的 RGB macro, 讓使用者可以將我們熟悉的 R, G, B 色彩值轉換成所對映的數字。
本週同學的回家作業是: 弄清楚什麼是 AnsiString...
星期六, 10月 07, 2006
News: 傳 Google 欲以 16 億美元併購 YouTube
(法新社舊金山六日電)
http://news.yam.com/afp/computer/200610/20061007414923.html
華爾街日報今天報導，有消息來源傳出，搜尋引擎巨擘 Google 計畫以十六億美元，併購全球知名線上影音網站 YouTube。但是，Google 與 YouTube 兩家公司皆不願對此傳言發表評論。
YouTube 於二零零五年由華裔陳士駿及賀利共同在矽谷創立，目前員工僅有二十多人。因為其上載影音內容的豐富性與知名度，已佔有百分之四十三以上的線上影音分享內容 市場，平均每天有超過一億個錄影內容被瀏覽、每個月約有兩千萬瀏覽人次。其中也包括許多使用者上載的中文影音內容。
於此同時，根據研究統計機構資料，類似 YouTube 影音內容分享的 Google 影音頻道，今年八月份約有一千三百萬瀏覽人次，而在同一月份，YouTube 則有超過三千四百萬瀏覽人次。
業界對 Google 併購 YouTube 的傳言議論紛紛。去年，新聞集團才以五億八千萬美元總額併購社交網絡網站 MySpace，造成業界轟動。不過， YouTube 執行長賀利先前曾在演講場合中表示，公司不以被併購為目標，並在未來有公開上市的可能性。然而，紐約郵報曾於上月報導，有資料來源顯示， YouTube 不會以少於十五億美元的價格被併購。
有分析人士認為，YouTube 在全球的知名度，並不亞於 Google，想要併購 YouTube 的買家，其實也不只 Google 一家公司，其他的大型網路搜尋引擎或消費科技公司都有可能購買意願。不過，不僅併購價錢是因素之一，有關 YouTube 的著作權爭論、如何增加廣告收入等，都將是考量因素。
由於使用者上載內容，YouTube 一直有著作權方面處理的問題。不久前，YouTube 才與 NBC 及華納音樂簽訂合約，同意合作授權，以協助降低在這方面的爭論，也帶來相當收入，並開拓更清晰的商業模式。
http://news.yam.com/afp/computer/200610/20061007414923.html
華爾街日報今天報導，有消息來源傳出，搜尋引擎巨擘 Google 計畫以十六億美元，併購全球知名線上影音網站 YouTube。但是，Google 與 YouTube 兩家公司皆不願對此傳言發表評論。
YouTube 於二零零五年由華裔陳士駿及賀利共同在矽谷創立，目前員工僅有二十多人。因為其上載影音內容的豐富性與知名度，已佔有百分之四十三以上的線上影音分享內容 市場，平均每天有超過一億個錄影內容被瀏覽、每個月約有兩千萬瀏覽人次。其中也包括許多使用者上載的中文影音內容。
於此同時，根據研究統計機構資料，類似 YouTube 影音內容分享的 Google 影音頻道，今年八月份約有一千三百萬瀏覽人次，而在同一月份，YouTube 則有超過三千四百萬瀏覽人次。
業界對 Google 併購 YouTube 的傳言議論紛紛。去年，新聞集團才以五億八千萬美元總額併購社交網絡網站 MySpace，造成業界轟動。不過， YouTube 執行長賀利先前曾在演講場合中表示，公司不以被併購為目標，並在未來有公開上市的可能性。然而，紐約郵報曾於上月報導，有資料來源顯示， YouTube 不會以少於十五億美元的價格被併購。
有分析人士認為，YouTube 在全球的知名度，並不亞於 Google，想要併購 YouTube 的買家，其實也不只 Google 一家公司，其他的大型網路搜尋引擎或消費科技公司都有可能購買意願。不過，不僅併購價錢是因素之一，有關 YouTube 的著作權爭論、如何增加廣告收入等，都將是考量因素。
由於使用者上載內容，YouTube 一直有著作權方面處理的問題。不久前，YouTube 才與 NBC 及華納音樂簽訂合約，同意合作授權，以協助降低在這方面的爭論，也帶來相當收入，並開拓更清晰的商業模式。
星期四, 10月 05, 2006
Week 3: 課程紀實 (2006/10/05)
今天的數位媒體概論的第一堂課, 黃老師請同學思考的問題是: 利用滑鼠指到影像中的特定像素, 並將此像素的位置與色彩值顯示出來? 同學們遭遇問題時, 同樣可以寫到白板上分享, 討論。今天同學寫的問題如下:
1. Book 6-3 Form1 視窗怎麼跑出來的? OK
2. 顯示 x, y 軸的程式是要寫在 Form 裡, 還是 Image 裡? (因為滑鼠要點兩下) OK
3. 試著打了範例程式 6-4 那個顯示位置的函數, 不知道如何讓它成為 TForm1 的一員。 OK
4. 怎麼把 Label 跟 Edit 跟 Text 結合 ? OK
5. 程式一樣打上去卻無法執行! OK
6. 如何讓要放到 Image 裡的圖片符合影像框框的大小? OK
7. 要如何將 Labeled Edit 上方的 LabeledEdit1 去除? OK
8. 存檔時該存 Form 還是元件呢? 該如何重新開啟呢 ?
9. 程式碼是要另外寫, 不能塞進去嗎? 不能改函數名稱嗎? OK
第三堂課, 我們開始討論 podcasting , 博欽 與 卉妤 都上台與大家分享! 之後, 我們從早期用收音機的收聽廣播, 到後來也可以用網路收聽廣播, 到最近的podcasting 訂閱的方式收聽, 討論各個時期的限制與技術演進, 讓同學了解其實這些演進都是由於使用者的需求, 配合科技的進步所共同促成的。
本週我們請同學回去查的題目是: BCB 的專案儲存後, 會產生哪些不同的檔案, 分別扮演什麼功能!
星期四, 9月 28, 2006
Week 2: 課程紀實 (2006/09/28)
今天的第一堂課, 黃老師請同學將目前自己對於 BCB 所遭遇到的問題, 寫在白板上, 同學們的問題各式各樣 :
1. 如何把圖片放進 Image 的框框裡 ? OK
2. 要怎麼編寫按鈕的程式 ? OK
3. 要怎麼把程式碼叫出來 ? (*2) OK
4. 如何把程式碼插入各個物件 ? (*3) OK
5. 什麼都不懂, 今天第一次來 ! (*2) OK
6. Button 和開啟圖檔這兩樣如何使用 ? OK
7. 如何寫開啟影像的程式碼 ? OK
8. 變數宣告要宣告在哪 ? OK
9. BCB 不會用 ! (*2) OK
10. BCB 軟體如何引用 DLL 函式庫 ?
11. 找到無程式碼的視窗, 也找到了程式碼, 看不懂程式碼 ! (*2) OK
12. 不會開檔 ! OK
13. 程式碼該放在哪裡 ? OK
14. 為什麼有些電腦會自動跑出 Help ?
接下來的兩門課, 我們說明了一些有關 BCB 的基本觀念, 如 RAD, IDE, VCL 等等, 然後示範了如何將影像放到 Image 元件之中。
數位媒體概論這門課有兩個主要的目標:
1. 讓同學了解數位媒體的發展趨勢。
2. 同學有能力用 BCB 撰寫程式, 簡單處理數位媒體資料。
因此, 我們請同學回去查什麼是 podcast ? 下次上課我們要在課堂上請同學分享自己所了解的 podcast 是什麼！
星期五, 9月 22, 2006
Week 1: 課程紀實 (2006/09/21)
數位媒體概論的第一門課, 黃老師首先請同學思考類似檔案總管讓使用者可以用滑鼠選擇一個檔案來開啟的功能, 以大一修過兩學期程式設計程度的角度切入, 這樣的程式該如何撰寫? 經過同學之間的討論, 思考之後, 有些同學上台分享自己的構想。
接著, 我讓同學看了兩段影片, 第一段是 SONY PS2 EyeToy 的 廣告影片, 第二段是 Kick Ass Kung-Fu 的 系統展示影片, 再讓同學去思考這樣的系統, 該如何開發, 撰寫程式。
讓同學思考這些問題的主要目的是希望同學了解不同層次的應用, 應該使用不同的開發工具, 以節省系統的開發時程。我與黃老師在系上多媒體課程的規劃了三門連續的課程, 分別是:
( 二上 ) 數位媒體概論,
( 二下 ) 多媒體處理專題
( 三上 ) 多媒體遊戲製作
甚至將來的規劃還打算加入介紹 Virtools 遊戲開發軟體 的課程, 讓同學循序接受一系列的多媒體與遊戲訓練課程。
最後, 我示範了如何用 Borland C++ Builder 程式開發工具 (或稱 整合發展環境, Integrated Development environment, IDE ), 簡單地用一個 OpenDialog 物件, 加上一個 Execute() 的函式 (或稱 method ), 就寫好想要的功能。希望同學了解, 要發展一套複雜的系統, 用最傳統的程式撰寫方式是行不通的, 必須善用工具。而 Borland 就是一家研發 IDE 的軟體公司, 將原先瑣碎的工作包裹起來, 發展成好用的工具, 以節省各類高階系統的開發時程。
最後, 我們說明了這學期課程的進行方式, 學生必須每週繳交一份學習報告, 並於課程中進行分享, 期末必須參與一項競賽。目前期末競賽的規劃方向是: 視訊搜尋競賽。
接著, 我讓同學看了兩段影片, 第一段是 SONY PS2 EyeToy 的 廣告影片, 第二段是 Kick Ass Kung-Fu 的 系統展示影片, 再讓同學去思考這樣的系統, 該如何開發, 撰寫程式。
讓同學思考這些問題的主要目的是希望同學了解不同層次的應用, 應該使用不同的開發工具, 以節省系統的開發時程。我與黃老師在系上多媒體課程的規劃了三門連續的課程, 分別是:
( 二上 ) 數位媒體概論,
( 二下 ) 多媒體處理專題
( 三上 ) 多媒體遊戲製作
甚至將來的規劃還打算加入介紹 Virtools 遊戲開發軟體 的課程, 讓同學循序接受一系列的多媒體與遊戲訓練課程。
最後, 我示範了如何用 Borland C++ Builder 程式開發工具 (或稱 整合發展環境, Integrated Development environment, IDE ), 簡單地用一個 OpenDialog 物件, 加上一個 Execute() 的函式 (或稱 method ), 就寫好想要的功能。希望同學了解, 要發展一套複雜的系統, 用最傳統的程式撰寫方式是行不通的, 必須善用工具。而 Borland 就是一家研發 IDE 的軟體公司, 將原先瑣碎的工作包裹起來, 發展成好用的工具, 以節省各類高階系統的開發時程。
最後, 我們說明了這學期課程的進行方式, 學生必須每週繳交一份學習報告, 並於課程中進行分享, 期末必須參與一項競賽。目前期末競賽的規劃方向是: 視訊搜尋競賽。
星期四, 9月 21, 2006
數位媒體修課同學的部落格
91240413 承翰 ( X ) 
92360054 家甫 darkgoblin ( X )
92360125 金澄 yingo1615
93360311 哲宇 sidra75
93360336 函書 s3360336
93360833 煥傑 Ben1130
93363623 文烜 lys
93363650 峰賢 hsien0616
94360034 宛諭 collenfin
94360095 佳儒 ( 高手 ) greymap
94360105 士凱 kaymaner
94360184 怡瑄 ( 小冬 ) bleach
94360291 振瑋 musicwei
94360326 彥鋒 ( 蜜蜂 ) q0smallbee0p
94360424 怡妌 paniyching
94360531 龍廉 Convenient
94360592 岱涵 moonalexia
94360725 佳玉 inkhut
94360770 奕少 pachingo1985 ( X )
94360786 博欽 rememberance
94360841 韋任 j81409
94360875 俊翔 ( 小溫 ) oshing
94360982 康俊 jknm0510a
94361046 穆華 sounken
94361064 柏翰 ctbtaat
94361082 豪鋒 ginobili824
94361091 世昭 ( 4 招 ) ppp000111
94361180 卉妤 cockroach19
94363011 柏盛 dinotrex614
94363125 國唐 a0960eric
94363170 允慎 happy131420
92360054 家甫 darkgoblin ( X )
92360125 金澄 yingo1615
93360311 哲宇 sidra75
93360336 函書 s3360336
93360833 煥傑 Ben1130
93363623 文烜 lys
93363650 峰賢 hsien0616
94360034 宛諭 collenfin
94360095 佳儒 ( 高手 ) greymap
94360105 士凱 kaymaner
94360184 怡瑄 ( 小冬 ) bleach
94360291 振瑋 musicwei
94360326 彥鋒 ( 蜜蜂 ) q0smallbee0p
94360424 怡妌 paniyching
94360531 龍廉 Convenient
94360592 岱涵 moonalexia
94360725 佳玉 inkhut
94360770 奕少 pachingo1985 ( X )
94360786 博欽 rememberance
94360841 韋任 j81409
94360875 俊翔 ( 小溫 ) oshing
94360982 康俊 jknm0510a
94361046 穆華 sounken
94361064 柏翰 ctbtaat
94361082 豪鋒 ginobili824
94361091 世昭 ( 4 招 ) ppp000111
94361180 卉妤 cockroach19
94363011 柏盛 dinotrex614
94363125 國唐 a0960eric
94363170 允慎 happy131420
訂閱：
文章 (Atom)