余
程
漢
C H E N G - H A N ,Y U
個 人 作 品 集 2016-2019
余
程
漢
C h e n g - H a n , Y u 1
9
9
8
.
1
.
2
6
Email y u c h e n g h a n 0 1 2 6 @ g m a i l . c o m S i t e https://yuwaylan.github.io I G
@chyu126
元智大學 Yuan Ze University 熱衷學習 樂觀外向 多元興趣 網頁設計 JavaScript / PHP / MySQL / ASP.NET
主修 資 訊 傳 播 學 系 / 科 技 組 Major
輔系 : 企 業 管 理 學 系 / 主 修 行 銷 學 程 Minor Business Administration / Marketing
選修學程 互 動 多 媒 體 學 程 Elective
2019
畢業製作「狂想進化論」畢籌組 美術組員—宣傳影片拍攝
元智大學 108 級畢業 MV「記得畢業」
2018
3D 建模 & 動畫 MAYA / iClone(Motion Capture)
攝影—影片拍攝
元智大學資傳系校園電視台 I SEE
資訊長—電視台官網維護與管理
元智大學學生宿舍自治會
2017
影音編輯、動態攝影 Premiere Pro / Final Cut Pro / After Effect / DaVinci Resolve 證照 PORFORMANCE Microsoft Office Excel® 2016 EXCEL TOEIC :720
遠東新世紀行政服務組 及行政庶務
互動設計 Unity / Arduino / Vuforia
圖像創作設計 Photoshop / Illustrator
Interactive Multimedia
工讀生—協助資訊管理系統維護
行動裝置程式設計 Java
其他工具 C++ / Vim / Git / OpenGL / OpenCV
Inofrmation Communication / Technology
樓長—宿舍自治事宜
資訊傳播學系系學會
執行秘書—協助會長處理事務
第一屆資訊傳播學系瘋玩資傳寒期營
2016
總召—辦理寒營時各項事務
TEDxWagorHeighSchool
攝影長—活動攝影紀錄
C O N T E N T Interactive Technology 海洋防衛隊 Application 自走跳棋 一疾必殺 聯合報社論小幫手 Film 仨 你有聽過 Netflex 嗎 ? 八德生態埤塘—資訊動畫
I n t e r a c t i v e Te c h n o l o g y
A rd uino Unity
參與部分:總企劃發想、展場架製、無塑之套、成果影片製作
動機與理念 ▲成果影片
「無法再用就拒用!」
近年環境保育的議題延燒,全球人民的環保意識上漲,因此我們選定「海洋垃
圾汙染」為主題,並使用洞穴式沉浸投影的技術,呈現海中受汙染的畫面, 並連動三 種不同的互動裝置,當使用者身歷其境,破解完各裝置的關卡, 為海洋消除多餘的 髒污後,也能夠意識到海底垃圾的消除,是可以靠每一個人的努力去改變的!
1
展場空間規劃 展場外部 以金黃色沙灘為背景,以懸掛的寶特瓶代表人類製造的垃圾,瓶中的魚則代 表海洋生命因為人類製造的垃圾受到威脅。
展場內部 因將使用者設定為生存在海洋中的角色,所以海底為背景,以洞穴式沉浸式 投影營造出一種置身於海洋的感覺。
2
裝置設計 塑膠獵手
不同其他紙箱的材質,因考慮到會有多次的撞擊,這個裝置以較硬的瓦愣版
製作,能夠承受多次扔擲的扭蛋保齡球,底部墊高部分考慮成本和其他裝置材質 的一致性,還是使用紙箱和藍色粉彩紙包裝美化。
打擊粒粒
高檯內層為層板式設計,一共三層,由上而下分別是圍繞著 LED 燈的透明
管和中間的 arduino 線路層,最底層是直接擺放風扇。中間層以 arduino 控制馬達 下旋轉葉片,控制風流,使底層風扇的風灌入洞口。
3
無塑之套
以童年常玩的套圈圈作為發想,以內部裝有 LED 的透明 PVC 水管作為套圈的材
料,當紙箱上的套圈被拿起即開始遊戲,以套圈套中目標物後,使套圈發光,遊戲即 可過關。
▲成功套中目標物後,套圈亮起
▲套圈尚未拿起時
在透明 PVC 水管內放入水銀電池、
單芯線、LED 燈組成的電路,將兩端都用 鐵絲連接出水管外,形成斷路,待套中目 標後鋁箔使外露之鐵絲連接形成通路。 4
Application
J ava C #
自 走 跳 棋 作品說明 在閒暇時間想要玩跳棋卻找不到人陪伴?或者是與對手下棋時忽然之間不知 道下一步該怎麼下才是最佳致勝方式?因此設計出了可連線的自走下棋程式!不論 是自己玩或是想跟別人玩都不是問題!
▲遊戲初始之畫面 7
操作說明 遊戲設定 由於這是可以與不同玩家連線對戰之遊戲,因此可以從此處設定對方 ip 以及 相連接之 port。
從此處進行顏色的挑選。分別為黃色陣營與紅色陣營。紅色為先行方。
當 ip、port 以及顏色選好之後即可點選「start server 」進行連線,連線完成後 遊戲開始。若是於遊戲中途想退出遊戲則可以點擊「stop server」退出遊戲。「 執行一 步 」可以使所設定之顏色的棋子根據演算法自動走一步,不論是人機對戰或是電腦 對電腦皆可使用此功能。
若是下棋時若是未點選「Start Server」開始遊戲,便會跳出此提醒。玩家重新
設定一次 ip、顏色以及 port 即可開始遊戲。
8
遊戲畫面
▲當使用人工下棋時,可以點選要欲移動的棋子,可以移動之 範圍將會自動顯現在棋盤上。
▲當與他人連線後,下方紀錄區便會顯示對方移動的 方式 9
其他提醒
當使用人工下棋時,若是非輪到你
的時候機會跳出此提醒,告訴你應該要等 對方下完。
若是當所選擇陣營全數移
動到勝利地點後,勝利時即會跳 出此提醒。
若是當對方陣營全數移動到勝利地
點後,即為己方的失敗,失敗時將會跳出 此提醒。
自走演算法
計算出每顆棋子的棋盤座標位置求出重心,與目標位置的座標重心相減,
由此法可以讓棋子往目標移動。而移動哪顆棋子的依據為距離目標最遠處的棋子 先走,由此可以避免有棋子還未到達目的地,但是可能由於棋子重心與目標座標 重心已經重合而不移動 ; 除此之外還有判斷可以跳最遠 ( 使之與目標座標最近的 位置 ) 增加選子的權重。另外,由於本期盤座標是由矩形歪斜後的平行四邊形, 因此若是只有以上兩種方法在進行棋子移動時,將會造成棋子明顯移動向行走方 向的右邊,造成走的路線不是直線行走,無法達到最快勝利的目的。因此在遊戲 初期與中期會將目標座標的重心進行些許的偏移,使棋子自走時可以大致的以直 線前進。
10
一 疾 必 殺 作品說明 在小時候很喜歡玩的電子機遊戲,曾經為了他可以一整天都不吃飯 只為了突破最佳紀錄。以 C# Windows Form App 進行製作的遊戲以外太 空為故事背景的遊戲,因此選擇以飛行船、外太空作為美術背景。
11
遊戲介面與規劃
開始
▲ 從 初 始 視 窗 中 選 擇 「 好 」 開啟遊 戲 視 窗 以 進 行 遊 戲 。
遊戲控制
▲使用 W、A、S、D 鍵控制上下左右移動,以及以空白鍵進行攻擊敵機。 12
敵方攻擊
▲敵方不定時會射出衝擊波,可以靠操縱上下左右移動閃避。
▲若是不幸受到敵方的攻擊,下方的生命條會減少。 13
失敗與勝利
▲當持續受到敵方攻擊,且下方生命條歸零時將會跳出提醒結束遊戲。
▲當攻擊到敵方一次便可以將敵方擊斃。勝利時便會跳出此提示以結束遊戲。 14
聯合報社論小幫手 作品說明 ▲於 Google Play 上架。
由於爺爺十分喜歡看聯合報的社論版,因此創作出這個應用程式,除了可以讓爺
爺不用再如此吃力的看字很小的報紙,也可以讓爺爺可以練習使用手機,讓他的生活 多一點樂趣。由於主要是給高齡使用者進行使用,因此在介面複雜度上盡可能的以簡單 以及奕閱讀的大文字為主。
▲於手機中的圖示
▲開啟 APP 後的主介面 15
▲點擊文章後進入的文章內容頁面
使用者介面設計
主畫面設計
以簡單的二個分頁式介面讓使用者能夠簡單的分別所想要進入的類別,分別為聯
合報的黑白集以及社論專欄。以 Fragment Tab 作為框架進行製作,可以輕易的左右滑動。
▲左側為聯合報黑白集專欄
▲右側為聯合報社論專欄
文章內容頁面
使用者可以透過右上角的“大”、“小”進行字體的調整,自行調整到最舒適的大小,
不用在把手機拿得遠的或是要貼到螢幕上才能看清楚文字。首列為原文的網址,以及目 前字體大小的提示。
16
FILM & Animation
After Effect Premiere Pro iC lone M AYA
仨 擔任攝影與後期特效
故事大綱
鳳美與阿男是多年好友,在都市裡⼀起租房⼦,阿男⼀直隱瞞⼀個秘密,那就是
他是同性戀。⼀天鳳美、阿男與另⼀個好友⼤包去遊樂場玩,鳳美有意無意的勾引⼤包, 讓阿男有點不開⼼。後來過了幾天鳳美要阿男帶她去考駕照,⽽鳳美沒有考上⽽沮喪。 過了幾天鳳美離開了阿男,她不願將阿男綁在身邊,⽽且其時她早就知道阿男的秘密 了,⽽為了不讓彼此牽絆,她選擇離開。
阿男
24 歲
大包
22 歲
鳳美
24 歲
跟鳳美是⼤學同學,不知
在⼯作環境認識阿男再
在 學 時 期 演 藝 科, 曾 在
不覺成了知⼼,跟鳳美⼀
轉 ⽽ 認 識 鳳 美。 內 向、 不
校園以最佳花旦紅極⼀
起 租 房 ⼦, 卻 藏 著 ⼀ 個
善表達⾔詞但卻積極,跟
時, 但 過 往 的 榮 耀 也
連鳳美都不知道的秘密。
鳳美個性大相逕庭。
造 就 了 今 天 消 極 的 她。
攝影與風格 在取景上以中景,特寫居多,帶出鳳美以及阿男的情緒及個性,也利⽤特寫讓觀 眾更加認識鳳美以及阿男的個性細節。在影片調性則以暖調為主,同時也使用高飽和度 與較為雜亂的色調襯托出三位主角各自的性格以及他們之間複雜的關係。
19
▲影片網址
20
你 知 道 Netfliex 嗎 ? 擔任攝影、MAYA 與 iClone 動畫製作
作品說明 參與第一屆虛擬網紅黑客松創作大賽 VTuber hackathon 的參賽作品, 劇中描述了各種使用 Netflix 時會遇到的趣事,說明了不論在何時、何地都 可以使用 Netflix 追劇。此作品榮獲比賽的最佳動作獎。
閻小妹 小短劇中的女主角,有著天 然呆的個性,讓她在生活中 時常帶給人困擾。 (CV: 邱芷芸 )
攝影與風格 在實景取景上以中景與中遠景為主,敘述女主日常的生活趣事,在影片中加入些 許手繪動畫,使女主與其他演員的互動更加活潑有趣,也讓影片增加些許如女主個性 的俏皮感。
使用技術 除了使用 Adobe Illustrator、 After Effect 以及 Premiere Pro 外,也使用了 可 以 進 行 3D 物 件 編 輯 的 MAYA 以 及 由 主 辦 單 位 提 供 的 Reallusion iClone 搭 配 Motion Capture 動作捕捉感測器進行閻小妹的動作製作。 21
▲榮獲虛擬網紅 VTuber 黑客松—最佳動作 頒獎當天代表受獎
▲影片網址 22
桃園文化小教室 - 八德生態埤塘 擔任 Motion Graphic 動畫製作 、完整影片剪輯與音效
作品說明
此作品為實習時參與 USR 計畫所製作的資訊動畫,目的為以簡單活潑的方式推
廣桃園的在地文化特色以及桃園藝文廊道相關資訊。而此作品介紹的便是位於桃園的八 德生態埤塘,由兩位主角的對話介紹八德生態埤塘的特色。
小明 一個好奇寶寶,有著小呆瓜
阿牛 聰明的阿牛總是給小明解說
的個性常常會有意想不到的
著有關桃園的文化。
聰明才智。 (CV: 李滇哲 )
(CV: 李奕賢 )
美術風格
美 術 以 簡 潔 為 主 不 希 望 過 多 畫 面 元 素 影 響 觀 眾 的 知 識 吸 收, 因 此 採 用
monotone 做為主要美術風格。
使用技術
主要使用 Adobe Illustrator、 After Effect 以及 Premiere Pro 進行動
畫製作與剪輯。 23
▲影片網址 24
鬥 酒 擔任攝影與後期色調
故事大綱
兩位互看不順眼的調酒師,再一次客人的挑釁中終於互相出招較量了,他們
之間的鬥爭有如鬥魚一般爭奇鬥艷且高雅,男性與女性之間的比較在這個社會已經 是常態和熱⾨的話題。這次我們想傳達女性間的競爭,在神秘的酒吧,以⾼雅且充 滿⼒與美的調酒帶出女性之間柔中帶鋼的⾾爭。
調酒師 A 時常與調酒師 B 勾心 鬥 角, 兩 人 在 平 時 工 作時便已經互看不順 眼。
調酒師 B 調酒師 A 的死對頭, 再受到男客人的挑釁 後與調酒師 A 進行了 一場高雅的對決。
男客人 挑釁原本就已是死對 頭 的 兩 位 調 酒 師, 並 以此為樂。
攝影與風格
在取景上以中景,特寫居多,細膩描繪兩位調酒師之間鉤心鬥角的表情與小
動作,在影片調性則以冷調為主,搭配高飽和度的色調營造出在酒吧內燈紅酒綠的 情境,同時也更為兩位兩位調酒師之間的情緒增添一點危險的氣氛。 25
▲榮獲競如人生入目三分競賽—佳作 代表上台領獎
▲影片網址 26
P R O F O I L O