基于用戶體驗的“中陽剪紙”網站設計研究

王晶 黃成剛 張成義

（青島大學紡織服裝學院，青島 266075）

在過去，對于“中陽剪紙”的宣傳與保護手段相對較為單一，而在信息智能化時代下，互聯網的出現改變了傳統的信息傳播方式，大眾可以通過上網快速了解新事物，文章基于用戶體驗的理論探索“中陽剪紙”的網站設計，將現代互聯網技術與傳統剪紙藝術充分融合，向用戶展示“中陽剪紙”魅力的同時呼吁更多的人關注剪紙文化，這對于“中陽剪紙”可持續發展和傳承具有現實意義。

1 用戶體驗概念解析

用戶體驗（User Experience，簡稱UE/UX）的概念最早是由美國用戶體驗師唐納德·諾曼在20 世紀90 年代提出來的，即用戶在使用一個特定產品、系統或服務時建立起來的純主觀心理感受[1]。簡單來說，就是用戶在實際使用某個產品過程中所產生的感受，包括心理感覺、肢體感覺，以及使用產品后用戶的感知情緒和生理反應。

2 “中陽剪紙”面臨的主要問題分析

“中陽剪紙”是流傳在山西省呂梁市中陽縣的一種民間手工藝術，歷史悠久，內涵豐富，形式多樣，是中華優秀傳統文化的組成部分。透過“中陽剪紙”，大眾可以體會到創作者對民俗生活的理解，對美好生活的追求，對思想情感的寄托，具有較高的審美與歷史文化價值。“中陽剪紙”于2006 年被國務院列入首批國家級非物質文化遺產保護名錄，2009 年被聯合國教科文組織列入世界文化遺產[2]。

隨著時代的變遷，“中陽剪紙”的傳承和發展受到了阻礙，筆者通過資料文獻查閱，實地走訪等方法，將現階段“中陽剪紙”面臨的主要問題分為以下幾點：（1）老一代傳承人逐漸減少，年輕人對剪紙藝術的興趣不高、參與不足；（2）傳統剪紙與現代市場嚴重脫節，雖然進行了相關文化創意產品的設計，例如書簽、印章、包裝袋等，但整體創新性不足，大部分都是簡單的圖案借鑒，產品沒有實用性，市場認可度較低；（3）經濟水平落后，缺乏資金支持，使得“中陽剪紙”一直處在一個相對封閉的環境[3]；（4）傳播方式單一，外界宣傳力度小，“中陽剪紙”主要靠家族相傳及口耳相傳，大部分人希望通過網絡更全面地了解“中陽剪紙”藝術[4]，但是目前沒有對應的網站。

3 基于用戶體驗的“中陽剪紙”網站設計功能

3.1 開放性

目前，“中陽剪紙”主要是通過線下活動來進行傳播，傳播范圍較窄，傳播效果不佳。而在互聯網技術的支撐下，設計基于用戶體驗的“中陽剪紙”網站，用戶可以不局限于地域、語言、文化等方面因素，通過不同的平臺及時、全面地獲取有關剪紙藝術的信息，更具開放性的同時也為用戶帶來高質量的體驗[5]。

3.2 便捷性

網站具有傳播速度快、范圍廣、內容豐富、交互性強等特點，帶給用戶更加便捷的信息獲取方式。基于用戶體驗的“中陽剪紙”網站設計，可以讓用戶隨時隨地通過互聯網訪問網站，輕松自由地了解和學習相關剪紙知識，降低時間成本。而管理人員也可以將收集到的資料及時上傳更新到網站上，快速高效地讓用戶看到。

3.3 教育性

非物質文化遺產是中華傳統文化的重要組成部分，保護和傳承非物質文化遺產是每個人的責任和義務。基于用戶體驗的“中陽剪紙”網站可以讓用戶系統直觀地了解認識“中陽剪紙”，學習剪紙手藝，并在學習過程中感受剪紙藝術的魅力，提高自身的動手能力、審美水平及創新能力，加強對“中陽剪紙”非物質文化遺產的理解與認同。

3.4 傳承性

