楊凱

【摘 要】隨著科技的發(fā)展和人們審美意識的不斷提升，用戶對網(wǎng)站和移動界面設(shè)計水平的要求也越來越高，針對南通理工學(xué)院計算機類專業(yè)學(xué)生《界面設(shè)計》課程現(xiàn)狀及存在問題，對課程進行教學(xué)改革和研究，闡述了提升學(xué)生色彩審美能力和運用能力的重要性，在網(wǎng)頁界面設(shè)計中，色彩更是一種具有高刺激性的視覺元素，它可以表達感情，喚起情緒和引起共鳴。通過對色彩知識的深入理解和運用，為用戶提供良好的第一印象，增強視覺信息傳達功能，為提高學(xué)生界面設(shè)計整體水平奠定基礎(chǔ)。

【關(guān)鍵詞】色彩；審美；界面設(shè)計；教學(xué)研究

中圖分類號： TB47 文獻標識碼： A 文章編號： 2095-2457（2018）35-0073-002

DOI：10.19694/j.cnki.issn2095-2457.2018.35.031

Improve color aesthetics in interface design courses teaching research

YANG Kai

（Nantong Institute of Technology，Nantong Jiangsu 226000，China）

【Abstract】With the development of science and technology and the continuous improvement of people's aesthetic consciousness， users' requirements for the design level of websites and mobile interfaces are getting higher and higher. For the current situation and existing problems of the interface design of computer majors in Nantong Institute of Technology， The teaching reform and research on the curriculum expounded the importance of improving students' color aesthetic ability and application ability. In the web interface design， color is a highly stimulating visual element， which can express feelings， arouse emotions and cause resonance. Through the in-depth understanding and application of color knowledge， the user is provided with a good first impression， enhances the visual information communication function， and lays a foundation for improving the overall level of student interface design.

【Key words】Color； Aesthetics； Interface design； Teaching research

0 前言

網(wǎng)絡(luò)和智能手機已經(jīng)成為現(xiàn)代人生活中不可或缺的一部分，人們習(xí)慣借助網(wǎng)站和手機App來獲取更多的信息資訊，隨著科技的發(fā)展和日趨成熟，人們的審美水平也在不斷提升，網(wǎng)站設(shè)計師不僅僅需要掌握技術(shù)，更需要良好的審美能力和藝術(shù)修養(yǎng)才能設(shè)計出賞心悅目具有視覺沖擊力的網(wǎng)站界面。

1 課程現(xiàn)狀

《界面設(shè)計》是我院軟件工程、計算機科學(xué)與技術(shù)、數(shù)字媒體技術(shù)等工科專業(yè)開設(shè)的專業(yè)必修課，對于計算機類專業(yè)的學(xué)生，一般對學(xué)生軟件及編程語言的能力培養(yǎng)比較注重，而對于界面藝術(shù)設(shè)計能力的培養(yǎng)略顯不足，使得學(xué)生獨立設(shè)計網(wǎng)頁、移動界面的能力不夠，需要借助模板進行參考和模仿，對網(wǎng)頁界面的空間布局和色彩運用能力不強，設(shè)計出的網(wǎng)站、移動界面平淡無奇，毫無重點，缺乏設(shè)計美感，不具備一定的視覺沖擊力和亮點。根據(jù)此情況，這就要求在《界面設(shè)計》課程教學(xué)中，注重對色彩設(shè)計的原則和配色規(guī)律，色彩的情感表現(xiàn)與傳達等知識進行重點的講授和實踐，通過不同主題的課題訓(xùn)練，培養(yǎng)和提升學(xué)生色彩審美能力和對網(wǎng)頁界面的色彩運用能力。

2 教學(xué)實踐研究

（1）對于非藝術(shù)類的工科學(xué)生，在教學(xué)中安排對色彩原理、色彩構(gòu)成知識的講授是極其重要的，通過原理性知識的了解和欣賞優(yōu)秀的界面設(shè)計案例，使學(xué)生具備一定的色彩審美能力，掌握界面設(shè)計色彩設(shè)計原則和方法，運用統(tǒng)一性原則，讓色彩達到和諧統(tǒng)一，運用情感性原則，讓色彩的溫度感、重量感等滿足受眾人群的心理感受，使界面與瀏覽者獲得情感的共鳴。運用生動性原則，通過色彩色相、純度、明度、面積、肌理等方面有秩序、有規(guī)律的豐富變化，讓界面設(shè)計更加生動、吸引眼球，贏得受眾的關(guān)注。

（2）在教學(xué)過程中，學(xué)生對于色彩的原理性知識能較好的理解，但在主題性網(wǎng)站界面設(shè)計中，如何根據(jù)不同的主題來選擇和搭配色彩還不能把握得當(dāng)，學(xué)生對色彩的實際運用能力需加強，所以在課程教學(xué)中，首先需強化學(xué)生對色彩的情感認識，每一種色彩能表達不同的情感。例如紅色，作為極具醒目性和強烈感染力的色彩是熱情、喜慶、幸福的代名詞，同時它又象征著警示和危險，在色彩搭配中，作為主色也起到調(diào)和對比的作用。黃色，作為純色中明度最高，是最為陽光的色彩，象征著光明與希望、在古代是帝王的專屬色，有高貴的涵義，與紅色色系的搭配給人一種華麗、喜慶、大氣輝煌的感覺，與藍色色系的搭配能帶來一種清雅寧靜、柔和清新的效果。藍色，純凈如天空的色彩，有和平、安靜、純凈的象征意味，具有理性的特征，是極具男性感和科技感的色彩。藍色與紅、黃等色搭配得當(dāng)，能形成和諧統(tǒng)一的對比調(diào)和關(guān)系。綠色，大自然、植物的顏色，象征著生命、安全與平靜，是環(huán)保題材的主打色，和黃色搭配顯得生機盎然且清新明快，和藍色搭配給人寧靜柔和、的視覺感受。橙色，秋天收獲的顏色，是色彩中最溫暖、最具青春與活力的顏色，曾一度作為代表“fashion”的專屬色，象征著光明與快樂、活潑與勇敢。紫色，優(yōu)美、高貴的顏色，又具有神秘、孤獨的意味，淡紫色有高雅、嫵媚的感覺，作為女性題材的專屬色，深紫色則更顯沉重與莊嚴。黑色，作為無彩色，象征著力量，有時也具有罪惡的意味，黑色和白色作為百搭色，和很多色彩都能構(gòu)成較好的對比調(diào)和關(guān)系，是運用范圍很廣的顏色。白色，象征純潔、高雅，與黑色一樣，黑白的搭配作為經(jīng)典搭配，產(chǎn)生簡潔明快、樸素有力、穩(wěn)重大方的效果，是最具視覺沖擊力的色彩搭配之一。每種色彩通過加黑、加白也會帶來不同的情感效應(yīng)，在色彩搭配中需靈活運用。

