2017計算機圖學: 40447009S

顯示具有 40447009S_何暐婷 標籤的文章。顯示所有文章

2018年1月13日星期六

Weiting的計圖第十七週

期末專題：

老師教導如何用p語言建造3D的家

房間

建構素材：

box

建構方式：

運用2維陣列，陣列的row和column表示x和y軸，裡面的值表示高度(z)，再運用三個for迴圈去顯示這些box

還要加上x, y軸的旋轉才看得)

有打光的格子狀房間

把打光和格子去掉(noStroke())

再打光(lights())就看起來很立體了!

家具的部分用相同原理製作，再加上一點位移(translate())就可以在適當位置

其他貼圖：
壁畫、床單、電視銀幕、地毯等等都是用2D小畫家畫出來的，
再將它們旋轉並移動到適當位置

人物

用一顆打光後的球，並運用鍵盤操控

限制：因為座標系統有旋轉，鍵盤操作上會有點不直觀

Weiting的計圖第十六週

期末專題準備：

嘗試用p語言和glut製作專題

p語言：

製作出了一個3D間和一顆球(Sphere)並且讓他可以在空間中自由移動

glut：

運用2D座標系統製作了一個假3D場景

搜尋房間設備且規劃版面配置

2018年1月11日星期四

2017年12月21日星期四

Weiting的計圖第十五週

主題: Antialias
期末作品Q&A

aliasing
「aliasing 影像」的圖片搜尋結果

取樣時無法完美呈現最細緻的細節，
於是有了antialias, dithering的技術

antialias 反鋸齒

dithering 抖動: 將墨點往四周移一些

運用人類視覺的問題，用灰階呈現，使得圖形看起來很對

期末作品

2017年12月14日星期四

Weiting的計圖第十四週

主題: 期末作品 Q &A
Rasterization

張鈞法教授投影片網站: http://cg.csie.ntnu.edu.tw/CG/

rasterization 光柵化
把3D的圖壓扁變2D的圖
像是光有柵欄一樣，填滿每一個pixel
「rasterization」的圖片搜尋結果

p語言實作

stroke不會填滿

將stroke改成fill就可以填滿

Q. 為甚麼都用三角形討論rasterization？

因為所有多邊形都能由三角形組成，且三角形保證是凸多邊形

深度值(z)

圖片一前一後

放大來看，可以看到鋸齒狀 (此圖不清楚)

期末作品

示範3D mario

背景: 看起來像3D
角色: 前後左右移動且可以跳

用QUAD畫出四邊形(用vertex設定座標)

lights()//打光

示範google 小遊戲

先畫出一個立方體

用for迴圈畫出更多個立方體

用2維陣列存立方體的位子