過去，對于“中陽剪紙”的紙質作品不適合長時間保存，且容易遺漏，而基于用戶體驗的“中陽剪紙”網站可以不分時間、地點地將大量具有歷史文化價值的珍貴剪紙作品與資料上傳到網站中，進行分類整理，永久保存。此外，利用網站獨特的設計及豐富的展示，還可以讓用戶隨時隨地進行瀏覽觀看，有利于“中陽剪紙”更好地傳承、保護、延續。

4 基于用戶體驗的“中陽剪紙”網站設計原則

4.1 功能性原則

“中陽剪紙”網站的設計要具有實用性，即讓用戶一目了然地知道網站的功能，更好地向用戶傳遞“中陽剪紙”相關信息，滿足用戶上網獲取信息的需要，實現網站的易用性和易讀性。整個網站可分為用戶前端界面和管理員后臺管理界面兩大部分，用戶可以通過網址進入網頁瀏覽各個模塊，管理者可以從網站中登錄到后臺進行網站內容編輯、上傳、發布與管理。

4.2 審美性原則

網站是否符合用戶的審美需求會直接影響網站的瀏覽量[6]，因此，基于用戶體驗的“中陽剪紙”網站設計要具有美觀性，內容排版要和諧有序，有主有次，界面設計要簡潔，具有良好的可操作性，使用戶操作起來方便快捷。除此之外，應注重用戶體驗，要以多樣化的媒體形態展現“中陽剪紙”獨特的民俗藝術風格和文化內涵，使用戶在瀏覽過程中賞心悅目。

4.3 情感性原則

“中陽剪紙”網站設計不僅要滿足用戶的功能、審美需求，更重要的是以人為本，給用戶創造一種愉悅的視覺聽覺環境和閱讀享受，比如可以使用大量的剪紙作品圖片來豐富人們的視覺，講好每個作品背后的故事，觸及用戶的內心，激發用戶的情感，與觀眾產生共鳴，并通過留言互動設計，加強與用戶的情感溝通。

總的來說，“中陽剪紙”網站設計應將用戶體驗貫穿于整個設計之中，以用戶為中心，從而營造友好舒適的使用環境。

5 基于用戶體驗的“中陽剪紙”網站設計流程

用戶體驗設計是一種以用戶為中心的設計理念，要站在用戶的角度來探究什么樣的用戶體驗是更加合適友好的，基于用戶體驗的“中陽剪紙”網站設計流程主要包括用戶分析、內容架構、界面設計、技術路線、調試與發布、后期維護六大步驟，如圖1。

圖1 基于用戶體驗的網站設計流程

5.1 用戶分析

用戶是網站的使用者，在進行網站設計時要明確網站的目標用戶群體，建立“以用戶為中心”的設計理念，且要準確掌握用戶需要什么，從而更好地為用戶服務。

文章通過對不同年齡、身份、行業的人群進行問卷調查，調查的主要目的是了解大眾對“中陽剪紙”非物質文化遺產的認識和態度，共回收46 份有效問卷，根據問卷總結得知，有35.6%的人群平時會通過觀看電視或參觀展覽來了解非物質文化遺產，但是他們并不知道“中陽剪紙”，由此可見，目前“中陽剪紙”的宣傳范圍不太廣泛，宣傳效果不太明顯；有51%的人群希望通過上網了解“中陽剪紙”非物質文化遺產，這類人群年齡位于18—40 歲，他們對于上網比較熟練；有9%的人群從不會關注非物質文化遺產；有4.4%的人對于“中陽剪紙”藝術很感興趣，希望可以通過上網學習剪紙，了解傳承人資質，希望成為一名合格的傳承人。

因此，“中陽剪紙”網站主要分為四種用戶人群，如表1：（1）青年人群：這類人群好奇心強，樂于嘗試新鮮有趣的事物，具有一定的文化教育水平，因此，這類人群往往會因為學習、參觀、休閑、娛樂、社交等各種原因登陸網站獲取信息；（2）剪紙愛好者或是想成為剪紙傳承人的用戶：這類人群喜歡剪紙，平時對剪紙有一定關注度，因此他們都會多頻次使用網站，學習剪紙技藝，但由于這類人群覆蓋年齡、職業、性別、受教育程度都不相同且還有部分不擅長使用網絡的人群，因此在設計中必須重點關注此類人群的操作體驗以及如何引導他們使用；（3）“中陽剪紙”網站的后臺管理者：這類人群對“中陽剪紙”具有一定了解和認知，具有一定的文化專業性和網站使用經驗；（4）其他。

