助力蘇州常熟紅色遺址的數字化微場景開發

蘇州常熟地區紅色遺址資源豐富，當前以場館建設和書籍出版為主要宣傳途徑。現以該地區1921—1949年的紅色資源為抓手，借助HTML5技術具備的離線存儲、跨平臺互動等強大的功能優勢，以淡彩水墨的手繪風格開展常熟地區紅色遺址數字化微場景的開發工作，并對其進行簡單的闡述。

常熟地區紅色資源的展示與傳播現狀

常熟地區紅色資源傳播現狀

蘇州常熟北瀕長江，與南通市隔江相望。該地區是中國共產黨早期開展革命活動的區域之一，有著豐富的紅色文化資源，自1926年建立黨組織以來，現存各類紅色革命遺址35個，位居蘇州市第一，常熟范圍內登記在冊的常熟籍革命先烈共有1055人。

近年來，常熟市委員會黨史工作辦公室在地方黨史領域進行了深入挖掘和研究，主要從書籍出版、場館建設、網絡媒體三個方面開展。其中，書籍出版以個人傳記和革命斗爭史為主，如《任天石傳》《歲月崢嶸——常熟百位革命人物事跡選編》等；場館建設以“中共常熟黨史館”為主陣地；網絡媒體以時事新聞為主，并沒有著重介紹常熟地區詳細革命歷史的平臺。

重點打造的遺址類場館在青年中的知曉度如何？帶著這樣的疑問，筆者一方面對沙家浜革命歷史紀念館、常熟革命烈士陵園、江抗東路活動舊址、古里十八抗日烈士墓等遺址遺跡進行實地調研；另一方面對年輕群體發放在線問卷調查。本次調查共回收有效問卷112份，74.11%的人員年齡集中在18—25歲，46歲以上的人員僅占調查的5.36%。經過調研后得知，只有29.46%的人表示知道遺址遺跡的相關歷史，37.5%的人去過線下展館，9.82%的人覺得沒有興趣，55.36%的人認為對紅色文化資源的接觸途徑不多，在“您更傾向于通過哪種方式來進行蘇州常熟黨史的學習？”這一項中，有76.79%的調查對象更傾向于通過網絡獲取知識，從而總結出以場館建設為主要宣傳手段沒有達到常熟預期宣傳目標的結論。

常熟地區紅色資源數字化開發的價值

俗話說：“不懂歷史的人沒有根，淡忘歷史的民族沒有魂。”時代在發展，我們要重視學習歷史經驗和汲取歷史教訓。翻開中國近代發展史，其中最深刻的一篇就是這個曾經落后、飽受帝國主義欺凌以及作為半殖民地半封建社會的國家，如何在中國共產黨的領導下一步步走向繁榮昌盛的故事。

常熟地區的紅色文化極為豐富，歷史上的血戰沙家浜事件動人心魄，孕育出了以“堅定不移的理想信念，堅韌不拔的奮斗精神，堅不可摧的魚水情深，堅貞不渝的清廉品質”為核心內涵的沙家浜革命精神。一代代革命先輩的意志在傳承中凝聚成了一股股精神力量，這種寶貴的精神財富需要我們不斷弘揚和傳承。

當前，宣傳紅色遺址的形式和內容有很多，但側重于蘇州地區尤其是常熟地區的介紹卻有所缺乏。通過對調查數據進行分析可以了解到，大眾對常熟地區的紅色資源雖然了解不多，但很感興趣，大眾希望能利用碎片化時間，通過豐富有趣的可視化信息系統性地了解常熟地區的革命史。

常熟地區紅色資源數字化開發的路徑

開發紅色資源的數字化技術

隨著數字化技術的發展，網絡傳播方式越來越多樣化，H5是HTML5（Hyper Text Markup Language 5，超文本標記語言第五版）的簡稱，是國際中立性技術標準W3C（萬維網聯盟）制定的網頁技術標準。現在的web網頁基本都是按照HTML5來進行規范的，它將Web網頁帶入了一個成熟的應用平臺，該平臺對視頻、音頻、圖像、動畫以及與設備的交互都進行了規范。由于H5具備強大的便捷式交互技術，其被廣泛應用于創意展現、產品展示與推廣等具有交互功能的微場景中，現在市場上通常把H5直接解釋為具有互動效果的展示頁面，更有人將其理解為手機上的PPT。本文所指的H5就是把常熟地區紅色資源開發成具有交互功能、圖片精美、內容詳細的微場景，并能通過多渠道、跨媒體對該微場景進行瀏覽，提高年輕人對常熟地區紅色資源的興趣。

H5技術展示常熟地區紅色資源的優勢

1.離線存儲功能增強了紅色資源應用的廣泛性

