高校平面設(shè)計教學(xué)的UI設(shè)計教學(xué)思路

前言：想要寫出一篇引人入勝的文章？我們特意為您整理了高校平面設(shè)計教學(xué)的UI設(shè)計教學(xué)思路范文，希望能給你帶來靈感和參考，敬請閱讀。

摘要：互聯(lián)網(wǎng)時代，IT類產(chǎn)品的蓬勃發(fā)展成為必然趨勢，人們對于UI設(shè)計的需求不斷增長。在當(dāng)代高校的平面設(shè)計課程教學(xué)中，UI設(shè)計的優(yōu)勢逐漸顯現(xiàn)。該課程越來越受學(xué)生的歡迎，并且取得了較為良好的教學(xué)成果。該文研究當(dāng)代高校平面設(shè)計教學(xué)中的UI設(shè)計教學(xué)，分析UI設(shè)計的特點，以期為高校視覺藝術(shù)專業(yè)的進(jìn)一步發(fā)展探索新的教學(xué)思路。

關(guān)鍵詞：平面設(shè)計UI設(shè)計教學(xué)思路

UI設(shè)計的發(fā)展始于20世紀(jì)末，是一種利用IT技術(shù)深化藝術(shù)設(shè)計創(chuàng)作的新方法。近年來，隨著互聯(lián)網(wǎng)時代的來臨，社會對于UI設(shè)計的需求不斷增長。在這樣的時代背景下，UI設(shè)計教學(xué)獲得了快速發(fā)展。在互聯(lián)網(wǎng)時代，很多企業(yè)已經(jīng)發(fā)現(xiàn)通過打造線上平臺，吸引更多的流量，對于企業(yè)的營銷可產(chǎn)生重要的影響。企業(yè)能否有效轉(zhuǎn)化潛在客戶與企業(yè)在線上平臺上投入的程度密切相關(guān)，這要求企業(yè)更加注重在UI設(shè)計上的投入。隨著移動互聯(lián)網(wǎng)時代的來臨、智能手機(jī)的普及，移動終端對UI設(shè)計需求更是不可估量。

一、UI設(shè)計領(lǐng)域的現(xiàn)狀及發(fā)展趨勢

UI即英文“UserInterface”的簡寫，意指界面與用戶的關(guān)系。因此，UI設(shè)計指用戶界面設(shè)計。其不僅是單一的分割體，而且泛指人機(jī)交互、操作邏輯、界面視覺等創(chuàng)新思路[1]。主流領(lǐng)域的UI設(shè)計不僅指圖形界面視覺設(shè)計，而且包含交互體驗設(shè)計（ID）、圖形界面設(shè)計（GUI）和用戶研究設(shè)計（UE）三個方面?，F(xiàn)階段的UI設(shè)計主要依靠計算機(jī)技術(shù)，將藝術(shù)設(shè)計與IT技術(shù)融合，充分適應(yīng)了互聯(lián)網(wǎng)經(jīng)濟(jì)發(fā)展的廣泛需求。UI設(shè)計涉及的方向較為廣泛，包括視覺設(shè)計、游戲、動漫、App設(shè)計等領(lǐng)域。我國社會對UI設(shè)計的研究開始較晚，但目前已經(jīng)取得了突破性的成果。當(dāng)前，UI設(shè)計已經(jīng)被廣泛而深入地應(yīng)用于不同的生活和工作場合，為傳統(tǒng)平面設(shè)計領(lǐng)域帶來了新的活力，并逐漸發(fā)展成為一門既復(fù)合又獨立的領(lǐng)域，成為一種新的設(shè)計方法和思路。目前，UI設(shè)計已經(jīng)被廣泛地運用于當(dāng)代高校的視覺與平面設(shè)計的教學(xué)。

二、UI設(shè)計在當(dāng)代大學(xué)平面設(shè)計教學(xué)中的重要性