表1 “中陽剪紙”網站用戶分析

5.2 構建網站內容框架

內容架構是網站的骨架[7]。建立一個科學合理的網站結構十分重要，在設計結構時，要考慮到用戶有可能采取的每一個動作，以保證他們在使用網站時能夠快速地找到自己所要的信息。“中陽剪紙”網站采用了層級式的結構，這種結構形式更有邏輯性，便于后期管理與維護。因此，“中陽剪紙”網站從“首頁”“大師傳承”“云游展館”“新聞動態”“非物質文化遺產課堂”“聯系我們”六個模塊展開，如圖2。

圖2 “中陽剪紙”網站內容架構

“首頁”模塊首先是輪播圖，通過輪播圖的形式使信息更加靈活地出現在大眾視野中，其次是內容，通過圖片或視頻簡要介紹“中陽剪紙”的發展歷程和文化內涵；增添圖文與視頻介紹，利用視聽覺多重體驗建立起用戶對“中陽剪紙”的美好認知與形象。“大師傳承”模塊主要介紹“中陽剪紙”的傳承人及簡介，按照等級分為國家級傳承人、省級傳承人和市級傳承人，都將以圖文并茂的方式呈現出來，用戶可以通過篩選功能更加快速精確的查詢。“云游展館”模塊主要展示優秀剪紙作品，作品類別通常包括民俗、歲時節令、人生禮儀、神話傳說等[8]，題材豐富，蘊含豐富的文化內涵，此外，可以利用虛擬現實和3D 漫游技術將虛擬事物與現實剪紙展覽館完美結合，讓用戶足不出戶就能參觀剪紙展覽，具有較強的沉浸感和趣味性。“新聞動態”是反映政府針對剪紙文化所作工作的窗口，例如剪紙文化藝術節、剪紙比賽、剪紙走進課堂等活動，管理員在后臺及時更新工作動態。“非物質文化遺產課堂”主要是對剪紙工藝進行詳細講解，向大眾普及剪紙工具、剪紙程序及剪紙手法等相關知識，后臺管理員也可以發布相關培訓的通知，讓更多的人加深對“中陽剪紙”的美好認知，吸引對此感興趣的外界人士深入研究。“聯系我們”這項功能旨在加強和外界的互動及溝通。通過該項功能可向后臺管理員留言提問，發表各自觀點，管理員在這里為觀眾答疑解惑。

5.3 界面設計

5.3.1 布局設計

在設計網站時，好的布局可以使頁面內容更加清晰有序地展現出來，內容有疏有密，主次分明，讓用戶易于理解和使用。常見的網站布局一般分為以下幾種：“同”字型布局、“匡”字型布局、“呂”字型布局及自由式布局[9]。“中陽剪紙”網站布局采用了日常生活中最常見的標題正文型布局[10]，從上到下依次為頁眉、正文內容及頁腳，適當添加線條作為輔助提示，強化網頁的美感。

5.3.2 文字設計

不同的字體、字號、行距給人以不同的的視覺感受，在字號的選擇上要反復斟酌，如果字號太小就會使用戶閱讀困難，產生視覺疲勞感，因此在“中陽剪紙”網站設計中，采用了比較規整的微軟雅黑字體，導航欄上的字體加粗，使用戶一眼就能定位到具體的版塊；輪播圖中“剪紙”二字采用手寫體，與導航欄的標準字體形成對比[11]；文本周圍適當留白，使用戶在閱讀時不至于感到壓抑，下面說明性文字采用適合的行間距，提高文字可讀性。

5.3.3 色彩設計

人類的五種感官在接受外界信息時主要以視覺為主，用戶首次進入網站時，首先被吸引的就是網站的色彩，合理的配色可以大大提高用戶的興趣，給用戶帶來美的享受。在進行“中陽剪紙”網站設計時，考慮到“中陽剪紙”通常以紅紙為載體[12]，因此網站主要選取紅色為主色調，黑色為輔助色，米白色為背景色，紅色穿透力強[13]，可以給人以溫暖、興奮、熱情的視覺感受，紅黑強烈對比，刺激用戶的眼球，并能帶來獨特的視覺體驗。其中紅色的顏色值為#8C0000，黑色的顏色值為#1A0000，米白色的顏色值為#FFFCF5。