其次，需引導(dǎo)學(xué)生掌握UI界面設(shè)計色彩配色策略。第一，同色系配色，這是讓人感到頁面一致且統(tǒng)一的配色方法，因為主色和輔色都在統(tǒng)一的色相上，例如整體藍色色調(diào)的設(shè)計有一種統(tǒng)一的印象，通過色彩的深淺，不同的飽和度來承載不同類型的內(nèi)容信息，比如信息內(nèi)容模塊，白色底代表用戶內(nèi)容，淺藍色底代表回復(fù)內(nèi)容，更深一點的藍色底代表可回復(fù)內(nèi)容，顏色主導(dǎo)著信息層次。第二，鄰近色配色，這是一種最為常見的配色方法，相比較同色系配色更加豐富和和諧， 組控件和文本標題的顏色可以選擇純度較高的色彩， 背景色和模塊劃分通過降低色彩飽和度來實現(xiàn)調(diào)和和統(tǒng)一。第三，點亮色配色，這是形成對比效果的配色方法，主色選擇相對沉穩(wěn)的顏色，點睛色選擇高明度、高純度與背景形成互補或?qū)Ρ鹊念伾?，起到活躍界面氛圍，形成視覺中心的作用。

再次，需結(jié)合不同主題界面設(shè)計課題，讓學(xué)生進行設(shè)計實踐，引導(dǎo)學(xué)生根據(jù)網(wǎng)站的主題進行深入分析，通過對色彩的情感認識和配色規(guī)律找到最適合的主題色彩，鍛煉和培養(yǎng)學(xué)生的分析能力和對色彩知識的運用能力。網(wǎng)頁的色彩搭配會直接影響用戶對網(wǎng)站的整體印象，所以在界面設(shè)計中要兼顧考慮不同年齡和性別的人對色彩的感受。例如科技類的網(wǎng)站可以使用灰色系、藍色系等作為主題顏色，女性手機、女性服飾等主題的網(wǎng)站界面設(shè)計，可以選擇粉色、白色、紅色、紫色等色系，代表著甜美和溫柔的女性色彩。男性運動等主題的網(wǎng)站界面設(shè)計，更多的會選擇藍色、灰黑色為主色與黃、綠色的色彩搭配，增強運動的活力和質(zhì)感，黑、灰色的襯托使黃、綠色的色彩組合具有強烈的視覺沖擊力。兒童類網(wǎng)站色彩，一般選擇色彩明快且絢麗的顏色，如紅、黃、藍、綠等高明度、高純度的色彩，搭配簡單有趣、形象可愛的圖形組合，象征著童趣與快樂。常用的配色方法主要以鄰近色和點亮色為主，根據(jù)不同的網(wǎng)站設(shè)計主題，通過一些有針對性的主題訓(xùn)練，使學(xué)生逐步掌握對網(wǎng)站色彩的選擇和色彩搭配的方法。

最后，根據(jù)“講述-設(shè)計-評價-反饋-再設(shè)計”流程，對學(xué)生所做的每一個案例及時給予評價和反饋，學(xué)生收到反饋再返回設(shè)計，使學(xué)生能較好的掌握網(wǎng)頁界面設(shè)計的方法，設(shè)計出符合大眾審美且具有視覺沖擊力和鮮明特色的界面設(shè)計。

3 結(jié)語

一個優(yōu)秀的網(wǎng)頁界面設(shè)計，必須具備良好的視覺信息傳達功能，從視覺信息傳達角度看，色彩是用戶獲取信息的第一語言，色彩設(shè)計的優(yōu)劣直接影響用戶對網(wǎng)站界面設(shè)計的整體評價。在《界面設(shè)計》課程教學(xué)中，通過加強計算機類工科學(xué)生的色彩美學(xué)藝術(shù)修養(yǎng)和不同主題的網(wǎng)站界面課題訓(xùn)練，對提升界面設(shè)計水平起到積極的推動作用，同時也為該課程的教學(xué)改革研究提供一些思路和方法。

【參考文獻】

[1]遆佳，李霽.基于視覺信息傳達的網(wǎng)頁界面設(shè)計研究.包裝工程，2017（1）.

[2]任宏偉.從用戶體驗角度分析設(shè)計教學(xué)的創(chuàng)新實踐-以界面設(shè)計課程為例.大舞臺，2015（7）.

[3]高鳳燕.界面設(shè)計課程模塊化教學(xué)體系探索與實踐.藝術(shù)與設(shè)計，2013（9）.

[4]陸培培.淺析獨立學(xué)院UI界面設(shè)計課程的教學(xué)改革.美術(shù)教育研，2015（10）.