季燁　吳劍鋒　錢美竹

關(guān)鍵詞：高校官網(wǎng) 參與式設(shè)計 用戶體驗 網(wǎng)站設(shè)計 設(shè)計研究

中圖分類號：TP393.092 文獻標識碼：A

文章編號：1003-0069（2022）01-0038-03

引言

隨著信息時代的發(fā)展，高校官網(wǎng)逐漸成為對內(nèi)信息交流，對外展示學(xué)校能力與特色的重要窗口。但有些高校官網(wǎng)建設(shè)存在著布局不合理、交互不流暢、色彩不統(tǒng)一等諸多體驗問題，給用戶使用帶來極大不便。針對這個問題，現(xiàn)有研究指出高校官網(wǎng)建設(shè)應(yīng)堅持師生的主體性，切實關(guān)注用戶訪問習(xí)慣。這個問題解決的核心就是“以用戶為中心”。參與式設(shè)計正是對這一設(shè)計方法的豐富和提升。因此本文針對參與式設(shè)計進行研究，開展高校官網(wǎng)參與式設(shè)計實踐，總結(jié)實踐經(jīng)驗，以期對官網(wǎng)參與式設(shè)計提出新思考。

一、參與式設(shè)計

（一）參與式設(shè)計概念：“參與式設(shè)計”的概念源于20世紀60年代的斯堪的納維亞半島的北歐民主化思潮，最初是為了貫徹民主原則，讓工人有權(quán)參與到設(shè)計工作系統(tǒng)的活動中。后來參與式設(shè)計從強調(diào)設(shè)計中的社會因素逐漸發(fā)展為以用戶為中心，建立在溝通、合作、分享、協(xié)調(diào)上的設(shè)計方法。在傳統(tǒng)的設(shè)計方法中，使用者只是作為訪問和回答的對象，而在參與式設(shè)計中，使用者從被動研究變?yōu)橹鲃訁⑴c。使用者扮演設(shè)計師的角色，直接參與設(shè)計活動。這意味著參與式設(shè)計模糊了設(shè)計者和使用者的關(guān)系界限，使用者不僅在爭取主動權(quán)，更是在賦予產(chǎn)品意義[5] 。目前，已有部分學(xué)者對參與式設(shè)計的應(yīng)用進行了研究。有些學(xué)者從用戶角度分析了參與式設(shè)計的方法。許曉云對兒童用戶類別進行分類，并以問卷調(diào)研獲取兒童與父母在購買兒童智能產(chǎn)品時的決策權(quán)重比，進行兒童

智能產(chǎn)品設(shè)計研究[6] 。奧萊·塞杰（Ole Sejer）等對青少年的動機和動機進行分析，提出文化歷史活動理論方法[7] 。維斯瓦夫·科佩奇（Kope W）等探討了關(guān)于老年用戶使用VR和AR等新興技術(shù)的參與式設(shè)計方案[8] 。有些學(xué)者則從不同領(lǐng)域探索了參與式設(shè)計的應(yīng)用。杜彥基于參與理念探究人、家具、環(huán)境三者關(guān)系[9] 。蕾切爾·勒克（RachaelLuck）追溯了二十世紀中葉的建筑參與式設(shè)計的歷史，提出了對建筑參與的理解[10] 。上述的研究幫我們了解了不同用戶的參與式設(shè)計需求，豐富了參與式設(shè)計使用范圍。但是鮮少有研究在具體應(yīng)用上，對參與流程的設(shè)計、設(shè)計模式的探索、參與用戶的選取以及設(shè)計過程的管理進行分析總結(jié)。

（二）高校官網(wǎng)功能與參與式設(shè)計優(yōu)勢：高校官網(wǎng)作為網(wǎng)站設(shè)計，其用戶體驗的質(zhì)量優(yōu)劣取決于該網(wǎng)站是否能滿足用戶在使用過程中的體驗需求。官網(wǎng)設(shè)計應(yīng)針對不同用戶，提供不同的服務(wù)功能，例如：（1）培養(yǎng)教育功能。高校官網(wǎng)使信息資源得以溝通，有利于教師與學(xué)生互動交流，以促進學(xué)生的成長與進步;（2）便利服務(wù)功能。高校官網(wǎng)設(shè)計應(yīng)適應(yīng)高校師生的生活學(xué)習(xí)習(xí)慣，服務(wù)學(xué)生，便利教師;（3）形象宣傳功能。高校借助互聯(lián)網(wǎng)平臺，展示學(xué)校概況、教學(xué)管理、辦學(xué)理念、科研成果、教師隊伍、校園生活等相關(guān)內(nèi)容，樹立良好的對外形象。這些功能的設(shè)計需要設(shè)計師“以用戶為中心”，提升官網(wǎng)用戶體驗。

