【摘 要】手機(jī)等移動(dòng)智能終端的廣泛應(yīng)用和互聯(lián)網(wǎng)的迅猛發(fā)展，已經(jīng)深深地影響了人們的生活方式以及人與人之間的交流方式；同時(shí)，快速發(fā)展的數(shù)碼界面領(lǐng)域也受到了諸多設(shè)計(jì)公司的重視，但是能夠適應(yīng)市場(chǎng)需求的UI設(shè)計(jì)師卻很少。國(guó)內(nèi)高等院校很少有獨(dú)立設(shè)置該專業(yè)的，也并未提出系統(tǒng)的專業(yè)課程培養(yǎng)體系。本文則基于工業(yè)設(shè)計(jì)專業(yè)應(yīng)用型人才的培養(yǎng)目標(biāo)，以用戶研究、交互設(shè)計(jì)以及視覺(jué)設(shè)計(jì)三部分為主，構(gòu)建了適用于該專業(yè)的UI設(shè)計(jì)課程教學(xué)體系，并以實(shí)際教學(xué)案例進(jìn)行成果驗(yàn)證。

【關(guān)鍵詞】工業(yè)設(shè)計(jì) UI課程群 應(yīng)用型

【中圖分類號(hào)】G642 【文獻(xiàn)標(biāo)識(shí)碼】A 【文章編號(hào)】1674-4810（2015）24-0064-03

界，界分、界限、范圍、界說(shuō)、境域、境界。界面，兩物體之間的接觸面——《高級(jí)漢語(yǔ)大辭典》。從人機(jī)交互方面出發(fā)，UI（User Interface）即用戶界面，是人與機(jī)器（計(jì)算機(jī)）之間傳遞和交換信息的媒介，是用戶和系統(tǒng)進(jìn)行雙向信息交互的支持軟件、硬件以及方法的集合①。好的UI設(shè)計(jì)可以給人以美的享受，可以使人機(jī)交互更加便捷、舒適，軟件操作方便易行。

一 UI設(shè)計(jì)及其教學(xué)現(xiàn)狀

UI設(shè)計(jì)是指對(duì)軟件的人機(jī)交互、操作邏輯、界面美觀的整體設(shè)計(jì)。UI設(shè)計(jì)主要分為三大部分，用戶研究、人機(jī)交互和視覺(jué)設(shè)計(jì)。用戶研究著眼于用戶的心理狀態(tài)、操作習(xí)慣以及審美愛(ài)好，主要研究方法包括調(diào)查問(wèn)卷、深度訪談和數(shù)據(jù)分析等，是UI設(shè)計(jì)中至關(guān)重要的部分；人機(jī)交互是研究用戶與界面之間的操作關(guān)系，主要任務(wù)是結(jié)合操作規(guī)范確定信息架構(gòu)，設(shè)計(jì)信息交互模型，進(jìn)行紙上原型繪制；視覺(jué)設(shè)計(jì)主要是在設(shè)計(jì)美學(xué)的基礎(chǔ)上針對(duì)軟件產(chǎn)品的外形元素進(jìn)行設(shè)計(jì)。從事該行業(yè)的設(shè)計(jì)師大部分是設(shè)計(jì)專業(yè)的學(xué)生，如工業(yè)設(shè)計(jì)、藝術(shù)設(shè)計(jì)以及數(shù)碼設(shè)計(jì)等。

據(jù)國(guó)家信息產(chǎn)業(yè)部最近頒布的調(diào)查材料顯示，當(dāng)前國(guó)內(nèi)達(dá)到UI設(shè)計(jì)師專業(yè)水平者只有8000人，而市場(chǎng)需求目前最少有15萬(wàn)人的缺口?？梢哉f(shuō)有產(chǎn)品的地方就需要專業(yè)UI設(shè)計(jì)師②?？梢?jiàn)，UI設(shè)計(jì)師是現(xiàn)今數(shù)碼時(shí)代的高薪領(lǐng)導(dǎo)者，同時(shí)也是畢業(yè)生夢(mèng)寐以求的就業(yè)通道；然而，國(guó)內(nèi)很少有本科院校獨(dú)立設(shè)置該專業(yè)，市面上可自學(xué)的UI書(shū)籍內(nèi)容較淺（PS制作內(nèi)容居多），導(dǎo)致很多設(shè)計(jì)師只能在沒(méi)有系統(tǒng)知識(shí)結(jié)構(gòu)的基礎(chǔ)上自己摸索，很大程度上限制了UI的發(fā)展。