隨著互聯網的快速發展，H5技術特有的離線存儲功能使其不再局限于單一的資源應用，而是成為具有跨平臺功能的展示平臺，且其具有開發成本低、調試方便、更新自由、便于攜帶、不易損壞、不易丟失等優點，從而傳播范圍更廣，傳播速度更快，信息的傳達也更為直觀。將蘇州常熟地區悠久的紅色歷史和H5技術相結合，通過信息可視化設計提高群眾對紅色文化的興趣，加深用戶對黨史的了解，發揚前輩們英勇不屈的精神。

2.跨平臺技術增強傳播紅色資源的便捷性

H5作為21世紀互聯網的核心技術之一，有著極強的便捷性，其能夠更好地適應移動端設備，豐富了用戶對紅色文化的學習途徑，不論用戶使用任何移動端設備，都能夠在上面利用H5技術進行學習。H5技術新的解析規則增強了靈活性以及增加了一些新屬性，淘汰了過時的屬性，更加貼合用戶的使用習慣，拓寬了用戶的使用范圍。讓大眾在各個時間、地點都能方便、快捷地使用移動端進行瀏覽，打破了紅色文化學習方式的局限性，提高了群眾對黨的認知。

3.強大的互動功能提升紅色資源學習的趣味性

利用H5技術不僅能擴大流量，也能增加視頻、動畫等的設計應用，豐富人們的視覺感受，并以第一視角的交互方式呈現出來，使參與者從被動變為主動，實現用戶對信息的主動選擇。同時，H5技術將信息與圖形生動形象地有機融合起來，使傳達的信息更加有趣，從而提升用戶體驗，提高用戶黏性。通過信息可視化設計提高群眾對黨史的興趣，提高用戶對黨的認知和了解，把前輩們英勇不屈的精神發揚光大。項目以H5技術為載體設計常熟地區紅色資源的可視化數字場景，可以實現多渠道、多媒體、跨平臺的任意終端訪問。

常熟地區紅色資源數字化微場景開發實踐

作品的設計理念

綜上所述，蘇州常熟地區革命歷史資料的數字化展示采用H5技術，圍繞常熟地區紅色資源，抓住數字化展示特點，以革命烈士、紅色遺址為主要內容，面向青少年介紹、宣傳H5紅色文化微場景。畫面以淺綠色為基本色調，灰藍和深黃作點綴，汲取了中國傳統水墨畫中淡彩的顏色變化，營造出豐富的畫面層次，體現出安靜、治愈的氛圍，凸顯了常熟地區悠久的歷史以及人民群眾向往的和平安寧的生活。

在動態交互設計方面，以操作的流暢性、便捷性、明確的指引性和良好的體驗感為目標，運用點擊、滑動、插入關鍵幀動畫等步驟改變元素屬性來銜接作品頁面，應用H5技術制作動態效果，使作品具有良好的觀賞性，增強觀者的體驗感。

作品的架構設計

常熟地區紅色資源的數字化展示主要分為三個層級，其中，遺址遺跡和英雄烈士模塊是重點展示內容。

第一層級。對常熟紅色歷史主要地區進行分類，如古里、虞山、尚湖、沙家浜、支塘等，將常熟重點紅色地區的代表性建筑運用手繪的形式制作交互圖標，按照實際地圖的位置進行擺放，點擊后可選擇遺址遺跡或英雄烈士界面。

第二層級。在一級背景地圖上可選擇遺址遺跡和英雄烈士界面，這兩種界面都按照地域分類。通過手繪場景的形式排列遺址遺跡，觀者點擊場景上的圖標即可直接進入第三層級。英雄烈士采用剪影的方式排列放置，點擊后顯示英雄烈士的黑白照片，在查看此英雄烈士后右上方會出現勛章圖標，代表此英雄烈士已了解完畢，避免重復進入，方便大眾閱覽時不會錯過對每位英雄烈士的了解。

第三層級。主要采用信息可視化的分類布局方式，詳細介紹了英雄烈士的生平和遺址遺跡背后的故事。

場景設計與角色設計

首頁的設計。借鑒傳統水墨山水畫的手法來繪制常熟地區的地形地貌，在背景中凸顯五個重點地區的遺址遺跡，隨后呈現出贊美常熟地區的相關詩詞、書法。

第二層級下的“英雄烈士”是本項目中較為重要的一個模塊，這部分的設計最初嘗試以手繪的方式來繪制英雄烈士頭像，但由于能查找到的英雄烈士遺容照片僅有寥寥幾張，文字資料也僅有只言片語，很難通過手繪的方式將英雄烈士們當年的英姿展現出來。經過反復思考，最后搜集了一批抗日戰爭時期英雄烈士的照片，他們既是中國千萬革命先烈的縮影，也代表著常熟地區的革命先烈，采用人物剪影與“梅蘭竹菊”元素相結合的方式，通過這些傳統感物喻志的植物象征英雄先烈們的高潔品格。

圖標設計

圖標的設計主要采用深黃色、紅棕色為主色調，突出了紅色歷史的沉重感，也增加了畫面整體的層次感。背景的淺色加上圖標的深色，使整個畫面既有歷史底蘊，又營造出安寧的氛圍，體現出革命烈士們的偉大。為避免整體畫面過于暗沉，將每頁的返回圖標設置成太陽圖案，既為畫面增加了一抹亮色，也暗示著革命道路似紅日一般光明。

首頁圖標的設計嘗試了最初戰斗時的沙包、機槍、坦克、砍刀、戰斗機等豐富的元素，并在不斷調試后最終決定采用當地的代表性建筑來繪制首頁圖標。首頁圖標設計采用較為寫實的手法，顏色明度較低，采用熟褐、赭石、朱紅、土黃等紅系色調及黃系色調，以凸顯歷史的沉重感，猶如革命英雄們的精神豐碑一般，即使經歷了時間的洗禮，依然巍然屹立，巋然不動。

“英雄烈士”界面圖標采用勛章元素進行設計。銹跡斑斑的勛章突出了其歷史感，也體現了其背后革命烈士英勇無畏的榮耀歷程。

頁面排版設計

以數字化技術為依托的沉浸式藝術首要的美學特征是沉浸感，而沉浸式藝術所創造的沉浸感則主要依托其所營造的“意境”。“以史為鑒，可知興替。”讓觀者在一種自然輕松的氛圍中客觀地了解那段崢嶸歲月。作品在排版上大量運用留白的手法，減少了歷史所帶來的沉重感。在整個項目的排版過程中，以常熟地區地貌圖為主線橫向排版，使整個背景完全覆蓋畫面，提高版面利用率。

首頁將常熟主要紅色地區總結為五個板塊：支塘、古里、尚湖、沙家浜、虞山。在山頂和山腳處設置了英雄烈士和遺址遺跡總覽圖，既有對重點區域的精準介紹，又有整體介紹的入口，便于用戶查找。

第二層級界面的排版主要采用卷軸的展現形式，通過時間線來分類介紹人物的主要事跡。卷軸的兩個軸心安排在首尾處，起到折回視線的作用，可以使瀏覽者將瀏覽的重心放到畫像及內容上。從右往左排列文字的方式更加貼合傳統書信的形式，使畫面更加莊重。段落之間采用線條間隔，開頭處做了顏色的調整，以保證瀏覽者正確的閱讀順序。同級別的頁面采用了相同的組合方式，以保持閱讀的流暢性。

第三層級的“遺址遺跡”與“英雄烈士”界面內容相似，繪制手法和排版陳列方式一致。界面背景為淺綠色，滿鋪常熟各地區代表性建筑剪影暗紋，并且使用手繪山丘及祥云紋樣進行修飾，左側標題框采用不規則形狀，使頁面更加活潑，用層巒疊嶂的山峰作點綴，使界面更加精致。

在“遺址遺跡”模塊下，“建制改革”“戰斗簡況”等頁面內容繁雜，因此采用條理分明的分類布局法，理清時間、事件與人物等眾多信息。如在“建制改革”模塊中選擇歷史中比較重要的兩個組織的建制改革——沙家浜部隊和沙家浜連進行詳細設計。在設計中借鑒了基因組合形式，一個交合代表一個時間點。用兩種不同的顏色分別代表兩個組織，在視覺上既對相鄰的兩塊內容做了區分，也對間隔較大的相同顏色內容進行了歸類統一。同時還運用中心對稱結構，統一文字處于離中心較近的邊緣線，使畫面具有整齊感（如圖4）。最后，作品選取了《革命的理想》作為背景音樂，以期給用戶帶來更好的體驗。

研究不足

作品通過H5技術基本呈現出常熟地區紅色遺址遺跡微場景，實現信息可視化，內容清晰、明了。但由于研究水平、人員配置及客觀條件的限制，常熟地區紅色資源數字化微場景只是初步展示了紅色遺址遺跡中的主要人物、事件等，詳盡的內容還需要進一步挖掘，微場景的建設需要更多的技術力量作補充，展示的方式也需要進一步優化。

本文系江蘇省高職院校專業帶頭人高端研修項目（2020GRFX077）；江蘇高校哲學社會科學研究項目“‘長三角一體化’戰略下提升江蘇文化軟實力的策略研究”（2019SJA1318）；江蘇省職業教育技藝技能傳承創新平臺“江蘇省職業教育吳羅織造技藝技能傳承創新平臺”階段性成果。

（作者單位：蘇州工業園區服務外包職業學院）