參與式設(shè)計在高校官網(wǎng)設(shè)計中優(yōu)勢主要體現(xiàn)在以下幾個方面：

（1）從使用者角度看，師生以設(shè)計師的身份參與高校官網(wǎng)設(shè)計，有效提高網(wǎng)站的實用性;（2）以學(xué)校管理者角度而言，師生的集群智慧有利于提升官網(wǎng)信息傳遞的高效性、資源利用的有效性和辦學(xué)效益的全面性;（3）在設(shè)計領(lǐng)域角度，參與式設(shè)計為傳統(tǒng)高校官網(wǎng)設(shè)計提供一種新的方法和思路。因此本研究通過邀請某高校師生及校網(wǎng)站管理人員針對某綜合類大學(xué)高校官網(wǎng)進行設(shè)計來探索參與式設(shè)計的應(yīng)用模式。

二、高校官網(wǎng)的參與式設(shè)計研究

（一）參與式設(shè)計流程研究：用戶參與式設(shè)計的概念模型映射和流程是設(shè)計方法研究的重點。參與式設(shè)計沒有一個固定的設(shè)計模式，和嚴格的設(shè)計規(guī)程，因此研究人員需結(jié)合具體情況，制訂相應(yīng)的用戶參與式設(shè)計流程。雷迪（A Reddy）建議藥房干預(yù)系統(tǒng)參與式設(shè)計過程包括問題識別、解決方案生成、收斂、原型設(shè)計、初始評估、形成性評估。清華大學(xué)李嘉懿基于雙鉆設(shè)計模型，將互聯(lián)平臺的參與性設(shè)計流程分為發(fā)現(xiàn)（互聯(lián)平臺收集）、定義（確定優(yōu)先級）、開發(fā)（原始創(chuàng)意，評價反饋，新創(chuàng)意）、交付（可行性產(chǎn)品測試）。甘為對用戶參與式設(shè)計概念進行研究，提出汽車人機交互用戶參與式設(shè)計方法流程為用戶分析、實地研究、數(shù)據(jù)處理、參與式設(shè)計、知識獲取、評價與優(yōu)化6個步驟。綜上所述，筆者結(jié)合高校官網(wǎng)的特點將參與式設(shè)計實踐流程分為網(wǎng)站設(shè)計元素研究、需求分析、參與式設(shè)計和評價與優(yōu)化。如圖1所示。首先，通過網(wǎng)站設(shè)計元素研究歸納出不同高校官網(wǎng)的設(shè)計優(yōu)缺點;其次，通過需求分析總結(jié)高校官網(wǎng)設(shè)計要素;再次，進行參與式設(shè)計實踐，得到官網(wǎng)結(jié)構(gòu)圖、低保真原型圖、高保真原型圖三個設(shè)計產(chǎn)出。最后，通過設(shè)計評價給出改進意見來進一步優(yōu)化官網(wǎng)設(shè)計。

（二）參與對象的選擇-多方用戶的參與：高校官網(wǎng)在信息傳遞效率、資源利用效益和用戶滿意度等方面建設(shè)的都可歸根于用戶參與程度的高低。從用戶角度看，高校官網(wǎng)用戶類型可分為申請者、教師、校網(wǎng)站管理人員、學(xué)生、家長、校友、游客、媒體這七個類型。其中教師、學(xué)生和校網(wǎng)站管理人員是高校官網(wǎng)主要服務(wù)對象。高校官網(wǎng)的參與對象應(yīng)有多方用戶的參與。他們的積極參與能使他們在設(shè)計中發(fā)揮關(guān)鍵作用，并且保證參與設(shè)計高校官網(wǎng)的方法能夠有較高的使用性和可推廣性。

（三）參與模式的設(shè)計-“從我到我們”設(shè)計新模式：設(shè)計過程采取“從我到我們”模式 ，如圖2。原模式強調(diào)參與的社交化，把參與式體驗過程產(chǎn)生的設(shè)計空間看成是一個社交樞紐，通過尋找每個個體的共同點，以此加強彼此聯(lián)系。而本模式是在其基礎(chǔ)上提出的新的模式。這個模式是指成員通過個人思考形成個人思想，通過分享、討論的方式傳遞信息以形成集體思想，并在交流過程中構(gòu)建知識的過程。這個模式不僅有利于參與者信息交換，更是在構(gòu)建知識和相互學(xué)習(xí)。它為參與者創(chuàng)造了一個相互的空間，讓他們在這個空間里面探索設(shè)計的可能性。相比于原模式，本模式更強調(diào)從“個體思想”到“集體思想”的雙向互動的過程。這兩個模式的核心都是從個人（我）體驗不斷疊加構(gòu)成集體（我們）參與。