二 UI課程體系研究

基于UI設(shè)計(jì)的三大部分——用戶研究、交互設(shè)計(jì)和視覺(jué)設(shè)計(jì)，UI課程群體系將相對(duì)應(yīng)設(shè)置以下教學(xué)內(nèi)容：

圖1 UI課程群體系

1.用戶研究

用戶研究階段主要包括三個(gè)方向的教學(xué)內(nèi)容，分別為人機(jī)工程學(xué)、認(rèn)知心理學(xué)和用戶調(diào)研。人機(jī)工程學(xué)是把人—機(jī)—環(huán)境系統(tǒng)作為研究的基本對(duì)象，運(yùn)用生理學(xué)、心理學(xué)和其他有關(guān)學(xué)科知識(shí)，根據(jù)人和機(jī)器的條件和特點(diǎn)，合理分配人和機(jī)器承擔(dān)的操作職能，并使之相互適應(yīng)，從而為人創(chuàng)造出舒適和安全的工作環(huán)境，使工效達(dá)到最優(yōu)的一門綜合性學(xué)科③。認(rèn)知心理學(xué)主要是研究用戶本體對(duì)認(rèn)知信息的再加工，包括信息接收、編碼、儲(chǔ)存、操作、提取和使用的過(guò)程，對(duì)界面設(shè)計(jì)中的信息架構(gòu)有著指導(dǎo)性的作用。用戶調(diào)研主要有以下幾種形式，參觀、用戶訪談、問(wèn)卷調(diào)查、專題討論、現(xiàn)場(chǎng)觀察和訪談、跟蹤調(diào)查、查詢資料等④；是用戶研究最常用的數(shù)據(jù)提取方法，包括如何設(shè)計(jì)問(wèn)卷、如何進(jìn)行訪談以及數(shù)據(jù)統(tǒng)計(jì)分析。

2.交互設(shè)計(jì)

交互設(shè)計(jì)主要分為界面Demo信息架構(gòu)和流程圖原型繪制，主要培養(yǎng)學(xué)生對(duì)于龐大數(shù)據(jù)信息的分析、整理能力，如何進(jìn)行信息主次類別關(guān)聯(lián)，并能夠重新界定軟件需求，進(jìn)而快捷地呈現(xiàn)用戶所需信息，如引導(dǎo)頁(yè)、導(dǎo)航區(qū)和功能操作區(qū)的設(shè)置等。

3.視覺(jué)設(shè)計(jì)

視覺(jué)設(shè)計(jì)是UI設(shè)計(jì)中最具表現(xiàn)力的環(huán)節(jié)，也是多數(shù)工業(yè)設(shè)計(jì)專業(yè)學(xué)生從事UI行業(yè)的首要任務(wù)；該部分著重培養(yǎng)學(xué)生的設(shè)計(jì)美學(xué)素養(yǎng)、圖標(biāo)icon繪制能力以及高保真原型圖的制作能力，具體教學(xué)內(nèi)容分為四大部分，基礎(chǔ)、專題、實(shí)踐及應(yīng)用部分（如圖2）。

圖2 UI視覺(jué)設(shè)計(jì)教學(xué)內(nèi)容

在基礎(chǔ)部分中，主要是針對(duì)如何區(qū)別界面設(shè)計(jì)的品質(zhì)優(yōu)劣，UI設(shè)計(jì)準(zhǔn)則以及原型制作所使用的軟件工具進(jìn)行簡(jiǎn)要介紹，使學(xué)生能夠正確了解UI視覺(jué)設(shè)計(jì)的整個(gè)步驟和過(guò)程。專題部分主要是針對(duì)UI視覺(jué)設(shè)計(jì)過(guò)程中所需的各項(xiàng)知識(shí)進(jìn)行逐個(gè)講解；其中，著重講解三大系統(tǒng)（尤其是IOS和Android）的界面特點(diǎn)以及各系統(tǒng)的設(shè)計(jì)規(guī)范，避免學(xué)生在設(shè)計(jì)版面信息時(shí)出現(xiàn)系統(tǒng)錯(cuò)亂，如IOS和Android系統(tǒng)狀態(tài)欄、工具欄信息呈現(xiàn)方式的區(qū)別。在PS繪制icon過(guò)程中，主要針對(duì)圖層混合模式、路徑工具的加減交等進(jìn)行培訓(xùn)，就擬物化和扁平化風(fēng)格進(jìn)行實(shí)踐繪制。UI視覺(jué)設(shè)計(jì)階段一般使用專業(yè)快速原型設(shè)計(jì)軟件Axcure RP，使學(xué)生能夠簡(jiǎn)單快速表達(dá)初步的設(shè)計(jì)意圖。在應(yīng)用部分中，通過(guò)PS和Axcure的軟件結(jié)合使用，制作移動(dòng)數(shù)據(jù)端APP高保真模型，包括圖標(biāo)設(shè)計(jì)、色彩配置、交互原型以及動(dòng)畫(huà)制作等。

