吳雙 鄧鑫 董石羽

摘要：從用戶體驗(yàn)要素的角度分析用戶需求，探究校園協(xié)作類APP的亮點(diǎn)功能和界面的視覺(jué)表現(xiàn)。以用戶體驗(yàn)要素的五個(gè)層面為理論工具，將戰(zhàn)略層中的用戶細(xì)分、問(wèn)卷調(diào)查、用戶訪談作為調(diào)研切入點(diǎn)，探討以用戶體驗(yàn)要素為基礎(chǔ)的校園協(xié)作類APP界面的設(shè)計(jì)原則。將用戶體驗(yàn)要素與校園協(xié)作的關(guān)系以APP交互界面設(shè)計(jì)的形式呈現(xiàn)出來(lái)，從而完成設(shè)計(jì)的概念性開發(fā)。以用戶體驗(yàn)要素為出發(fā)點(diǎn)的校園協(xié)作類APP界面設(shè)計(jì)，能夠在用戶協(xié)作過(guò)程中起引導(dǎo)作用，并為以用戶體驗(yàn)要素為背景的校園協(xié)作產(chǎn)品在提高合作效率，準(zhǔn)確查找目標(biāo)隊(duì)友或信息等需求的解決方式提供參考依據(jù)。

關(guān)鍵詞：用戶體驗(yàn)要素校園協(xié)作APP界面設(shè)計(jì)交互設(shè)計(jì)

中圖分類號(hào)：TP311

文獻(xiàn)標(biāo)識(shí)碼：A

文章編號(hào)：1003-0069（2021）02-0045-03

引言

當(dāng)今社會(huì)人們正處于一個(gè)信息和網(wǎng)絡(luò)飛速發(fā)展的互聯(lián)網(wǎng)時(shí)代，隨著智能手機(jī)和平板電腦等移動(dòng)端深入到學(xué)生群體學(xué)習(xí)和生活的各個(gè)方面，也為相關(guān)校園類APP的開發(fā)與設(shè)計(jì)創(chuàng)造了條件。用戶體驗(yàn)的重要性也逐步向用戶更加注重使用過(guò)程中的便捷性和交互性等方面體現(xiàn)。同時(shí)，教育部在《關(guān)于加快建設(shè)高水平本科教育全面提高人才培養(yǎng)能力的意見(jiàn)》【1】中明確指出：鼓勵(lì)學(xué)生通過(guò)參加社會(huì)實(shí)踐、科學(xué)研究、創(chuàng)新創(chuàng)業(yè)、競(jìng)賽活動(dòng)等獲得學(xué)分。團(tuán)隊(duì)協(xié)作相關(guān)項(xiàng)目及比賽已經(jīng)完全滲透到校園課程中，要使高校學(xué)生所參加團(tuán)體活動(dòng)中的比賽或課程合作達(dá)到最高效率，就應(yīng)規(guī)范管理其合作內(nèi)容，并運(yùn)用用戶體驗(yàn)要素支撐其內(nèi)容呈現(xiàn)方式。

一、用戶體驗(yàn)要素的概述

（一）用戶體驗(yàn)

用戶體驗(yàn)（UserExperience，UE/UX）一詞由用戶體驗(yàn)設(shè)計(jì)師

唐納德諾曼在20世紀(jì)90年代中期提出并推廣，是用戶在操作和使用產(chǎn)品或服務(wù)過(guò)程中的動(dòng)作、思考及感悟，其包括由產(chǎn)品和服務(wù)提供給用戶的理性價(jià)值和感性體驗(yàn)【2】。用戶體驗(yàn)關(guān)注產(chǎn)品與外界和功能交互的方式，即人在“使用”過(guò)程中與產(chǎn)品產(chǎn)生聯(lián)系并形成合理且系統(tǒng)的整體。

（二）用戶體驗(yàn)要素的五個(gè)層面

用戶體驗(yàn)具有一個(gè)自下而上的層級(jí)體系，依次為戰(zhàn)略層、范圍層、結(jié)構(gòu)層、框架層和表現(xiàn)層。基于現(xiàn)有基礎(chǔ)總結(jié)出適用于APP結(jié)構(gòu)的要素模型，如圖1所示。每層之間的聯(lián)系由下一相鄰層來(lái)確定，例如表現(xiàn)層由框架層決定，框架層受結(jié)構(gòu)層影響，以此類推。