（四）設(shè)計過程的管理-真正、平等的參與決策：參與式設(shè)計過程中可設(shè)置一名組長，但是他不是作為領(lǐng)導(dǎo)者的身份存在，而是承擔解決成員糾紛、整合設(shè)計方案和推進設(shè)計流程進行的角色。弱化組長的職能以保證每一個人在參與設(shè)計時都有均等的權(quán)利。

對于部分沒有設(shè)計經(jīng)驗的參與者，為了降低他們的設(shè)計難度，設(shè)計過程中可采用模板選擇的方式或者以文字的形式來表達他們的需求和愿景。它需要參與者在觀點、知識和技能上的差異保持理解和尊重，以開放的態(tài)度來對待所有人提出的意見和想法，不對他人的設(shè)計做評價。這樣的設(shè)計模式讓每個人都能真正參與決策。

三、高校官網(wǎng)的參與式設(shè)計實踐

（一）網(wǎng)站設(shè)計元素研究：本研究借助觀察法來收集用戶對官網(wǎng)的體驗感受，以獲取用戶更多隱形需求。首先以文獻調(diào)研和與設(shè)計學(xué)院教師討論的方式，將官網(wǎng)設(shè)計的主要層次分為布局、色彩、風格、交互和內(nèi)容5個類別。然后邀請30名用戶（藝術(shù)專業(yè)學(xué)生16名、計算機專業(yè)學(xué)生8名、老師3名、網(wǎng)站管理人員3名）觀察10個能代表綜合類大學(xué)信息化建設(shè)水平的國內(nèi)外高校官網(wǎng)，包括浙江大學(xué)、南京大學(xué)、上海交通大學(xué)、復(fù)旦大學(xué)、北京大學(xué)、中國科學(xué)技術(shù)大學(xué)、清華大學(xué)、英國曼徹斯特大學(xué)、麻省理工學(xué)院、英國倫敦大學(xué)學(xué)院，并就官網(wǎng)設(shè)計的5個主要層次發(fā)表看法，指出高校官網(wǎng)在使用過程中優(yōu)缺點。

匯總優(yōu)缺點，并以頻次進行排序，選擇頻次排名前五的要素作為設(shè)計重點，整理得到高校官網(wǎng)中優(yōu)缺點總結(jié)表，如表1。括號里面的數(shù)字表示為次數(shù)。

（二）需求分析：從表1中可知，用戶對不同要素之間存在關(guān)注度差異。用戶對交互的關(guān)注度高，是因為交互部分產(chǎn)生的問題較多。交互關(guān)注的是用戶與產(chǎn)品的有效交流，不流暢交流體驗直接影響用戶使用體驗。用戶對色彩和風格方面關(guān)注度其次，是由于個人審美的不同，不同用戶表達出自己對官網(wǎng)不同的喜好。在布局和內(nèi)容方面關(guān)注度最低的原因是，布局和內(nèi)容的設(shè)計往往需要用戶進行深入分析思考才能得出結(jié)論。

用戶對官網(wǎng)優(yōu)點的看法趨向統(tǒng)一，包括：內(nèi)容分類清晰、色彩主次分明、頁面簡潔大方、有良好的交互體驗、內(nèi)容設(shè)置滿足宣傳性和實用性等。而對官網(wǎng)缺點，正好與之相反，包括布局不合理、配色不好看、設(shè)計風格有年代感、交互不流暢、內(nèi)容信息混雜等。用戶對官網(wǎng)優(yōu)缺點的看法的相對性，為后續(xù)提取設(shè)計要素提供有效參考。

根據(jù)以上分析，通過焦點小組討論將用戶反饋轉(zhuǎn)化為提升高校官網(wǎng)用戶體驗的設(shè)計要素，分別從布局、色彩、風格、交互、內(nèi)容等方面展開構(gòu)思。