1.突破傳統(tǒng)藝術(shù)設(shè)計的局限性UI設(shè)計的實質(zhì)是結(jié)合計算機(jī)界面，實現(xiàn)藝術(shù)設(shè)計在載體領(lǐng)域的發(fā)展與創(chuàng)新。UI設(shè)計通過建立起良好的交互設(shè)計界面，以此給用戶帶來良好的體驗，為設(shè)計出具有更高價值的產(chǎn)品打下基礎(chǔ)。UI設(shè)計與傳統(tǒng)美術(shù)具有某些共同的屬性，不僅有助于繪畫創(chuàng)作，提高繪畫作品的商業(yè)價值，而且能通過相關(guān)軟件開展藝術(shù)創(chuàng)作，使作品與現(xiàn)代藝術(shù)進(jìn)一步有機(jī)結(jié)合，不斷引領(lǐng)藝術(shù)創(chuàng)新發(fā)展的潮流。在當(dāng)代平面設(shè)計課程教學(xué)中，教師引入UI設(shè)計，可使現(xiàn)代藝術(shù)教學(xué)理念與目前的商業(yè)模式相結(jié)合，以專業(yè)性、技術(shù)性推動平面設(shè)計領(lǐng)域的和諧發(fā)展。因此，UI設(shè)計與平面設(shè)計課程教學(xué)的有機(jī)結(jié)合，不僅促進(jìn)了藝術(shù)設(shè)計行業(yè)的發(fā)展，而且為商業(yè)創(chuàng)新提供了新的亮點[2]。

2.提升傳統(tǒng)設(shè)計作品的競爭力當(dāng)下平面設(shè)計學(xué)科的發(fā)展，在客觀上面臨越來越激烈的競爭。當(dāng)代視覺設(shè)計專業(yè)的發(fā)展，主要驅(qū)動力源于日益增長的商業(yè)實際需求。當(dāng)代藝術(shù)設(shè)計教學(xué)已經(jīng)把ui設(shè)計教學(xué)納入日常的教學(xué)內(nèi)容，并以此進(jìn)一步提高作品本身的附加值。UI設(shè)計的作品在經(jīng)過IT專業(yè)技術(shù)的后期處理后，其價值和競爭力將被進(jìn)一步提升。此外，UI設(shè)計的作品價值還表現(xiàn)在充分性、廣泛性等維度上，將其應(yīng)用于互聯(lián)網(wǎng)產(chǎn)品設(shè)計、移動終端的界面，能夠?qū)θ藗冃纬奢^強(qiáng)的視覺沖擊。

3.促進(jìn)當(dāng)代平面設(shè)計的多樣化發(fā)展目前，平面設(shè)計學(xué)科表現(xiàn)出多樣的發(fā)展方向。手機(jī)等終端產(chǎn)品的界面交互設(shè)計發(fā)展，不僅體現(xiàn)在外觀設(shè)計層面，而且體現(xiàn)在互聯(lián)網(wǎng)展現(xiàn)方式層面，其發(fā)展特征也是平面設(shè)計學(xué)科不斷突破、創(chuàng)新的成果。基于此，高校把UI設(shè)計教學(xué)引入傳統(tǒng)平面設(shè)計課程教學(xué)，可以更好地幫助學(xué)生理解設(shè)計理念和設(shè)計方法。

4.引導(dǎo)學(xué)生在藝術(shù)設(shè)計領(lǐng)域的全面發(fā)展UI設(shè)計不僅僅是描點畫邊，設(shè)計師還必須具備完備的知識體系。優(yōu)秀的現(xiàn)代設(shè)計師不僅要具備專業(yè)的審美能力、繪畫能力、設(shè)計能力，而且必須具有一定的行業(yè)領(lǐng)悟能力。由于UI設(shè)計更注重操作性、專業(yè)性，將其應(yīng)用于教學(xué)可以幫助學(xué)生拓展知識面，使學(xué)生能夠更好地向滿足社會實際需要的方向發(fā)展。當(dāng)前，在設(shè)計行業(yè)中，實踐能力十分重要。學(xué)生只有進(jìn)一步鍛煉實際操作能力，將理論知識應(yīng)用于實踐，才能提升綜合素質(zhì)。當(dāng)前，藝術(shù)設(shè)計專業(yè)教學(xué)必須注重對UI設(shè)計的實際應(yīng)用，進(jìn)一步提升實際教學(xué)效果，積極改革授課方式，帶動教師、學(xué)生行業(yè)能力的提升。應(yīng)用UI設(shè)計為教學(xué)改革的抓手，可以很好促進(jìn)現(xiàn)代藝術(shù)設(shè)計課程的發(fā)展，幫助學(xué)生更好地滿足社會的需要。