1.戰(zhàn)略層：戰(zhàn)略層對(duì)產(chǎn)品總體導(dǎo)向的進(jìn)行控制，用戶體驗(yàn)過(guò)程中每項(xiàng)展開都基于該層級(jí)的工作，并涉及產(chǎn)品目標(biāo)與用戶需求定義【3】，產(chǎn)品目標(biāo)是指用戶想通過(guò)產(chǎn)品獲得什么，即產(chǎn)品需要滿足某項(xiàng)功能才能達(dá)到某種目的;用戶需求則從用戶細(xì)分和用戶研究?jī)煞矫媲腥搿?/p>

在戰(zhàn)略層制訂過(guò)程中，強(qiáng)調(diào)清晰而準(zhǔn)確的定位。在產(chǎn)品目標(biāo)方面，以明確的定義引導(dǎo)整個(gè)產(chǎn)品的方向。在用戶需求方面，由于用戶背景的差異，不同用戶對(duì)于不同類型的產(chǎn)品功能和界面風(fēng)格的體驗(yàn)要求有所不同。在用戶需求分析過(guò)程中，通過(guò)用戶細(xì)分的方法，將大量的用戶需求歸為幾個(gè)可管理的部分【4】，同時(shí)，用戶研究借助問(wèn)卷調(diào)研和用戶訪談。為范圍層中產(chǎn)品的內(nèi)容和功能提供依據(jù)。

2.范圍層：范圍層定義產(chǎn)品、系統(tǒng)或服務(wù)的功能及描述內(nèi)容需求的形式，包括產(chǎn)品的內(nèi)容需求和功能規(guī)格4。內(nèi)容需求是決定產(chǎn)品中需要操作支持的內(nèi)容信息，如校園協(xié)作類APP的核心是大學(xué)生協(xié)作的項(xiàng)目?jī)?nèi)容，這些內(nèi)容不能憑空設(shè)計(jì)，是產(chǎn)品對(duì)內(nèi)容的需求。功能規(guī)格指產(chǎn)品中所包含的功能和流程，是將戰(zhàn)略層中對(duì)用戶需求的描述落實(shí)到具體的功能上，進(jìn)而將其實(shí)現(xiàn)。范圍層根據(jù)戰(zhàn)略層中的需求進(jìn)一步探索產(chǎn)品的特定功能，以便將其從早期的概念轉(zhuǎn)換為特定的功能集合。

從戰(zhàn)略層到范圍層，是從“為什么”到“要做什么”的轉(zhuǎn)變。在確定功能需求之后，范圍層制定功能規(guī)范，并添加更具體的實(shí)現(xiàn)細(xì)節(jié)。在此期間，內(nèi)容需求伴隨功能，其規(guī)模和質(zhì)量對(duì)后期產(chǎn)品的用戶體驗(yàn)成果產(chǎn)生極大影響。

3.結(jié)構(gòu)層：結(jié)構(gòu)層分為兩個(gè)方面：交互設(shè)計(jì)和信息架構(gòu)。確定產(chǎn)品的核心功能后，進(jìn)入搭建產(chǎn)品信息架構(gòu)的過(guò)程，并在此基礎(chǔ)上進(jìn)行交互設(shè)計(jì)，它們的關(guān)注點(diǎn)是理解用戶和用戶的思考及思維方式。業(yè)務(wù)流程圖和操作流程圖通常為該階段產(chǎn)物。

4.框架層：框架層是基于結(jié)構(gòu)層交互設(shè)計(jì)的整體原型設(shè)計(jì)階段，包括界面設(shè)計(jì)、導(dǎo)航設(shè)計(jì)和信息設(shè)計(jì)。其作用是對(duì)頁(yè)面的空間進(jìn)行合理的分割設(shè)計(jì)，目的是通過(guò)這些設(shè)計(jì)元素優(yōu)化設(shè)置，提高交互體驗(yàn)，方便用戶使用和操作，從而提高用戶對(duì)信息的理解?？蚣苡山缑嬖O(shè)計(jì)決定;導(dǎo)航設(shè)計(jì)用于呈現(xiàn)信息的界面形式;信息設(shè)計(jì)旨在提供有效的信息交流。

