拷秋勤《發生什麼事?》專輯AR app

有榮幸參與這次專案是因為一天接到合作已久的3D Modeler一通電話,說他與知名專輯封面設計師蕭青陽老師提案討論到能運用擴增實境來玩些不一樣的概念,搭配上拷秋勤此張專輯想訴諸的理念,擴增實境剛好是一個適合將裡頭故事說出來的媒體,因此在這樣的緣分之下促成了這次的專案。

擔任互動技術開發一職的我,運用多年撰寫Unity 3D的經驗負責將視覺與互動規劃一一實踐,途中也理解許多關於多媒體內容說故事的技巧與內涵。實體專輯本身是一本完全沒有文字的冊子,乍看之下僅是一本印刷與圖像相當有現代感的切型印刷,但打開相配的app後,將相機對準著實體專輯,會發現每一頁每一張都訴說著不同的故事,對應著專輯歌曲聽,相當震撼人心。

拷秋勤《發生了什麼事?》專輯中,提出了許多對當今台灣社會議題的反思,歌曲配上AR互動,赤裸裸的展現社會價值觀的偏差、環境的不公亦或是關懷流浪動物等等。譬如說專輯封面,利用app一照,便會出現許多當下正在發生的新聞標題,呼應著專輯標題「發生了什麼事?」;一頁人行孔蓋,點擊後可以窺探到後頁當年鄭南榮自焚的景象;俯瞰台北平面圖,觀者開著一台飛機不斷向地面轟炸。

這是我第一次挑戰用這樣的技術與幾近藝術表現的內容合作,也很慶幸搭著這個專案的光,入圍了2013 年金曲獎的最佳專輯包裝獎,這是一個很棒的專案,在執行過程中相當過癮!

 

 

 

Skill

Unity 3D, Vuforia, C#

Date

2012.10

苓雅分局交通宣導專案「試試波麗士」遊戲開發

因為一些因緣際會,分局曉得了我有一些多媒體的製作能力,這個專案的起源是某天忽然接到分局長的電話,說有一支影片想要問看看我會不會剪輯,聽到時其實滿頭黑人問號,但抱持著聽聽看也無妨的心情就去參加了會議。聊著聊著也暸解到分局正苦著如何宣導交通安全等等,「那不然就做支遊戲好了」我不知道哪來的勇氣以及忽略我可能將來幾天都沒法好好睡覺的傻勁脫口而出,然後就開始了一連串埋頭開發遊戲與題進度的神奇勤務…

遊戲開發初期,因為是參照實際場景的遊戲,特別跑到中正與大順路口定點觀察一陣子,研究車流、違規樣貌、號誌時相與道路景色現況等等,配合交通組學姊手邊的統計資料,把所有能記錄的東西畫下來回到工作桌前開始將元素產製成美術內容與參照數據。

不過正如前頭所說,一開始其實沒有太深的理念,只參考了一些手遊的玩法以及自身交通指揮勤務的經驗就想了個抓(爆你們這些)違規的遊戲,越做越後面,給同袍完了些開發測試版後反而開始有了些想法。

遊戲之於其他媒體形式來說,他其實有著高度互動與沈浸的優勢,透過這些特性,遊戲是可以說出別於影片、文字還要來得更生動更易讓人感受的故事。加上遊戲的趣味性,觀者進入的門檻要比文字還低、停留的注意力也不會輸給影片,作為傳達理念的工具,遊戲有著獨特的能力。

釐清想法後,便將遊戲主軸設定成「換位思考」,試圖讓玩家深入淺出的模擬警察勤務,藉由角色扮演讓用路人理解警察眼裡的違規其實各個都是事故潛在的因子,這種效果我認為比起各種驚悚的車禍影片還要容易理解。所以在畫面、音效、提示的用字上都盡可能的從警察勤務又不失使一般民眾理解的角度出發(這樣說好像我平常都臥底在觀察警察似的…),保持在原本設定的主軸上。

除了能讓整個遊戲動起來的程式設計外(如車輛移動、碰撞判斷、違規模擬等等),互動設計是我花比較多時間的地方,如何讓人在遊戲期間有快感與趣味性,點擊的回饋是相當能做文章的點,於是我加入了警察攔檢時常用的哨音、與被攔檢的用路人驚嚇的卡通效果,在點擊沒有違規的車輛時,也預計加上一些隨機表情符號,彷若與之打招呼般的回饋(只可惜時間不夠做圖而作罷)。美術設計也參考了現行警察界會用到的符碼加以轉化,如警徽的盾牌形狀、交通警察的臂章配色等等(但得原諒我美術設計能力真的不太強)。