三、高校平面設(shè)計教學(xué)中UI設(shè)計課程的關(guān)注點

相比于游戲原畫設(shè)計、建筑設(shè)計、工業(yè)設(shè)計等傳統(tǒng)平面設(shè)計，UI設(shè)計對設(shè)計師的手繪美術(shù)基礎(chǔ)的要求相對較低。在UI設(shè)計中，手繪美術(shù)通常用于繪制圖標(biāo)時的打稿。利用手繪稿開展前期設(shè)計往往會更加方便，而且由于UI設(shè)計的載體媒介依賴于手機(jī)或電腦等終端產(chǎn)品，設(shè)計素材也源于互聯(lián)網(wǎng)，在理論上設(shè)計師能搜集到的資源是無限的。同時，UI設(shè)計的更新迭代更加迅速，采集信息也更加方便。

1.UI設(shè)計教學(xué)中的設(shè)計規(guī)范當(dāng)前，UI設(shè)計的應(yīng)用主要建立在移動設(shè)備操作系統(tǒng)的基礎(chǔ)上。因此，學(xué)生首先必須掌握移動設(shè)備操作系統(tǒng)的設(shè)計規(guī)范與設(shè)計原則。當(dāng)前，移動設(shè)備操作系統(tǒng)都有自己的設(shè)計規(guī)范，從界面尺寸到圖標(biāo)尺寸、從系統(tǒng)字體到UI控件、從切片輸出到標(biāo)注適配、從手勢交互到界面動效等，學(xué)生必須熟練掌握。完善的產(chǎn)品界面解決方案由四大元素組成，分別是內(nèi)容視圖、控件、欄以及臨時視圖。因此，對設(shè)計規(guī)范的掌握對于學(xué)生學(xué)習(xí)UI設(shè)計具有重要的意義。

2.UI設(shè)計教學(xué)中的表現(xiàn)方式以往平面設(shè)計的表現(xiàn)形式多為靜止?fàn)顟B(tài)的模式，而UI設(shè)計擁有更多的表現(xiàn)形式，因此，其在觀感上更加活躍，視覺沖擊力更強(qiáng)。同時，UI設(shè)計以引導(dǎo)用戶操作為主，以動帶靜，具有較強(qiáng)的交互性。在UI設(shè)計中，設(shè)計師需要盡可能多地把重要元素表現(xiàn)在較為顯眼的位置，設(shè)計的視覺焦點受到顯示屏的大小影響，在效果完整性上存在一定局限。而且UI設(shè)計后期要求較高，高度依賴網(wǎng)絡(luò)覆蓋信號等的支持，后臺程序和服務(wù)器也必須實時在線響應(yīng)。

3.UI設(shè)計教學(xué)的關(guān)鍵要點以往的平面設(shè)計教學(xué)往往更加關(guān)注設(shè)計完成的展示效果，重視設(shè)計表現(xiàn)，如哪些文字、版式、色彩、圖形能提升用戶的關(guān)注度，能夠吸引目標(biāo)用戶群體，引導(dǎo)用戶消費，較為注重用戶對設(shè)計的體驗感。相比之下，UI設(shè)計對用戶體驗的關(guān)注逐漸提升到思考人類行為層面的研究。因此，UI設(shè)計教學(xué)關(guān)注的不僅是設(shè)計作品本身，而且涉及消費者心理學(xué)、人機(jī)交互等領(lǐng)域的知識，其關(guān)注面更加寬廣[3]。

4.UI設(shè)計教學(xué)中須掌握的IT軟件技術(shù)UI設(shè)計在本質(zhì)上是基于IT技術(shù)開展的設(shè)計，IT技術(shù)需要與設(shè)計、創(chuàng)意有機(jī)結(jié)合，才能設(shè)計出更有創(chuàng)新價值的作品。因此，相關(guān)設(shè)計軟件的教學(xué)是UI設(shè)計教學(xué)重要的前置環(huán)節(jié)。當(dāng)前，平面設(shè)計人員需要熟練使用的軟件有CorelDRAW、Photoshop等設(shè)計軟件，而對于UI設(shè)計而言，設(shè)計人員往往還要掌握Html5、CSS、JS等編程語言與平臺工具。因此，相比于平面設(shè)計教學(xué)，UI設(shè)計教學(xué)對于學(xué)生而言難度更高。此外，對傳統(tǒng)工具的進(jìn)一步挖掘也是UI設(shè)計的重要手段。以UI設(shè)計中較為常用的Photoshop軟件為例，教師必須讓學(xué)生熟練掌握其中的常用功能，如鋼筆、形狀、圖層樣式、拾色器、路徑操作和文字等。