（1）合理清晰的網(wǎng)站布局。網(wǎng)站布局是網(wǎng)頁設(shè)計的基礎(chǔ)，合理化的布局是功能美和形式美的有機結(jié)合?？刹捎脤倬W(wǎng)信息分類的方式梳理網(wǎng)站結(jié)構(gòu)。具體方式有：第一，減少一級欄目數(shù)量。使一級欄目盡量涵蓋所有內(nèi)容，并且欄目分類清晰。第二，整合外部網(wǎng)站。高校官網(wǎng)外部網(wǎng)站繁多，如果所有外部鏈接堆疊在一起，會對學(xué)生信息搜尋造成負擔。（2）鮮明獨特的色彩表達。網(wǎng)頁最初的視覺感受是色彩帶來的。能迅速吸引用戶注意的高校官網(wǎng)的配色應(yīng)該鮮明又個性，例如使用鮮艷明快的顏色、合理運用學(xué)校標識色等。主色與輔色之間也應(yīng)當配色協(xié)調(diào)，比例得當。（3）大氣簡潔的風格選擇。風格最能傳遞高校文化信息，是高校官網(wǎng)設(shè)計重點關(guān)注對象。可通過大氣簡潔的設(shè)計風格，配合具有學(xué)校獨特設(shè)計感的細節(jié)，豐富官網(wǎng)設(shè)計風格。（4）流暢清晰的交互運用。高校官網(wǎng)交互是用戶接受和回饋信息的互動過程，是最影響網(wǎng)站用戶體驗的部分。好的交互能提高能提高網(wǎng)站易用性和瀏覽流暢性。借助為每個操作設(shè)定期望的反饋、為錯誤的交互提供糾錯支持、網(wǎng)站鏈接指明其含義等方式提升官網(wǎng)交互體驗。（5）實用性和宣傳性結(jié)合的內(nèi)容設(shè)計。網(wǎng)站的內(nèi)容是留住用戶的關(guān)鍵。內(nèi)容的好壞對高校招生及學(xué)生的信息傳遞工作有重要影響。因此在內(nèi)容設(shè)置上應(yīng)以服務(wù)用戶為中心，針對用戶需求充實網(wǎng)站內(nèi)容。

（三）參與式設(shè)計

1.設(shè)計過程：根據(jù)上文需求分析的結(jié)論，確定本次設(shè)計要求包括：布局合理清晰、色彩鮮明而獨特、風格大氣簡潔、內(nèi)容有實用性和宣傳性等等。因為交互在靜態(tài)的網(wǎng)頁設(shè)計中難以體現(xiàn)，所以本次設(shè)計中不作考慮。

綜合類高校官網(wǎng)參與式設(shè)計三階段，如圖3所示。每個階段時長為2-3小時。

第一階段為官網(wǎng)結(jié)構(gòu)圖設(shè)計。成員根據(jù)設(shè)計要求自行繪制官網(wǎng)結(jié)構(gòu)，對各自設(shè)計進行講解后，以投票方式確定網(wǎng)站功能及其具體內(nèi)容，并進行官網(wǎng)結(jié)構(gòu)圖設(shè)計。第二階段為低保真原型圖設(shè)計。成員根據(jù)官網(wǎng)結(jié)構(gòu)圖自行設(shè)計網(wǎng)站布局，對各自設(shè)計進行講解后，以投票方式確定每塊內(nèi)容的呈現(xiàn)方式，并進行低保真原型圖設(shè)計。第三階段為高保真原型圖設(shè)計。每位成員在統(tǒng)一設(shè)計風格和設(shè)計規(guī)范后，分模塊設(shè)計頁面樣式。設(shè)計完成后，小組成員對每個模塊設(shè)計提出修改意見并優(yōu)化，再進行整合和細節(jié)調(diào)整，最終完成高保真原型圖。

每一階段設(shè)置6名參與過前期網(wǎng)站設(shè)計元素研究參與者，以此來保證參與者在參與過程中搭建好高校官網(wǎng)框架并擁有足夠多的話語權(quán)。參與式設(shè)計前兩個階段中的人員配置相同，均包括藝術(shù)專業(yè)學(xué)生、計算機專業(yè)學(xué)生、老師和網(wǎng)站管理人員，這樣的分組有利于官網(wǎng)設(shè)計滿足更多的人群需求。而第三部分的設(shè)計專業(yè)要求較高，因此參與人員均為設(shè)計專業(yè)學(xué)生。

2.設(shè)計產(chǎn)出：本文的參與式設(shè)計前三個階段，共完成了3個設(shè)計任務(wù)，得到的設(shè)計產(chǎn)出包括：官網(wǎng)結(jié)構(gòu)圖（如圖4）;低保真原型圖（如圖5）;高保真原型圖（如圖6）。