5.表現(xiàn)層：表現(xiàn)層的作用是展示產(chǎn)品的最終視覺(jué)設(shè)計(jì)方面。是基于框架層并用于補(bǔ)償框架層中邏輯排列的視覺(jué)呈現(xiàn)，是結(jié)構(gòu)、內(nèi)容、功能性和美學(xué)的結(jié)合，同時(shí)以最終的視覺(jué)設(shè)計(jì)將其他四個(gè)層級(jí)中的需求和目標(biāo)整合在一起。表現(xiàn)層的工作內(nèi)容實(shí)質(zhì)為感知設(shè)計(jì)。

二、目標(biāo)用戶研究

基于上述用戶體驗(yàn)要素的理論基礎(chǔ)，由用戶操作而呈現(xiàn)的移動(dòng)應(yīng)用，首要關(guān)注的是準(zhǔn)確定位用戶與目標(biāo)【5】。在此類APP的設(shè)計(jì)計(jì)劃中，以在校大學(xué)生為主要目標(biāo)用戶，老師在團(tuán)隊(duì)協(xié)作中充當(dāng)輔導(dǎo)角色，為相關(guān)目標(biāo)用戶。用戶體驗(yàn)的核心是用戶，關(guān)鍵在于關(guān)注用戶的需求，并根據(jù)用戶需求進(jìn)行設(shè)計(jì)【6】。

（一）用戶需求一戰(zhàn)略層內(nèi)容

目標(biāo)用戶的確定和對(duì)產(chǎn)品的需求是用戶體驗(yàn)要素中戰(zhàn)略層的一部分，在戰(zhàn)略層中則選取用戶細(xì)分和用戶研究?jī)蓚€(gè)方法來(lái)提取用戶需求。

1.用戶細(xì)分：用戶細(xì)分是依據(jù)用戶的差異性特征，把用戶需求劃分為不同可管理的部分，如圖2所示。用戶細(xì)分方法之間的根本區(qū)別在于細(xì)分維度7，目前移動(dòng)用戶細(xì)分方法，用戶特征通常被用作細(xì)分模型的基本維度。用戶特征可分為三類：人口統(tǒng)計(jì)學(xué)特征、行為特征、心理特征。人口統(tǒng)計(jì)學(xué)特征包含用戶顯示的外部特征，如年齡、職業(yè)、性別、地域等8;行為特征描述用戶特定的購(gòu)買行為，例如購(gòu)買次數(shù)、購(gòu)買量等;心理特征不僅反映用戶的行為，而且包括興趣、愛(ài)好和態(tài)度，如消費(fèi)模式、自我評(píng)價(jià)等【9】。

本文主要以校園使用背景為依托，根據(jù)用戶的人口統(tǒng)計(jì)學(xué)特征和心理特征對(duì)用戶種類進(jìn)行劃分。將學(xué)生用戶以大一至研三七個(gè)年級(jí)進(jìn)行劃分，對(duì)各專業(yè)類型學(xué)生的課程項(xiàng)目和合作特征進(jìn)行總結(jié)。將老師用戶以各大類專業(yè)類型進(jìn)行劃分，總結(jié)老師輔導(dǎo)在團(tuán)隊(duì)合作中發(fā)揮的作用。細(xì)分出兩類用戶的類型，如圖3所示：

學(xué)生群體在此階段的主要需求為規(guī)劃合作項(xiàng)目，尋找合作隊(duì)友，獲得老師指導(dǎo)，掌握進(jìn)度和掌握大賽動(dòng)態(tài)。

老師用戶在輔導(dǎo)過(guò)程中的主要工作為對(duì)項(xiàng)目信息的接收、整理和輸出。該類工作偏向于對(duì)信息的及時(shí)性和對(duì)內(nèi)容完整性的獲知，注重信息的傳遞快速性和內(nèi)容易解讀性。老師群體在該階段有規(guī)劃項(xiàng)目方向、推薦比賽項(xiàng)目的需求，掌握學(xué)生進(jìn)度并傳達(dá)指導(dǎo)意見(jiàn)，同時(shí)指導(dǎo)多個(gè)項(xiàng)目合作團(tuán)隊(duì)和協(xié)調(diào)工作。