針對以上思路，設計了“中陽剪紙”網站輪播圖界面、頁尾、大師傳承界面以及云游展館界面，如圖3—圖6。

圖3 首頁輪播圖界面

圖4 “中陽剪紙”網站頁尾

圖5 大師傳承界面

圖6 云游展館界面

5.4 技術路線的支持

根據以上界面設計，“中陽剪紙”網站開發需要采用的基層語言有HTML5、CSS3、JavaScript。HTML（Hyper Text Markup Language，超文本標記語言）是用來描述網頁的一種標記語言，用于網頁結構的搭建，與HTML4 相比，HTML5 增加了很多非常實用的新功能和新特性，它支持多媒體元素，開發成本低，具備強大的兼容性及良好的跨平臺性能，能提供更快、更簡便的服務，增強用戶體驗。CSS（Cascading Style Sheets，層疊樣式表）主要是用于控制網頁在瀏覽器中的顯示樣式，如文字大小、顏色、字體加粗等，CSS3 是CSS2 的升級版本，新增了許多樣式，且遵循模塊化開發，提高了代碼執行效率。JavaScript 是一種具有函數優先的輕量級，解釋型或及時編譯型的編程語言[14]，用于實現網頁上的各種動態交互效果，例如鼠標懸停時彈出下拉菜單、活動倒計時、圖片輪播等。

此外，為了確保網站與不同移動應用設備呈現適配效果，因此在“中陽剪紙”網站的設計中應當采用響應式設計，以適應不同設備的屏幕尺寸。響應式網頁設計（Responsive Web Design），是伊桑·馬卡特（Ethan Marcotte）在2010 年提出的[15]，是指網頁的內容和布局根據用戶行為以及設備屏幕的尺寸、分辨率等進行相應的響應和調整，保證在設備上很好的呈現出來。響應式網頁設計的實現，讓用戶在使用過程中感覺體驗流暢，并且不用因為不同設備導致頁面顯示不完整的問題而困擾，用戶的使用需求和視覺需求都能得到更好的響應。在響應式設計中，可以采用彈性布局[16]，不對網頁的寬度作任何設定，使網頁內容的位置彈性化，使之能夠在不同尺寸的硬件設備上自適應的顯示，實現自動調整位置并最終進行效果展示。

5.5 調試與發布

在此階段應對“中陽剪紙”網站進行可用性測試，包括導航測試、內容測試、圖形測試及整體界面測試，細致觀察測試者的行為并進行相關評估與分析總結，這是網站設計非常重要的環節，用于檢驗設計的合理性，所有問題都解決之后，就可以發布網站。

5.6 后期維護

在“中陽剪紙”網站上線后，首先需要定期實時更新網站內容，上傳新動態，或者新增功能以及網頁特效，這樣才能保證網站生命力；其次，網站需要定期安全檢測，檢查代碼，以免遇到漏洞，影響用戶體驗；最后，推廣網站也是后期必須要做的一項工作，它可以幫助“中陽剪紙”網站拓展更多用戶。

6 結論

文章為非物質文化遺產“中陽剪紙”在現代互聯網領域中的可持續傳播填補了空白，為基于用戶體驗的傳統文化相關網站設計提供了較為重要的參考。有效地宣傳了“中陽剪紙”，并促使用戶更加全面地了解“中陽剪紙”，使“中陽剪紙”被更多的人所喜歡。與前人的研究成果進行比較，文章創新點在于將“互聯網+”與“中陽剪紙”非物質文化遺產進行了創新性融合，在原有傳統傳播手段的基礎上將“中陽剪紙”非物質文化遺產與現代網頁的優勢相結合，拓展更寬的傳播路徑和更為廣泛的空間，以實現“中陽剪紙”非物質文化遺產的更好傳承與更高階段性的發展，具有較好的實用價值。目前研究還存在一些問題，比如用戶人群調研問卷數量較少，未能全面考慮不同用戶的個性化需求，具有一定局限性，在網站代碼書寫、后臺數據庫搭建等相關技術的實現上也存在問題，因此，在后續的研究中需要增加用戶調研，全面深入研究用戶需求，在技術實現上，學習使用HTML5、CSS3、JavaScript開發語言，搭建響應式網站，從而真正實現“中陽剪紙”網站的上線。