吳帆 張文怡 劉暢 方子儀
摘要:自主設計開發(fā)了一個微信小程序《匠器——景泰藍》,該小程序具有傳播景泰藍工藝文化知識、推廣景泰藍工坊、體驗景泰藍工藝等功能。希望依托微信小程序獨有的傳播優(yōu)勢,吸引更多的人關注和了解景泰藍傳統工藝,促進景泰藍工藝文化的傳播和傳統工藝行業(yè)的發(fā)展。文中對小程序的功能與界面設計、開發(fā)實現技術進行了詳細的介紹,并展示了小程序成品效果。該小程序達到了綜合性、趣味性和互動性的設計目標,實現了移動互聯網+傳統工藝的探索與實踐。
關鍵詞:景泰藍工藝文化;微信小程序;功能設計;界面設計;軟件開發(fā)
中圖分類號:TP311.1;J526.2? ? ? 文獻標識碼:A
文章編號:1009-3044(2021)12-0001-03
1 背景
景泰藍是北京代表性工藝美術品種“燕京八絕”之一,其制作工藝入選國家非物質文化遺產名錄。在移動互聯網時代,手機無疑是信息傳播最有效的方式之一,而微信小程序相較于App又具有體量輕、訪問方便、開發(fā)成本低等特點,因此本文開發(fā)了一個微信小程序《匠器——景泰藍》,希望能夠吸引更多的人關注和了解景泰藍傳統工藝,促進景泰藍工藝文化的傳播和傳統工藝行業(yè)的發(fā)展。
自微信推出小程序以來,國內對小程序進行開發(fā)的研究不少[1-3],但以傳統工藝文化為題材的小程序并不多見。手工藝類的App包括有東家守藝人、手工客、老字號、手藝、在藝、每日故宮、拾翠、藝匠等約二十幾款[4],而許多近年來已經停用或停止更新。北京工業(yè)大學在2017年開發(fā)了一款App《工藝大師——景泰藍》,將景泰藍的紋樣設計和燒制過程做成一個款小游戲,設計較為獨特,但僅在蘋果應用商店可以下載,而且在2018年后就沒有更新[5]。騰訊支持的Tag Design公司在2014年和2017年分別開發(fā)了兩款功能游戲——《折扇》和《榫卯》,以游戲的形式科普傳統工藝,建模制作精良,界面設計簡潔,但是功能較為單調,可玩性較低[6]。以上幾款應用雖然都對傳統工藝的普及起到了一定的作用,但均為App形式,占用空間較大,不易傳播。而目前以景泰藍為主題的微信小程序多以售賣景泰藍制品為主,例如《京景景泰藍》《國禮景泰藍》。
本文開發(fā)的微信小程序——《匠器——景泰藍》希望可以填補景泰藍工藝文化傳播小程序的空白。用戶可以通過小程序這一簡單的方式,了解景泰藍工藝并欣賞景泰藍大師的作品,快速找到景泰藍工藝品的銷售平臺,同時進行景泰藍紋樣設計的工藝體驗。希望通過本平臺傳播景泰藍文化,吸引更多的人參與景泰藍工藝的傳承,讓景泰藍這一傳統工藝煥發(fā)新的活力。
2 小程序功能模塊與界面設計
《匠器——景泰藍》小程序共分為4個功能模塊,分別為介紹、工坊、游戲和我的,每個模塊下還設有子模塊,功能結構圖如圖1所示。小程序的所有界面均為原創(chuàng)設計,界面風格統一,體現中國傳統文化的特色。以下對每個模塊的功能和界面設計進行詳細介紹。
2.1 介紹模塊
介紹模塊分為兩個部分,一個是工藝模塊,另一個是名家名作模塊。工藝模塊是通過圖片、視頻和文字相結合的方式,介紹景泰藍的六步工藝流程——制胎、掐絲、點藍、燒藍、磨光、鍍金。在此模塊中,用戶可根據自己的興趣,通過左右劃屏的方式選擇任意一個景泰藍工藝環(huán)節(jié),瀏覽該環(huán)節(jié)的圖片和文字性描述(如圖2),同時每個工藝環(huán)節(jié)還有相應的視頻內容(圖3)。
在名家名作模塊中,用戶可以通過左側邊欄滑動選擇景泰藍工藝名家的姓名,右邊部分即可對應顯示名家及其作品的圖片和文字介紹內容。點擊某一作品圖片或名稱,即可瀏覽作品的詳細說明。此界面同時設置收藏功能,如果點擊收藏,用戶可以在“我的”模塊查看收藏的作品信息。
2.2 工坊模塊
工坊模塊主要提供與景泰藍相關售賣工坊的小程序跳轉鏈接,在這一模塊中鏈接了一些景泰藍線上商城小程序(如圖6),用戶可以跳轉至不同的線上商城(如圖7),直接完成線上購買。
2.3 游戲模塊
在游戲模塊中,用戶可以通過互動游戲的方式對景泰藍的紋樣設計環(huán)節(jié)進行體驗,通過選擇不同的胎型、底紋和主紋,從而得到不同的景泰藍成品。該模塊的流程如圖8所示。
用戶首先可以選擇制作的胎型,有盤子、碗、瓶三類(具體界面如圖9),然后可以選擇底紋,提供了三種底紋——纏枝紋、祥云紋和回紋(界面如圖10)。最后選擇主紋,也有三種可以選擇——蓮花、牡丹、鶴(界面如圖11)。每一步的胎體均為三維建模,貼圖質感自然。用戶可以根據個人的喜好設計出不同的景泰藍成品,以此體會景泰藍紋樣設計的方法。
2.4 “我的”模塊
我的模塊即為用戶的個人中心,具體又分為游戲記錄、收藏、意見和幫助三個模塊。游戲記錄可以記錄每一次游戲后的成品,收藏模塊可以查看自己對名家名作內容的收藏,還可以查看本小程序的幫助文檔幫助解決使用小程序中出現的問題,用戶對本小程序的意見也可在此反饋。在意見和幫助頁面用戶可以聯系到生產商以及開發(fā)者,反饋意見和在體驗小程序時遇到的問題。
3 微信小程序的開發(fā)
小程序的開發(fā)是在微信提供的“普通小程序開發(fā)工具”中完成的。小程序開發(fā)工具運用的是一種云開發(fā)技術,云開發(fā)是云端一體化的一種后端云服務,免去了移動應用構建中煩瑣的服務器搭建和運維,無須創(chuàng)建下載安裝與卸載的環(huán)境,降低了小程序開發(fā)的門檻。
本小程序開發(fā)框架如圖15所示,分為云函數、項目文件、配置文件三部分。
云函數(cloudfunctions)是在服務端運行的函數,可以獲取項目ID和用戶ID。本小程序中涉及的收藏功能,就是運用云函數獲取微信用戶的唯一標識openid。
項目文件(miniprogram)是小程序開發(fā)主體,其中主要包括圖片文件夾、頁面文件夾和全局配置文件。圖片文件夾是存儲小程序用到的所有圖片,但由于本小程序中使用的大量圖片由于超過了小程序項目要求的2M的限制,所以將圖片分類上傳至云存儲服務器中。 pages文件夾是處理小程序中所有頁面文件,也是本次開發(fā)主要開發(fā)的部分。每一個頁面單獨一個文件夾,其中包含與頁面相同名稱的四個文件,后綴分別為.wxml、.wxss、.js、.json。其中.wxml后綴文件是頁面的布局文件,相當于網頁的html文件,負責頁面結構。.wxss文件是此頁面的樣式文件,相當于網頁的css文件,布局加上樣式文件便可以完美復刻出小程序頁面設計師畫的原型。.js文件為頁面邏輯文件,json文件為頁面配置文件。
微信小程序主體部分由app.js、app.json、app.wxss 這三個文件組成。其中app.wxss負責整個項目的公共樣式,每個頁面可通過組件屬性調用樣式規(guī)則,不同頁面的樣式共同的部分可利用公共樣式布局,從而簡化項目代碼使樣式布局更加清晰[7]。app.js文件是小程序腳本代碼,負責整個項目的公共事件邏輯處理、全局變量定義、公共方法封裝等,此頁面中組件的交互事件和功能實現都在js文件中的每一個函數中實現;app.json文件是主要負責全局配置、項目頁面組成、窗口表現、頁面切換及tab 欄表現,一般用于修改頁面標題、確定頁面大小等。
配置文件(project.config.json)一般為系統自動生成,主要是對小程序的id、路徑設置、語言檢索進行設置。
4 結束語
《匠器——景泰藍》微信小程序初步實現了用微信小程序對景泰藍工藝文化知識傳播的探索與實踐。本小程序將景泰藍文化知識的傳播、景泰藍工坊的推廣,互動小游戲融為一體,初步構建了綜合性、趣味性、互動性于一體景泰藍工藝文化傳播平臺。目前小程序還存在諸多不足,后續(xù)將持續(xù)開發(fā)建設,不斷充實內容,提高用戶交互體驗感,希望能夠為景泰藍文化的傳播與傳承貢獻微薄之力。
5 致謝
感謝北京聯合大學藝術學院吳思琪、靳鈺秋、周雨穆、司朝飛、穆維森等同學對本小程序所作出的貢獻。
參考文獻:
[1] 韋玉輝,蘇兆偉,潘夢詩.基于微信小程序的服裝個性化定制系統設計與實現[J].服裝學報,2019,4(5):460-464.
[2] 吳志攀,袁裕鎮(zhèn),趙金烽,等.基于微信小程序的DIY服裝軟件開發(fā)[J].現代計算機,2020(26):94-98,104.
[3] 司蕾,楊剛磊,劉旭,等.基于微信小程序的心語心愿系統設計[J].軟件,2020,41(9):81-83.
[4] 湯汪艷.基于用戶體驗的手工藝微信小程序設計研究[D].杭州:中國美術學院,2018.
[5] 中國網.《工藝大師App——景泰藍》榮獲講好中國故事創(chuàng)意傳播國際大賽一等獎.(2017-11-27)[2020-08-25].http://news.china.com.cn/2017-11/27/content_41950325.htm.
[6] 新民網.《榫卯》《折扇》科普傳統工藝.(2018-03-02)[2020-08-25].http://xmwb.xinmin.cn/html/2018-03/02/content_15_3.htm.
[7] 李哲,周靈.微信小程序的架構與開發(fā)淺析[J].福建電腦,2019,35(12):66-69.
【通聯編輯:謝媛媛】