2.用戶調(diào)查：通過(guò)具體的調(diào)研方法，對(duì)前期階段需求進(jìn)行驗(yàn)證并挖掘潛在的用戶需求，該階段采用問(wèn)卷調(diào)研和用戶訪談的方式得出用戶細(xì)分階段未發(fā)掘的需求。

（1）問(wèn)卷調(diào)研及分析：?jiǎn)柧硗ㄟ^(guò)網(wǎng)絡(luò)途徑發(fā)放給學(xué)生群體，共發(fā)放問(wèn)卷400份，回收387份。并對(duì)問(wèn)卷結(jié)果進(jìn)行初步分析。調(diào)查對(duì)象涉及高校各個(gè)年級(jí)，其中男生人數(shù)159人，女生人數(shù)228人，參與調(diào)研的人群中大四和研一的學(xué)生最多，分別為88人和100人，合作頻率集中在3～5次和5～8次，這與課程內(nèi)容和年級(jí)學(xué)習(xí)任務(wù)特征有關(guān)。

如表1所示，大多數(shù)大學(xué)生希望在協(xié)作過(guò)程中能夠了解隊(duì)友的能力和評(píng)分和項(xiàng)目經(jīng)驗(yàn)。

（2）用戶訪談分析：訪談結(jié)果集中在高校學(xué)生在校園協(xié)作過(guò)程中需要尋找并了解隊(duì)友，制訂明確的計(jì)劃和合理的分工，及時(shí)掌握合作進(jìn)度并能和各方進(jìn)行有效交流;老師的角色與期望則是為學(xué)生提供方向性指導(dǎo)，及時(shí)了解學(xué)生協(xié)作情況并傳達(dá)指導(dǎo)信息，同時(shí)規(guī)劃各階段的指導(dǎo)項(xiàng)目。

通過(guò)問(wèn)卷調(diào)研和用戶訪談，得出相關(guān)痛點(diǎn)。并結(jié)合用戶細(xì)分部分的需求，總結(jié)出核心目標(biāo)用戶和相關(guān)目標(biāo)用戶的需求。

3.用戶行為：通過(guò)用戶細(xì)分對(duì)比和前期調(diào)研，總結(jié)學(xué)生和老師兩類用戶行為的流程，為后續(xù)表現(xiàn)層設(shè)計(jì)提供體驗(yàn)流程的邏輯依據(jù)。如圖4所示。

學(xué)生用戶執(zhí)行三個(gè)目的過(guò)程中的步驟則為前期用戶調(diào)研中的痛點(diǎn)，根據(jù)“制訂計(jì)劃”、“邀請(qǐng)合作”和“老師修改意見(jiàn)”等痛點(diǎn)確定APP學(xué)生端的主要功能。

老師用戶的目的行為中，APP要幫助老師解決的方面有及時(shí)跟進(jìn)任務(wù)、推薦的信息如何被學(xué)生獲知和輔導(dǎo)過(guò)程中如何及時(shí)做出修改以及和學(xué)生有效的交流。

本節(jié)在研究目標(biāo)用戶的過(guò)程中，運(yùn)用戰(zhàn)略層中對(duì)用戶需求的分析，通過(guò)用戶細(xì)分到用戶研究的遞進(jìn)方法總結(jié)出符合用戶在校園項(xiàng)目協(xié)作過(guò)程中的行為，并挖掘痛點(diǎn)和機(jī)會(huì)點(diǎn)，為后文中實(shí)際方案的設(shè)計(jì)提供范圍層和結(jié)構(gòu)層的依據(jù)，同時(shí)也影響了表現(xiàn)層的設(shè)計(jì)方向。

三、基于用戶體驗(yàn)要素的APP設(shè)計(jì)

體驗(yàn)分為感官的、行為的和反思的3個(gè)層次，用戶對(duì)產(chǎn)品的體驗(yàn)從第一層次的感官到第三層次的反思存在遞進(jìn)關(guān)系【10】。產(chǎn)品所展現(xiàn)的第一印象即直覺(jué)體驗(yàn)，屬于用戶體驗(yàn)設(shè)計(jì)要素中表現(xiàn)層的內(nèi)容。產(chǎn)品使用過(guò)程中帶來(lái)的感受稱為過(guò)程體驗(yàn)，其對(duì)應(yīng)于用戶體驗(yàn)要素中的結(jié)構(gòu)層和框架層，通過(guò)用戶與產(chǎn)品之間的交互過(guò)程實(shí)現(xiàn)。用戶在使用產(chǎn)品后所回憶起的使用過(guò)程感受稱為經(jīng)歷體驗(yàn)，是用戶體驗(yàn)要素中范圍層所涉及到的內(nèi)容。

