專案背景
偵探學為台中國家歌劇院駐館藝術家周曼農聯合許多專業藝術家,所創作之空間藝術,由探索筆記本為出發點。此專案並非由我們親自設計與藝術家溝通,而是作為技術顧問身份協助 StudioPros 設計UI介面。
程式概念
我們另外建議使用 3D 環境技術的形式來製作 2D 的平面場景,這樣不僅能增加整體空間的透視感,更能藉由鏡頭移動達到仿 Parallax Mouse Move 的效果。我們將 StudioPros 所設計的平面場景,一一搬動到 3D 軟體進行組裝。
最後使用 Three.js 作為技術的基底框架來設計程式。場景間的切換,我們使用了假場景替換方式的障眼法,當鏡頭位移至設定好的位置時,則敲敲的移動所有物件的 Z 軸,而達到不需要計算過度複雜的鏡頭路徑,只需要移動 + 替換即可。
氛圍加成
為了製作沈浸式,我們覺得增加音效是必須的,所以我們另外設計了物件 Mouse over 的音效,也請藝術家提供了我們現場場景音效,讓體驗更加沉浸。另外做了許多細節的處理,例如移動讀取時的偵探沙漏旋轉特效、滑鼠追蹤 Mask 效果等。
- 設計團隊優仕創意 StudioPros
- 主視覺設計楊士慶 Yang Shi-Ching
- 程式開發Eason、Les
- 程式技術指導Tommy