基于工業設計專業的UI課程教學模式研究

【摘 要】手機等移動智能終端的廣泛應用和互聯網的迅猛發展，已經深深地影響了人們的生活方式以及人與人之間的交流方式；同時，快速發展的數碼界面領域也受到了諸多設計公司的重視，但是能夠適應市場需求的UI設計師卻很少。國內高等院校很少有獨立設置該專業的，也并未提出系統的專業課程培養體系。本文則基于工業設計專業應用型人才的培養目標，以用戶研究、交互設計以及視覺設計三部分為主，構建了適用于該專業的UI設計課程教學體系，并以實際教學案例進行成果驗證。

【關鍵詞】工業設計 UI課程群 應用型

【中圖分類號】G642 【文獻標識碼】A 【文章編號】1674-4810（2015）24-0064-03

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

一 UI設計及其教學現狀

UI設計是指對軟件的人機交互、操作邏輯、界面美觀的整體設計。UI設計主要分為三大部分，用戶研究、人機交互和視覺設計。用戶研究著眼于用戶的心理狀態、操作習慣以及審美愛好，主要研究方法包括調查問卷、深度訪談和數據分析等，是UI設計中至關重要的部分；人機交互是研究用戶與界面之間的操作關系，主要任務是結合操作規范確定信息架構，設計信息交互模型，進行紙上原型繪制；視覺設計主要是在設計美學的基礎上針對軟件產品的外形元素進行設計。從事該行業的設計師大部分是設計專業的學生，如工業設計、藝術設計以及數碼設計等。

據國家信息產業部最近頒布的調查材料顯示，當前國內達到UI設計師專業水平者只有8000人，而市場需求目前最少有15萬人的缺口。可以說有產品的地方就需要專業UI設計師②。可見，UI設計師是現今數碼時代的高薪領導者，同時也是畢業生夢寐以求的就業通道；然而，國內很少有本科院校獨立設置該專業，市面上可自學的UI書籍內容較淺（PS制作內容居多），導致很多設計師只能在沒有系統知識結構的基礎上自己摸索，很大程度上限制了UI的發展。

二 UI課程體系研究

基于UI設計的三大部分——用戶研究、交互設計和視覺設計，UI課程群體系將相對應設置以下教學內容：

圖1 UI課程群體系

1.用戶研究

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

2.交互設計

交互設計主要分為界面Demo信息架構和流程圖原型繪制，主要培養學生對于龐大數據信息的分析、整理能力，如何進行信息主次類別關聯，并能夠重新界定軟件需求，進而快捷地呈現用戶所需信息，如引導頁、導航區和功能操作區的設置等。

3.視覺設計

視覺設計是UI設計中最具表現力的環節，也是多數工業設計專業學生從事UI行業的首要任務；該部分著重培養學生的設計美學素養、圖標icon繪制能力以及高保真原型圖的制作能力，具體教學內容分為四大部分，基礎、專題、實踐及應用部分（如圖2）。

圖2 UI視覺設計教學內容

在基礎部分中，主要是針對如何區別界面設計的品質優劣，UI設計準則以及原型制作所使用的軟件工具進行簡要介紹，使學生能夠正確了解UI視覺設計的整個步驟和過程。專題部分主要是針對UI視覺設計過程中所需的各項知識進行逐個講解；其中，著重講解三大系統（尤其是IOS和Android）的界面特點以及各系統的設計規范，避免學生在設計版面信息時出現系統錯亂，如IOS和Android系統狀態欄、工具欄信息呈現方式的區別。在PS繪制icon過程中，主要針對圖層混合模式、路徑工具的加減交等進行培訓，就擬物化和扁平化風格進行實踐繪制。UI視覺設計階段一般使用專業快速原型設計軟件Axcure RP，使學生能夠簡單快速表達初步的設計意圖。在應用部分中，通過PS和Axcure的軟件結合使用，制作移動數據端APP高保真模型，包括圖標設計、色彩配置、交互原型以及動畫制作等。

三 UI課程體系的教學實踐——以手機購物APP為例

1.設計說明

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

2.方案展示

該購物APP圖標設計（如圖3）采取手寫體“go”的變形，心形暗示隨心購、隨意購；主色使用紅色系#C85A5A，并配以其他輔色，整體給予用戶舒適體驗。

此款購物APP中的數據統計采用趣味曲線圖、餅形圖，并實現實時互動，及時記錄相關數據，實現數據視覺化、統計實時化；其中部分界面采用多種臨時構圖，臨時窗口顯示時，會置于當前視圖的最頂層，其他圖像則會以黑色半透明遮罩效果顯示，使主任務和子任務能夠很好地交互使用。

該款購物APP整體設計現代感強，版面信息氣氛輕松愉悅，且操作方便快捷，給予用戶真正自由暢快的購物交互體驗。

圖3 愛購APP圖標

四 結束語

UI設計課程是工業設計專業教學發展中的新領域，是工業設計適應市場人才需求的新方向。因此，針對現有專業教學中的缺失與不足，應當逐漸建立關于UI教學課程的結構體系；只有從根本上建立一種科學的、系統的、適用性更強的教學體系，才能真正達到工業設計專業應用型人才培養的教學目標，繼而培養出適應現代社會所需求的創新型設計人才。

注 釋

①王波、呂曦.數字媒體界面藝術設計[M].重慶：西南師范大學出版社，2011