（一）設(shè)計(jì)定位

以在校大學(xué)生及輔導(dǎo)老師為用戶，解決高校團(tuán)隊(duì)合作過(guò)程中尋找隊(duì)友、了解信息等問(wèn)題，同時(shí)能清晰傳達(dá)各個(gè)功能的作用和意圖，以便提高效率。

1.功能定位一范圍層內(nèi)容：以前期用戶調(diào)研中的用戶需求為基礎(chǔ)，確定校園協(xié)作類APP主要功能定位在解決團(tuán)隊(duì)項(xiàng)目合作規(guī)劃問(wèn)題、隊(duì)員查找問(wèn)題、獲取項(xiàng)目信息問(wèn)題、老師輔導(dǎo)問(wèn)題等。APP的主要功能內(nèi)容涉及四個(gè)方面：項(xiàng)目，發(fā)現(xiàn)，消息，我的。通過(guò)卡片分析法測(cè)試總結(jié)出，“項(xiàng)目”用于解決項(xiàng)目合作中的所有問(wèn)題，是主要核心內(nèi)容，其他三個(gè)功能的內(nèi)容都以“項(xiàng)目”展開，四個(gè)主要功能以界面底端tab的方式呈現(xiàn)。

2.信息框架一結(jié)構(gòu)層內(nèi)容：根據(jù)用戶使用習(xí)慣和前期調(diào)研確定的主要功能優(yōu)先級(jí)順序，得出結(jié)構(gòu)層大致內(nèi)容。如圖5所示，“項(xiàng)目”通過(guò)新建比賽項(xiàng)目，輸入比賽鏈接自動(dòng)生成項(xiàng)目進(jìn)程。進(jìn)行列表中可以查看正在合作中的比賽及詳細(xì)文件，人員分工，成員合作進(jìn)度等內(nèi)容。

“發(fā)現(xiàn)”通過(guò)搜索欄搜索比賽信息、正在尋找隊(duì)友的隊(duì)伍和求組隊(duì)的隊(duì)員信息。同時(shí)也可以在發(fā)現(xiàn)頁(yè)中查看和取消已發(fā)布的招募。

“消息”分為群組消息和個(gè)人消息，均可用于接收組隊(duì)申請(qǐng)或發(fā)送組隊(duì)邀請(qǐng)，此外群組消息還可根據(jù)隊(duì)內(nèi)成員共同時(shí)間，完成通知的功能。

“我的”展現(xiàn)用戶項(xiàng)目合作中的相關(guān)信息，其中課表可導(dǎo)入教務(wù)系統(tǒng)課程同時(shí)還可以查看隊(duì)員對(duì)用戶進(jìn)行的評(píng)價(jià)和進(jìn)行實(shí)名制認(rèn)證等。

（二）界面設(shè)計(jì)

高保真交互界面設(shè)計(jì)一表現(xiàn)層內(nèi)容

1.項(xiàng)目：如圖6所示，項(xiàng)目查看頁(yè)面可以實(shí)時(shí)查看正在進(jìn)行的項(xiàng)目，新建項(xiàng)目時(shí)會(huì)自動(dòng)根據(jù)項(xiàng)目需求生成該項(xiàng)目每個(gè)階段的時(shí)間節(jié)點(diǎn)，便于后續(xù)合作過(guò)程中時(shí)間的分配和任務(wù)的分工。創(chuàng)建比賽項(xiàng)目，可根據(jù)比賽日程添加階段性任務(wù)并編輯成員分工。項(xiàng)目詳情以瀑布流的形式呈現(xiàn)，便于實(shí)時(shí)掌握信息動(dòng)態(tài)及查看進(jìn)度，同時(shí)每段實(shí)時(shí)消息下方設(shè)置“@”和“已讀”功能，快速告知和了解隊(duì)友消息接收進(jìn)度，便于提高項(xiàng)目合作效率。人員分工界面以表格排版的形式展現(xiàn)，用于組內(nèi)多人交流與任務(wù)進(jìn)程對(duì)比。