四、平面設(shè)計教學(xué)與UI設(shè)計教學(xué)的結(jié)合點

1.兩者的設(shè)計要素同宗同源平面設(shè)計與UI設(shè)計同屬于藝術(shù)設(shè)計大類，其設(shè)計基礎(chǔ)都是對圖形、色彩、文字等要素的應(yīng)用。因此，兩種設(shè)計模式都要突出產(chǎn)品自身的特性，形成強(qiáng)烈的展示效果和視覺沖擊力。在此基礎(chǔ)上，兩種設(shè)計模式在追求視覺效果時往往都會更加突出色彩的視覺沖擊力，以此深刻、傳神地表達(dá)出產(chǎn)品的特色和質(zhì)感，讓消費者更容易接受產(chǎn)品。

2.兩者的版面風(fēng)格類似無論何種設(shè)計模式都需要建立在版面設(shè)計理念的基礎(chǔ)上。平面設(shè)計與UI設(shè)計的設(shè)計訴求都是將設(shè)計基礎(chǔ)要素排列組織到版面上，運用照片、文字、插圖、符號、圖案等要素吸引用戶，達(dá)到讓用戶被主題吸引的目的。因此，版面設(shè)計是平面設(shè)計和UI設(shè)計的基礎(chǔ)。版面設(shè)計可使設(shè)計在視覺效果上更具完整性、邏輯性，其在平面設(shè)計和UI設(shè)計中都得到了普遍應(yīng)用。3.兩者的創(chuàng)意設(shè)計思維類似藝術(shù)設(shè)計的靈魂就是源源不絕的創(chuàng)新創(chuàng)意，其本質(zhì)是一種創(chuàng)意型思維活動。創(chuàng)造性思維在平面設(shè)計和UI設(shè)計中都具有較高的價值，在平面設(shè)計和UI設(shè)計的初期，設(shè)計者都需要利用發(fā)散性思維生成創(chuàng)意主題。因此，創(chuàng)意是設(shè)計創(chuàng)作的根本。在UI設(shè)計中，設(shè)計師在設(shè)計初期需要通過頭腦風(fēng)暴激發(fā)創(chuàng)意，從而設(shè)計出更有價值的作品。因此，雙方的創(chuàng)意思維和出發(fā)點都是一致的。

結(jié)語

經(jīng)過以上探討，從平面設(shè)計教學(xué)與UI設(shè)計教學(xué)的關(guān)注點和結(jié)合點出發(fā)可以發(fā)現(xiàn)，UI設(shè)計源于平面設(shè)計，二者都建立在傳統(tǒng)藝術(shù)設(shè)計的基礎(chǔ)上。UI設(shè)計對IT技術(shù)的要求會越來越高，設(shè)計師不僅要精通平面設(shè)計方面的軟件，而且需要掌握一些編程語言。因此，在今后的UI設(shè)計教學(xué)中，教師不僅需要關(guān)注學(xué)生設(shè)計作品的感官效果，而且要引導(dǎo)學(xué)生設(shè)身處地考慮用戶的使用感受，在設(shè)計中親身體驗，將心比心，多為用戶考慮。

參考文獻(xiàn)：

[1]蔡瑩瑩.以“人”為本的用戶界面設(shè)計流程研究[J].才智，2011（4）：35-36.

[2]孫靜雯.UI設(shè)計在現(xiàn)代藝術(shù)設(shè)計課程教學(xué)中的重要性分析[J].大眾文藝，2015（15）：195.

[3]李玉龍.青出于藍(lán)勝于藍(lán)——試論平面設(shè)計與UI設(shè)計的異同點[J].蘭州交通大學(xué)學(xué)報，2017，36（5）：30-32，59.

作者：吳楨 單位：蘇州市職業(yè)大學(xué)藝術(shù)學(xué)院