2017年6月30日 星期五

03360173 李冠賢 小畫家

小畫家

介紹:

視訊互動小畫家,透過攝影機擷取影像,使用膚色偵測及手勢偵測,只要判斷到手指有伸出來,就開始在指尖畫圖,閉合手掌停止畫圖。
上方是功能區,從左到右依序是清空畫布,黑色、紅色、綠色、藍色畫筆。



功能:

膚色偵測
偵測手掌開合
可選取不同顏色的畫筆

困難:

攝影機幀數 ( Frame per Second,FPS ) 太低,即使把它設定成每張顯示 1 毫秒,最高的幀數每秒也只有 15 張,造成當手指移動太快時,畫出來的線會不連續。

理想:

只抓到手掌,背景與手肘不會影響判斷
自動找到最佳的膚色偵測值
自動改變偵測範圍,即使手掌前後移動也不影響偵測


(影片連結 : https://youtu.be/CeYYeE8uNY8)

03360812_期末專案

互動控制介面

動機:
         現在很多人都以線上遊戲作為紓壓的工具,但是長期坐在電腦面前,對自己的身體健康不太好,長期不運動和姿勢不佳的情況下,會讓身體產生病變,而我想到了假如不用鍵盤而是用攝影機就可以操作遊戲,那可藉由攝影機偵測我們的動作,來進行遊戲,就可以邊進行遊戲並讓身體活動,因而達到我的目的。

控制畫面:

如圖所示,碰觸到技能1(A鍵)就等同於鍵盤按下A鍵,技能2(Q鍵)和上下左右亦是如此


心得:
         最後終於有做出簡易的操作介面,但覺得畫面有點小且動作不順暢,可能是我物件調整過大和位置放置不適當,覺得偵測的畫面和物件的大小及位置需要調整適當,對於使用者才比較舒適。

遇到的困難:
         1.偵測到人體觸摸到物件的範圍沒有很準確
         2.觸摸到的按鈕為連續動作,僅有觸碰下個鍵才能停止之前動作(觸碰後停不下來)
         3.如果攝影機重新對焦後會有誤偵測的情況產生

影片:
   
       

03360404 許淳翔, 期末報告,遊戲名稱:閃方塊

一.遊戲介紹 :

遊戲名稱 : 閃方塊

簡單來說:就是一個會從畫面的一端跑出方塊,而你要去閃避他,閃避的越多分數就會越多。



二.製作步驟:
1.方塊的製作 : a.先是依照設定亂數決定要現的次數
                          b.亂數決定方塊出現的位置
                          c.亂數決定方塊顏色
                          d.方塊移動
難點:方塊的陣列與畫面的陣列,決定方塊出現密度的公式

2.偵測 : 與其他偵測方式不同的是我只偵測最左邊的點為x座標,假如有很多點在最左邊時y座標會訂為高的平均值。

原因是因為這遊戲是以閃躲為目的,並不是偵測範圍越大就越好。
而且有明確的點比較好閃躲。因為最高難度的方塊只有10*10大小,所以玩家的點只有6*6


3.判斷是否要碰到
因為已經有了方塊跟偵測得點座標所以這部分就只需要查表就行。
血量的顯示由4張不同狀態的愛心圖表示
4張圖是重疊在一起由Visible屬性決定哪張圖片顯示
這部分是所有步驟中最簡單的。
血量:




每人有3次機會。用完就結束

4.結束

分數的顯示是最麻煩的,是以0~9的小圖片貼上結束畫面的陣列。
要新增一個包含0~9小圖的所有點的RGB值的4維陣列。
與一個包含0~9小圖的所有點的YUV的得4維陣列。
重點是要再對的位置
使用對的編號的小圖
並對應到小圖中對的點
再把結束畫面內的直替換掉,最後再輸出。
如果我有下次,我因該不會這樣做。

三.新增功能
1.速度

雖然我的方塊速度會越來越快,但一開始還是會覺得有點慢,所以新增一個可以設定一個初駛速度的功能。

2.遊戲時間


新增了可以讓玩家決定遊戲時間的功能,因為當難度調很低時
EX.大方塊低密度低速度
這樣就很難死掉並且分數可能會很高並且一直沒辦法結束。
所以設定了一個遊戲結束的時間,並且讓遊戲規則更完整了。
而遊戲時間道並且沒死會有另一個畫面,但我圖片每公不夠好。


3.遊戲規則
因為有那些可以讓玩家調節的參數,使每位玩家遊玩的難度都各有不同。
分數的計算是以方塊離開到畫面的數量來決定,原本的分數只要不死理論上分數是無限!!
但有了時間限制,你必續調整到最高難度,方塊愈小密度越大數量越多,
速度越快時間越久也是一樣,並且時間內不能死掉才能得到最高分。
這樣就有玩家上分數鑑別度,分數越高就越強,而不會有投機成分在。

四.改善空間
1.分數紀錄:原本想做可以記錄玩家分數排前10的但後來時間不夠。
2.陣列的清除:有很多動態陣列都沒清除掉,從新遊玩可能會很占空間。
3.美工:畫面介面都不夠精緻。
4.音效: 沒做音效不夠熱血。

五.影片
1.遊戲介紹

                                                              遊戲介紹youtube連結

2.整體介紹
內建的檔案太大上傳不了,只能放Youtube

03360996_期末專案


遊戲名稱:戳戳戳

遊戲內容:
                在遊戲中有8種不同的圖案,每隔幾秒所有的圖案都會隨機更換位置,在60秒內,利用手指去戳圖案,來加分或扣分,碰到圖案後,圖案便會消失並在隨機的位置上重新產生。


製作過程:
                把圖片置入畫面中,並且利用rand()來達到隨機改變每個元件的位置,再來是利用Timer元件來倒數。

心得:
我原本是想做跟最傳統打地鼠一樣的遊戲,隨機出現和換位置都做出來了,可是到了發表前一天才發現,加入差異偵測後,沒有辦法進行偵測,而且考慮到如果要去打中間的兔子也容易去打到別的位置的兔子,所以我臨時改成戳戳樂,導致來不及加入音效以及把專案做得更完善。

原本做的遊戲畫面->


03360652_期末專案

互 動 視 訊 遊 戲 製 作 期 末 專 案

星 座 男 大 作 戰


﹝ 前 言 ﹞ 


在 12 星 座 女 的 聚 會 中 ,
總 是 會 有 12 星 座 男 的 混 入 ,
導 致 12 星 座 女 感 到 非 常 掃 興 。
因 此 ,
我 們 必 須 找 出 所 有 12 星 座 男 ,
請 他 們 離 開 場 地 ~!

         
﹝ 遊 戲 介 紹 ﹞

           
畫 面 上 有 12 星 座 , 每 個 星 座 皆 擁 有 一 男 一 女 , 共 24 人 !
當 手 或 持 有 物 碰 到 某 個 人 物 時 , 人 物 會 消 失 , 代 表 已 離 開 場 地 !
遊 戲 時 間 計 時 一 分 鐘 , 在 時 間 內 找 出 並 抓 到 ( 碰 到 ) 所 有 12 星 座 男 即 獲 勝 !
若 12 星 座 女 有 多 於 半 數 的 人 被 請 離 場 地 即 為 失 敗 !
當 時 間 歸 零 , 無 論 分 數 多 寡 , 尚 有 12 星 座 男 於 場 地 中 亦 為 失 敗 !
要 注 意 的 是 , 如 果 不 小 心 選 到 女 生 的 話 , 分 數 會 倒 扣 !
理 論 上 , 遊 戲 最 高 分 為   1 0 1   分 ;
實 際 上 , 尚 未 有 人 成 功 拿 到 滿 分 , 作 者 也 不 例 外 !

小 小 提 示 一 : 
遊 戲 開 始 前 十 秒 , " 星 座 男 女 比 一 比 " 介 面 , 單 數 行 為 女 生 , 雙 數 行 為 男 生 !

小 小 提 示 二 : 
男 生 精 力 旺 盛 , 所 以 跑 得 快 一 些 !

﹝ 操 作 步 驟 ﹞

打開專案的畫面...

Step1. 「 開 啟 」 視 訊 畫 面
             ( 「 互 動 遊 戲 」 -> 「 星 座 男 大 作 戰 」 -> 「 開 啟 」

            畫面跑出來了!



Step2. 「 設 定 背 景 」 遊 戲 背 景 , 畫 面 必 須 固 定 不 動
             ( 「 互 動 遊 戲 」 -> 「 星 座 男 大 作 戰 」 -> 「設 定 背 景 」) 
             等 待 視 訊 畫 面 左 右 相 反  ( 此 時 設 定 才 算 完 成  ) 才 能 進 入 下 個 步 驟 !


            等待...


            左右顛倒 -> 背景設置完成!




Step3. 「 開 始 遊 戲 」
             ( 「 互 動 遊 戲 」 -> 「 星 座 男 大 作 戰 」 -> 「 開 始 遊 戲 」)  




Step3-5. 「 星 座 男 女 比 一 比 」 女 生 男 生 一 對 一 對 排 排 站 , 只 能 參 考 10 秒 鐘 !
            依 女 -> 男 -> 女 -> 男 -> 女 -> 男 順序排列




Step4. 「 重 新 開 始 」 遊 戲 結 束 了 ? 再 來 一 場 吧 !
             ( 「 互 動 遊 戲 」 -> 「 星 座 男 大 作 戰 」 -> 「 重 新 開 始 」)  



           

﹝ 遊 戲 畫 面 ﹞

遊戲一開始的畫面



當有實體伸進去之後的畫面



勝利的畫面



失敗的畫面



可以選擇方塊模式遊玩,白色部分為偵測到實體的位置



好處是,如果背景跑掉就會看到以下畫面


如此會影響遊戲的進行,必須重新開啟,並重設定背景!

﹝ 心 得 ﹞

                      
        其實一開始想做的是類似趕綿羊的遊戲,但越想越不對,因為玩家可以直接拿任意比視訊畫面還長得物品,直接把綿羊全部一起趕到畫面同一側,如此一來遊戲就被破解,而無可玩性,後來想了很久才想出如今這個玩法。

        在製作過程中,曾因使用的電腦當掉與自動關機的因素,數次好幾個小時的結果都沒法存起來,導致有些地方,一直在重作,而浪費了一些時間,某次遊戲內容大致完成,就差時間跟分數的作品,瞬間消失,留下的只有連圖片素材都還沒完善的壓縮檔,那次損失慘重,甚至有過想放棄的念頭,幸好有一起修課的同學不斷安慰我,還陪我一大早就到學校重作,才有了今日的期末專案成果,非常感謝他!

補充:
自動關機,s513-1電腦於晚上某個時間(大概是十點左右?)會突然跳出警告訊息,大概是說電腦在10秒內即將關機,請同學存好檔案,以免遺失。10秒鐘,從視窗跳出來那一刻,我快速看到關機訊息,然後將專案存檔(save all),再來拿起隨身碟插到電腦主機,重新握著滑鼠準備備份到隨身碟的那個當下,電腦螢幕已顯示正在關機。我能做的,只有默默為沒來的及存起來的心血難過一陣子,然後十點半離開教室回家休息,然後在做專案的時候,把10秒鐘放進專案,星座男女比一比只有10秒鐘的時間可以參考,僅僅是用來當作對這件10秒鐘事件的紀念。

        我預計這個遊戲應該很容易才對,但是在做完之後的實測,才發現遊戲有設計上的缺失。因為我在玩的時候發現,當我的手想要伸進去碰某個人物的時候,會抓不到位置,比方說人物在(100, 480)的位置,但我的手一伸進去就在(300, 480)的位置,導致可能會誤碰了另一個人物而被扣分。如此一來,遊玩上就會有一些些無可避免的失分而感到無奈,進而影響玩家遊玩的興致。
我後來有想到兩個或許可行的解決辦法,一是,遊戲不要已全螢幕的方式呈現,應該讓視訊畫面比遊戲畫面還要大一些;二是,把判斷的地方改成判斷某種顏色,然後做一個棒子中間有貼顏色的道具。這兩種方法好像都可以抓到準確的位置再伸進去摸,道理其實跟其他把控制介面做成按鈕的同學差不多,概念是一樣的。不過我當初不想把控制介面做成按鈕式是有原因的,在玩的人在按按鈕,但是旁觀者來看實在有點蠢蠢的感覺(做復健?),所以才想到用這種較生動的控制方式,與老師指黑板有著異曲同工之妙的感覺。

        可惜的是,製作時間有限,加上製作過程中遇到了一些預料之外的情況,因此我沒來的及實現以上兩種解決方法,只能微調一下遊戲裡面的參數,改成可以用移動速度來辨別男女生,使得玩起遊戲來較為順暢一些些。雖然專案並不完善,卻也是我一番努力後的結果,因此還是讓我覺得很有成就感。

        經過這次的專案,除了XE2跟攝影機外,我還學到想要製作一個遊戲,除了劇情、音效、美觀…等等需要精心考量之外,如何控制如何進行遊戲亦是開發遊戲需要考量的不可或缺之元素。

﹝ 介 紹 影 片 ﹞


---無人聲版---


youtube連結:


03363061_期末專案


期末專案

殭屍防禦

想法  :

在老師教我們視訊的互動方式時,我就很想要用視訊互動的方式,來加以控制自己寫的Unity遊戲。 我的遊戲玩法是想用視訊操控的方式來控制遊戲中的砲塔,來防衛人類最後的防線,來抵禦6波殭屍的攻擊,並記錄最高分。而影響玩家分數的條件有,擊殺的敵人數與子彈擊中的部位來判斷, 六波殭屍的難度會由波次愈高而越難,並在最後一波會出現BOSS。

遊戲畫面  :

遇到的問題:
  1. 鏡像問題 : 判斷圖、遊玩介面
  2. 影像處理多個按鍵時,圖像有無重疊的判斷式造成程式執行不佳
解決方法:
     1. 後期使用原有鏡像程式試了很多次才解決此問題。
     2. 挑出這些按鍵判斷的共同項,提早判斷此項目,就可以減少不必要的判斷。


心得:
      這次期末專案視訊的部分花了三天的時間,在這三天中還包括學校電腦晚上無預警關機所以重做了 一次,而Unity的部分從考前每天陸陸續續都有寫,而在最後一天做個大致上的完結。               
  


遊戲影片 :


03360440_期末專案


期末專案


主題   :   夏日大作戰

想法 : 

           隨著夏日腳步的逼近,蚊蟲也在暗處蠢蠢欲動,受夠蚊子在你耳邊嗡嗡作響
           
           無所不在的螞蟻,打不死的小強,是否曾經為了打這些蚊蟲,而不小心打破
           
           花瓶等傢俱呢?
           
遊戲內容 :
           
           此期末專案以此為構想出發,設計了隨機出現的蚊蟲,玩家需於限時一分鐘內
           
           打到出現在螢幕上的螞蟻, 蚊子, 蟑螂,以此來獲得分數,除了隨機出現的蚊蟲
           
           外,也會出現花瓶,若不慎打破花瓶將會扣分數 !

遊戲操作及說明 :
           
           根據(圖一)需要先點選Auto來完成攝影機相關設置,再來依照(圖二)點選
           
           Background取得背景圖片,用來作為後續遊戲偵測手的部分,而接著按
           
           下(圖四)的Play 開始遊戲,遊戲的右上角數字為倒數時間(圖五),玩家需 
           
           於指定的時間內,用手拍打出現的蚊蟲等,最後遊戲結束(圖六)會顯示所

           獲取的分數及成功畫面。
           
遊戲畫面 :      
  
按下Auto擷取攝影機畫面(圖一) 

           按下Background作為差異偵測用(圖二)             

遊戲準備畫面(圖三)

按下Play開始遊戲(圖四)

用手拍打出現的蚊蟲(圖五)

遊戲結束畫面(圖六)

心得:
                      
           製作的過程中基本上沒遇到什麼困難,可惜的是因為要準備NCPU比賽
           
           所以只花大約2天左右製作,做出來的專案和原本的構想有些許的差異
          
           像是遊戲介面部分,是直接拿上課做好的加以改寫(圖一,二),而不是將
           
           功能合併,方便使用者操作,另外遊戲內所出現的虛擬物件,必須手有
           
           碰到後才會消失,所以導致一定會碰到花瓶,導致扣分的情況 !    

遊戲影片 :
(音效字幕喔~)

                        
           
           

2017年6月29日 星期四

期末報告

判斷文字和顏色
玩法:碰觸文字和顏色相符合的圖片即可得分,碰到錯誤的圖片會扣分


遊戲畫面:
先點選 "Preview Callback Function" 的 "Background" 擷取畫面背景,之後按左下方的 "Start" 後題目才會出現



遊戲開始後:
音效:觸碰正確和錯誤的圖片會有對應的音效 
Time:倒數30秒後結束遊戲
Score:記錄得分



遊戲結束:
出現訊息顯示遊戲結束,Score 為最終得分,若想再玩一次可點選 "Replay"




原本打算做去背的圖片,因為圖片是我自己做的,所以背景都是純白色,但顯示卻不如預期,因此就沒有去背



Demo影片:




問題及解決:
  1. 如何讀圖檔?Ans:用Timage元件的LoadFromFile,給圖檔時要給絕對路徑
  2. 如何計時? Ans:內建的Timer
  3. 如何隨機顯示任一圖片?Ans:用random();
  4. 如何給音效?Ans:內建的MediaPlayer
  5. 如何讓亂數每次都有1個正確和2個錯誤的圖片? Ans:我正確的圖有 7 張,錯誤的圖有42張,我用3個Timage 分別讓其中2個Timage隨機顯示錯誤的圖,最後一個Timage隨機顯示正確的圖,讓這3張圖顯示時的位置隨機變更,就可以讓每一題正確的圖片在不同位置上

還沒做好的:
  1. 顯示遊戲說明
  2. 沒做鏡像顯示,不能正對鏡頭玩會左右顛倒
  3. 碰觸正確的圖片沒有立即把手收回的話,換下一輪題目時,會直接偵測到我碰到的圖片,若剛好為正確的圖片則會直接換下一輪,應該是偵測到我收回再碰到才算得分並換下一輪
  4. 觸碰到錯誤的圖片扣分時,若沒立即把手收回會一直扣分,這個問題跟 3. 相似

02050965_期末專案

期末專案名稱: OOXX GAME 

     想法:
  1. 本來是想做虛擬案鍵控制遊戲,但後來覺得做出來應該跟大家都大同小異,因此後來改成用"光"去控制。
  2. 當時想到"光"第一個想到就是平常簡報的雷射筆,因此我的控制工具就以雷射筆的紅光為基礎。
  3. 為什麼是OOXX呢? 主要是我之前有寫過OOXX的遊戲,因此我直接拿來用再搭配這堂課所學的一起連動。


     遊戲規則:
                      使用雷射筆照射在白色布景,以雷射筆去操控圈圈決定你要把圈圈擺在哪個位置,跟電腦AI對戰,誰先藉著圈圈或叉叉三個連成一條線,就是贏家,贏的會在分數的地方加一分,玩到你不想玩為止。(PS:可以決定先攻後攻)



     遊戲介面:                                              
圖1.開始畫面

圖2-1.遊戲畫面

圖2-2.遊戲畫面

圖3.玩家獲勝

圖4.電腦獲勝

圖5.平手


      遇到的困難點: 

  1. 光的位置以及跟著光的軌跡移動
  2. 光最後確認點不容易辨識
      解決辦法:
  1. 上網查到相關函式可以應用
  2. 把區域切割成九宮格,光在該範圍內的出現以及消失決定確認時機

       遊戲影片: