returnBtn

北管樂混音器「工尺」操作展示網站

專案簡介

協助台科大畢業生製作展示網站,讓使用者於網站上操作工尺混音器的功能

專案成果

以步驟式的引導,帶領使用者了解北管文化,同時體驗與操作工尺的各種混音與演奏功能

專案時長

Jul. 2021 ~ Aug. 2021(2個月)

專案角色

Frontend Engineer

專案成員

設計師:王駿騰、陳錡淵
工程師:邱威辰、徐慶毅

returnBtn

專案背景

此為台灣科技大學畢業生 - 設計系工業設計組王駿騰、 陳錡淵的畢業製作作品之展示網站。該作品將台灣民俗文化之一 - 北管樂的音色、樂器等元素與較常在西方音樂出現的混音器結合,創造出北管樂混音器 - 「工尺」

本網站透過網站動畫與 tone.js 套件,搭配步驟式的教學系統,讓使用者在平板上以多點觸控的方式來操作樂器,達到升降調、錄音、混音、演奏…等效果。

專案分工

網站設計稿、圖片與音樂素材由王駿騰、 陳錡淵提供。

網站編寫由我與 徐慶毅 共同編寫。由徐同學負責網頁切版與動畫特效、我負責網頁切版、部分網頁排版設計與 JS 使用者操作功能編寫。

成果展示

因本網站專為觸控式螢幕做設計,且為保持使用者良好的體驗,僅以 1366*768 做設計,以避操作操作區過小造成使用者操作上的不便。 若以電腦操作,請以 chrome 開發者工具中模擬觸控模式進行操作。

GongChi-Demo1 GongChi-Demo2 GongChi-Demo3