三 UI課程體系的教學(xué)實(shí)踐——以手機(jī)購(gòu)物APP為例

1.設(shè)計(jì)說(shuō)明

該軟件是基于IOS系統(tǒng)的一種既安全又便捷的同城超市手機(jī)購(gòu)物APP——愛(ài)購(gòu)。作為同城超市的一個(gè)信息交易平臺(tái)，愛(ài)購(gòu)向用戶提供各種優(yōu)惠活動(dòng)以及產(chǎn)品分類信息。愛(ài)購(gòu)采用簡(jiǎn)約的搜索引擎，能夠快速呈現(xiàn)所需產(chǎn)品在各超市中的詳細(xì)信息，方便用戶進(jìn)行價(jià)格和其他方面的比較。愛(ài)購(gòu)的配送方式遵循就近原則，很短時(shí)間便會(huì)收到所購(gòu)物品，真正地實(shí)現(xiàn)：愛(ài)購(gòu)——I’ll go。

2.方案展示

該購(gòu)物APP圖標(biāo)設(shè)計(jì)（如圖3）采取手寫體“go”的變形，心形暗示隨心購(gòu)、隨意購(gòu)；主色使用紅色系#C85A5A，并配以其他輔色，整體給予用戶舒適體驗(yàn)。

此款購(gòu)物APP中的數(shù)據(jù)統(tǒng)計(jì)采用趣味曲線圖、餅形圖，并實(shí)現(xiàn)實(shí)時(shí)互動(dòng)，及時(shí)記錄相關(guān)數(shù)據(jù)，實(shí)現(xiàn)數(shù)據(jù)視覺(jué)化、統(tǒng)計(jì)實(shí)時(shí)化；其中部分界面采用多種臨時(shí)構(gòu)圖，臨時(shí)窗口顯示時(shí)，會(huì)置于當(dāng)前視圖的最頂層，其他圖像則會(huì)以黑色半透明遮罩效果顯示，使主任務(wù)和子任務(wù)能夠很好地交互使用。

該款購(gòu)物APP整體設(shè)計(jì)現(xiàn)代感強(qiáng)，版面信息氣氛輕松愉悅，且操作方便快捷，給予用戶真正自由暢快的購(gòu)物交互體驗(yàn)。

圖3 愛(ài)購(gòu)APP圖標(biāo)

四 結(jié)束語(yǔ)

UI設(shè)計(jì)課程是工業(yè)設(shè)計(jì)專業(yè)教學(xué)發(fā)展中的新領(lǐng)域，是工業(yè)設(shè)計(jì)適應(yīng)市場(chǎng)人才需求的新方向。因此，針對(duì)現(xiàn)有專業(yè)教學(xué)中的缺失與不足，應(yīng)當(dāng)逐漸建立關(guān)于UI教學(xué)課程的結(jié)構(gòu)體系；只有從根本上建立一種科學(xué)的、系統(tǒng)的、適用性更強(qiáng)的教學(xué)體系，才能真正達(dá)到工業(yè)設(shè)計(jì)專業(yè)應(yīng)用型人才培養(yǎng)的教學(xué)目標(biāo)，繼而培養(yǎng)出適應(yīng)現(xiàn)代社會(huì)所需求的創(chuàng)新型設(shè)計(jì)人才。

注 釋

①王波、呂曦.數(shù)字媒體界面藝術(shù)設(shè)計(jì)[M].重慶：西南師范大學(xué)出版社，2011