雖然遊戲玩起來還是有許多可以改善的地方,不過這還真是我畢業後難得再有一次機會能獨立開發一個完整性較高的遊戲專案,做玩頗有成就感(以及好幾天累積下來的疲勞…),感謝苓雅分局能給我這個機會,行政組提供行政協調與作業的組長跟學姊,還有感謝因為專案勤務調配而幫我站崗的同袍們,以及錄音錄到去切水果吃的巡官,最後感謝分隊提供一個良好的工作環境(寢室真的挺舒服的)。

遊戲網址:
http://kmph-lingya.host22.com/traffic-police

相關報導:
全民抓違規 高市苓雅警分局推線上遊戲 – 中央社即時新聞
http://www.cna.com.tw/news/asoc/201707070103-1.aspx
替代役設計網路遊戲 玩家扮波麗士抓違規 – 中時電子報
http://www.chinatimes.com/realtimenews/20170707003588-260405
全民抓違規 高市苓雅警分局推線上遊戲 – 聯合新聞網
https://udn.com/news/story/7321/2569321

 

 

Skill

Unity 3D, 3Ds Max, Logic Pro X, Figure, PhotoShop, C#, HTML, CSS

Date

2017.7

native / artefacts® – 日常髮油索引網站

與native / artefacts®新創髮油品牌合作推出的髮油推薦網站,利用選答的方式找出最適合使用者髮質的髮油。

 





網址:
http://native-artefacts.hol.es/YourDailyPomade/

 

Skill

HTML, CSS, Java Script, jQuery, React.js, RWD

Date

2017.2

SpringTEA飲料店 杯蓋AR互動遊戲

來自加拿大的台灣風手搖飲料公司創新的將手搖杯封膜結合AR玩起擴增實境遊戲!透過app可以在杯蓋上堆積起可愛的食物高塔,在時限內堆積越多將可以換到超豪華的飲料優惠。

 

 

App Download

Android

 

 

Skill

Unity 3D, Vuforia, C#

Date

2013.10

彰化縣政府市議會圖書館 名人堂 展演裝置

彰化縣政府新座落的市議會圖書館,裡頭透過數位科技呈現技術製作了彰化縣歷年來的政壇名人榜。藉由Arduino偵測插卡式進行互動,可以觀賞歷屆人物的種種貢獻。

Skill

Unity 3D, C#, Arduino, Java, 電子電路整合

Date

2017.10

小王子特展 現場AR立體書互動裝置

2014年位於華山開展的小王子特展,裡頭一區全數採用AR技術呈現,將小王子以電子書呈現在觀眾面前,搭配生動的動畫和場景,帶領觀者進入小王子的世界。

 

 

 

Skill

Unity 3D, Vuforia, C#

Date

2014.12 – 2015.03

Popu lady《Popu Future》專輯AR app

Popu Lady以寫真集做為概念製作了專輯《Popu Future》,同時運用了AR技術豐富了整本寫真集的閱讀體驗。app能透過AR觀賞封面精采的舞蹈表演、單張拍立得與喜歡的偶像進行私密約會外,更有戀愛元氣彈的集氣小遊戲!

Skill

Unity 3D, Vuforia, C#

Date

2013.9

G7車庫柒號 發表會現場水池AR互動

G7車庫柒號於W-Hotel舉辦的發表會Party,現場在W-Hotel的泳池中放置了大型的AR Marker,讓來參加Party的人透過AR擴增實境技術一睹超跑在水池中緩緩升起的風采,且還能享受超跑的聲浪!

 

 

Skill

Unity 3D, Vuforia, C#

Date

2013.9

2013 賓士 B-Class in ATT4Fun 戶外AR廣告裝置

MercedesBenz 2013年於台北信義區ATT4FUN外廣場設置2013年全新B-Class車款的戶外行銷廣告,整座展台由運用大富翁概念的主視覺設計以及全新B-Class實體車搭建而成,搭配AR擴增實境技術更加完善戶外廣告體驗。

 





 

 

Skill

Unity 3D, Vuforia, C#

Date

2013.3

2013好漢玩字節 – 好字繪 AR T-Shirt

2013高雄好漢玩字節「好字繪」AR擴增實境T-Shirts;與參與2013高雄好漢玩字節的設計師合作,推出十款設計T恤,搭配AR擴增實境技術,使T恤具有好玩的互動效果。

 

 

Skill

Unity 3D, Vuforia, C#, Arduino, Networking

Date

2013.1 – 2013.4