2.發(fā)現(xiàn)：發(fā)現(xiàn)界面可以搜索和查找比賽和正在組隊(duì)的隊(duì)伍以及發(fā)布招募信息，如圖7所示。比賽卡片頁(yè)面可以查看到老師推薦的比賽，用于學(xué)生項(xiàng)目篩選;以“舉手”的形式表示學(xué)生參加意向，用師生互動(dòng)的交互形態(tài)連接兩類用戶，為后續(xù)師生之間請(qǐng)教交流和組隊(duì)提供條件。

3.消息：從高效合作的觀點(diǎn)出發(fā)，消息界面規(guī)避生活中雜亂的社交信息，信息發(fā)布過(guò)程中會(huì)呈現(xiàn)隊(duì)員共同空閑時(shí)間，以此作為組長(zhǎng)發(fā)布任務(wù)時(shí)間的參考，便于隊(duì)內(nèi)組員時(shí)間協(xié)調(diào)和規(guī)劃階段性任務(wù)。如圖8所示。

4.我的：如圖9所示，“我的”界面是對(duì)用戶個(gè)人資料和合作信息的整合，包括用戶項(xiàng)目信息及個(gè)人偏好信息的設(shè)置等。其中登錄頁(yè)面中可以對(duì)用戶身份進(jìn)行選擇，也可進(jìn)入“我的”界面對(duì)老師或?qū)W生身份進(jìn)行認(rèn)證。同時(shí)導(dǎo)入課表后系統(tǒng)可以自動(dòng)生成隊(duì)內(nèi)成員共同時(shí)間，以色塊形式呈現(xiàn)，更為醒目，從而便于時(shí)間規(guī)劃和行程編輯。

結(jié)語(yǔ)

本文通過(guò)對(duì)用戶體驗(yàn)要素五個(gè)層級(jí)的理解，以及對(duì)用戶需求和行為的分析，得出校園協(xié)作類APP的設(shè)計(jì)定位和功能定義，同時(shí)將用戶體驗(yàn)要素的理念融入到APP界面設(shè)計(jì)中，使其在解決功能需求的基礎(chǔ)上更加關(guān)注用戶的情感和體驗(yàn)，讓界面交互與用戶之間產(chǎn)生更多的感性化聯(lián)系。增添校園活動(dòng)的趣味性，連接各類用戶促進(jìn)合作，豐富合作過(guò)程的體驗(yàn)感，提高合作效率。

參考文獻(xiàn)

【1】中華人民共和國(guó)教育部.教育部關(guān)于加快建設(shè)高水平本科教育全面提高人才培養(yǎng)能力的意見(jiàn)【EB/OL.ttp：//www.moe.gov.cn/srcsite/A08/s7056/201810/t20181017_351887html.2018;

[2] Lucas Daniel. Understanding user experience [J] . Web Techniques，2000，5（8）：42-43.

【3】陳燁面向用戶體驗(yàn)的網(wǎng)頁(yè)界面優(yōu)化設(shè)計(jì)方法研究【D】.重慶：重慶大學(xué)，2010.

【4】JesseJamesGarrett.范曉燕譯，用戶體驗(yàn)要素【M】.北京.機(jī)械工業(yè)出版社，2011：41.

【5】童芳.“口袋博物館”的用戶體驗(yàn)要素設(shè)計(jì)【J】.南京藝術(shù)學(xué)院學(xué)報(bào)（美術(shù)與設(shè)計(jì)），2016（03）：126-133

【6】蘭玉琪，劉湃.基于用戶體驗(yàn)的交互產(chǎn)品情感化研究【J】.包裝工程，2019，40（12）：23-28.

【7】劉英姿，吳昊.客戶細(xì)分方法研究綜述【J】管理工程學(xué)報(bào)，2006，20（1）：53-57.

[8] HUGHES A. Strategic Database Marketing：The Master Plan for Starting and Managing a Profitable Customer- based Marketing Program[ M] . NewYork：McGraw-Hill Professional，1994.

[9] ANTHONY B F.Systematic Life Styles for New Product Segmentation [J] . Journal of the Academy of Marketing Science，1982，10（4）：381- 391

【10】唐納德：諾曼.付秋芳，程進(jìn)三，譯：情感化設(shè)計(jì)【M】.北京：電子工業(yè)出版社，2005.