directionLight(r, g, b, nx, ny, nz); //打光 lights();
(參考網址: https://processing.org/reference/directionalLight_.html)

animT;//動畫時間

2017年12月7日星期四

Weiting的計圖第十三週

主題: VR體驗、期末作品點播、色彩系統

GOPRO

運動攝影機

OMNI

六個GOPRO組合，可以拍到360度的東西，youtube現在可以放這種360度的影片(用滑鼠拖曳方位)

ricoh theta

360度VR攝影機

HoloLens

Google Project Tango

https://www.youtube.com/watch?v=Qe10ExwzCqk

tango介紹: https://www.bnext.com.tw/article/41652/lenovo-phab2-pro-tango

擷取自以上網址:

Tango技術：

運動追蹤（motion tracking）：透過 Tango 定制傳感器（魚眼相機與 IMU），行動裝置可以了解自身的位置和移動的方向，能夠提供該行動裝置實時3D 運動信息。

區域學習（area learning）：Tango 裝置可以用視覺線索來幫助識別它們周圍的世界，可以在運動跟蹤過程裡完成自我糾錯，在曾經經過的地方再次定位。

深度感知（depth perception）：透過深度傳感器，行動裝置可以感知周圍世界的形狀，用來構築三維的環境模型，配合運動追蹤後，它可以告訴用戶在空間中的位置和周邊障礙物的距離。

Tango 技術原來被稱為 Project Tango，源自於 Google Advanced Technology and Projects group（ATAP），一個類似於 Google X 實驗室的技術研究部門。 Project Tango 是 Google 為實現行動裝置位置感應而研發的一系列產品與技術的集合。

華碩zenfone AR Holo

https://www.youtube.com/watch?v=jURLo_32kSs

色彩系統

RGB 色彩系統

HSB 色彩系統

色階飽和度亮度

colorMode 可以選RGB 或HSB 不同的色彩系統

多張貼圖的作品

避免讀圖檔當掉:

在main函示讀圖檔(不要在display的時候)

要在glutCreateWindow()之後、glutMainLoop()之前

只能讀一次

記得要裝 glut 和 opencv

如何做出光劍效果

2017年11月30日星期四

Weiting的計圖第十二週

主題: Scene 場景

1. 下載 myGL_Frustrum 221_MultiView

2. 跑執行檔

3. 開一個 glut專案，將下載好的程式碼

複製到 main.cpp

4. 加程式碼

5. 編譯

unity介紹(略)

P語言

1. 在library下載 collada和 picking

collada

2. 文件>範例程序>開collada裡的 Viewer2D

3. 將 false改成true 可以顯示3D模型

讀各種模型檔

可以用滑鼠和鍵盤作不同的旋轉和縮放

picking

1. 開啟pincking>simple

當滑鼠碰到橘方塊時外面的方塊會變橘的
碰到黃的則變黃色
沒碰到兩者擇黑色

好書推薦

補充

3D builder: 將圖檔變成3D模型

2017年11月23日星期四

主題: 音效、音樂
期中proposal
Mocap

平台: Windows, Java等等

音樂、音效
wav檔

1. 開啟glut專案

2. 在main外面
#include <mmsystem.h> ///使用Multimedia System多媒體系統

3. 在main裡面

PlaySoundA("file.wav",NULL,SND_ASYNC); ///檔名, 在哪裡, 如何播

PlaySoundA: A是ASCII

檔名: 全英文

如何播: SND_ASYNC: sound_不等待同步

4. 將音效放在freeglut/ bin資料夾裡

(要放在藍線畫的這個資料夾裡)

ASYNC: 聲音和圖同時

SYNC : 聲音放完才畫圖

mp3檔
wav 和mp3 不一樣:

wav 沒有壓縮過
mp3 有壓縮過

1. 下載mp3的.h檔 (CMP3_MCI.h)

2. 程式裡面記得 include

3. 下載mp3檔

3. 程式如下

Processing
1. 速寫本==>引用庫文件==>添加庫文件==>library
下載 Minim函式庫

2.程式碼如下

記得要把音樂檔丟進去!

補充
FBX SDK (Autodesk)

2017年11月19日星期日

Weiting的計圖第十週

主題:
期末作品說明示範
SIGGRAPH
影片示範

SIGGRAPH
grahics的應用可以是觸覺、聽覺的

用 processing寫 android app

1. 將 processing 右上角的 java改成app mode
(要下載 android模式)
自動安裝 Android SDK NDK)

2. 加入程式碼

3. 將手機與電腦連結
(如果是 ios的手機可能還要再弄個phone gap)

此為java (非android版)因為手機是ios系統所以先以電腦做測試

補充
coursera的 igarashi教授

想將手機銀幕顯示在電腦上:
https://www.experts-exchange.com/questions/29016257/Vysor-for-iPhone-I-need-to-display-my-iPhone-screen-on-my-PC.html

https://www.apowersoft.tw/phone-mirror

2017年11月9日星期四

Weiting的計圖第九週

主題: Bump Mapping凹凸貼圖
Environment Mapping
Processing3.3.6

GLSL: openGL 裡的shading language

1. 體驗何謂bump map
https://www.openprocessing.org/sketch/249457