官網(wǎng)結(jié)構(gòu)圖設(shè)計主要體現(xiàn)在內(nèi)容方面。以實用性和宣傳性為出發(fā)點，成員分析討論共得到9個模塊，包括標題欄、導(dǎo)航欄、輪播圖、新聞欄目、網(wǎng)站信息、學(xué)生活動、學(xué)校數(shù)據(jù)、招生就業(yè)和其他鏈接。

低保真原型圖重點考慮布局方面。采用結(jié)構(gòu)充實緊湊的“國”字型布局、控制一級欄目數(shù)量為7個、整合外部鏈接等方式以提高網(wǎng)站可用性，合理網(wǎng)站布局。

高保真原型圖的設(shè)計重點在色彩和風格方面。選擇大家都認可的清新舒適的藍綠色作為主色，并且配合鮮艷明快的紅、橙、綠作為輔色，以滿足色彩鮮明和獨特的需求。通過移除設(shè)計中的不必要元素來簡化網(wǎng)站，并以增加可視化圖標和英文標題的方式豐富網(wǎng)站層次。

（四）設(shè)計評價：將設(shè)計出的官網(wǎng)高保真交給剩余12位參與過網(wǎng)站設(shè)計元素研究而沒參與設(shè)計的用戶進行體驗，并采用量表評價法來評價設(shè)計。滿分為5分，5個評價等級，從5分滿意到1分不滿意。評價者從布局、色彩、風格和內(nèi)容這4個方面對網(wǎng)站進行打分，并給出理由和改進意見，設(shè)計評價表，如表2。

設(shè)計總評分為3.8125分，可以看出用戶對本版設(shè)計較為滿意。在高校官網(wǎng)布局和內(nèi)容部分評分雖然較高，但是存在著部分欄目占比過大、整體內(nèi)容較少等問題;在高校官網(wǎng)色彩和風格部分，用戶評分較低，主要體現(xiàn)在配色過于突兀且占比過大、設(shè)計細節(jié)比較粗糙等方面，在后續(xù)設(shè)計中需要重點關(guān)注。

將評價結(jié)果交給參與式設(shè)計第三階段的參與者，由他們對官網(wǎng)進行再一次迭代。完善后的高保真原型圖，如圖7。

由圖所示，新版高校官網(wǎng)高保真在原版的基礎(chǔ)上進行的主要調(diào)整包括。（1）為了促進布局合理化，將各模塊占比做一定的調(diào)整，如減少實用性相對較低的其他鏈接模塊比重、增大具有宣傳性的校園風光模塊比重、將底部導(dǎo)航欄再分級等。（2）考慮到配色過于突兀的問題，降低了輔色的飽和度、加大主色在官網(wǎng)配色中的占比，使色彩在位置和比例上更加平衡。（3）針對設(shè)計細節(jié)比較粗糙的問題，通過改變“學(xué)校生活”“學(xué)校招生”等模塊呈現(xiàn)方式，優(yōu)化圖片展示和調(diào)整模塊間距等方式，讓整體設(shè)計更加具有系統(tǒng)性、大氣感。（4）就豐富網(wǎng)站宣傳性角度考慮，增加“學(xué)校人物”模塊，以突出展示學(xué)校優(yōu)秀人物。

結(jié)論

本研究從參與流程、設(shè)計模式、參與用戶以及過程管理四個方面對參與式設(shè)計進行研究，其研究成果如下：（1）將提升高校官網(wǎng)用戶體驗的參與式設(shè)計流程歸納為網(wǎng)站設(shè)計元素研究、需求分析、參與式設(shè)計、評價與優(yōu)化四個階段;（2）對參與人員進行分析;（3）提出“從我到我們”設(shè)計新模式;（4）探索參與式設(shè)計管理過程。并通過實例對提升高校官網(wǎng)參與式設(shè)計過程進行了詳細的描述。借助“從我們到我們”的參與式設(shè)計模式，從布局、色彩、風格內(nèi)容四個要素設(shè)計高校官網(wǎng)，形成高校官網(wǎng)參與式設(shè)計方案，并且通過設(shè)計評價證明其能有效提高官網(wǎng)的用戶體驗。該研究為傳統(tǒng)高校官網(wǎng)設(shè)計的用戶體驗問題提供了新的方向和思路，同時也擴大了參與式設(shè)計的應(yīng)用范圍。

3785501908288