摘要：基于中原地區(qū)視覺(jué)傳達(dá)專業(yè)UI設(shè)計(jì)教學(xué)活動(dòng)中存在的一系列問(wèn)題，專業(yè)課教師應(yīng)指導(dǎo)學(xué)生進(jìn)行課前相關(guān)理論課程的預(yù)習(xí)，通過(guò)優(yōu)化教學(xué)設(shè)計(jì)促進(jìn)課堂上的優(yōu)質(zhì)師生互動(dòng)，加強(qiáng)學(xué)生課后的設(shè)計(jì)實(shí)踐等。希望通過(guò)本文的分析能對(duì)相關(guān)研究者有所幫助，不斷提升該專業(yè)領(lǐng)域的教學(xué)效果。

關(guān)鍵詞：中原地區(qū) UI設(shè)計(jì) 教學(xué)

UI設(shè)計(jì)主要負(fù)責(zé)App、Web、H5等頁(yè)面的色彩、布局、icon、字體方面的設(shè)計(jì)工作，也叫UI視覺(jué)設(shè)計(jì)。隨著互聯(lián)網(wǎng)行業(yè)的高速發(fā)展，UI設(shè)計(jì)師崗位吸引著越來(lái)越多年輕人的目光。

處在設(shè)計(jì)前沿的UI設(shè)計(jì)領(lǐng)域，本應(yīng)該代表著最先進(jìn)的設(shè)計(jì)思想，但是，經(jīng)過(guò)在中原地區(qū)UI設(shè)計(jì)領(lǐng)域的教學(xué)實(shí)踐，發(fā)現(xiàn)該領(lǐng)域教師的教法與學(xué)生的學(xué)法存在一系列亟待改善的問(wèn)題，筆者試圖在教學(xué)中探尋解決方案。

一、UI設(shè)計(jì)的教學(xué)內(nèi)容

UI設(shè)計(jì)需要學(xué)習(xí)的內(nèi)容主要包含設(shè)計(jì)思維的培養(yǎng)和工具軟件的使用。

（一）設(shè)計(jì)思維的培養(yǎng)

設(shè)計(jì)思維的培養(yǎng)不是一朝一夕可以練成的，但是設(shè)計(jì)思維的高低將最終決定一名設(shè)計(jì)師的水準(zhǔn)。唐納德· A · 諾曼博士說(shuō)過(guò)一句經(jīng)典的話：“設(shè)計(jì)真正的挑戰(zhàn)是去發(fā)現(xiàn)終端用戶沒(méi)有得到滿足，進(jìn)而理解問(wèn)題產(chǎn)生的深層次原因，最終利用專業(yè)知識(shí)和技能去解決這些問(wèn)題，或滿足用戶的需求?！眱?yōu)秀的設(shè)計(jì)師首先是敏銳的觀察者，需要多種交叉學(xué)科與設(shè)計(jì)學(xué)知識(shí)融合的知識(shí)體系背景，面對(duì)生活的復(fù)雜性，不僅能觀察到糟糕的設(shè)計(jì)，也慢慢學(xué)會(huì)欣賞優(yōu)秀的設(shè)計(jì)。將優(yōu)秀的設(shè)計(jì)原則與優(yōu)秀的觀察能力結(jié)合起來(lái)形成設(shè)計(jì)者的多維設(shè)計(jì)思維，最終成為其強(qiáng)大的內(nèi)功心法。

（二）工具軟件的使用

UI設(shè)計(jì)主要使用PS、Sketch、AI等軟件。關(guān)于軟件的使用方法，在有些院校視覺(jué)傳達(dá)專業(yè)的教學(xué)大綱中占到總課時(shí)量的1/2。一些短期培訓(xùn)班也常常推出30天學(xué)會(huì)PS、50天學(xué)會(huì)Sketch等這類教程，主要基于純軟件工具技法的使用，同時(shí)結(jié)合一部分基礎(chǔ)實(shí)例分析。國(guó)內(nèi)常見(jiàn)的UI培訓(xùn)教材一般分為基礎(chǔ)篇、進(jìn)階篇和高階篇，同時(shí)包含創(chuàng)意手繪、平面設(shè)計(jì)基礎(chǔ)、網(wǎng)站建設(shè)、多屏界面設(shè)計(jì)和企業(yè)需求解讀等內(nèi)容。

二、UI設(shè)計(jì)教學(xué)中存在的問(wèn)題

王受之先生曾經(jīng)多次將國(guó)內(nèi)外一些學(xué)校的設(shè)計(jì)專業(yè)的教學(xué)活動(dòng)做對(duì)比。他一針見(jiàn)血地指出，國(guó)內(nèi)很多設(shè)計(jì)專業(yè)的學(xué)生習(xí)慣于教師“填鴨式”自上而下地傳授知識(shí)，學(xué)習(xí)的主動(dòng)性和能動(dòng)性較差。主要表現(xiàn)在三個(gè)方面。

第一，學(xué)生課前預(yù)習(xí)不到位。由于種種原因，一門設(shè)計(jì)類專業(yè)課程的開(kāi)展對(duì)于學(xué)生來(lái)說(shuō)，第一節(jié)課的概述部分往往是學(xué)生第一次全面了解該課程。第二，課堂上的師生互動(dòng)活動(dòng)乏力。UI設(shè)計(jì)的理論課和實(shí)踐課往往聯(lián)系不夠緊密。有些學(xué)校的視覺(jué)傳達(dá)專業(yè)將軟件課納入主干專業(yè)課程，學(xué)生忙于在有限的課時(shí)中鍛煉軟件操作技能，對(duì)理論課程的學(xué)習(xí)興趣不高。造成無(wú)論是理論課還是實(shí)踐課，師生的互動(dòng)缺乏深度和廣度。第三，學(xué)生課后的設(shè)計(jì)實(shí)踐和教師的指導(dǎo)脫節(jié)。

三、針對(duì)UI設(shè)計(jì)教學(xué)中存在問(wèn)題的解決方案

幾年的UI設(shè)計(jì)實(shí)踐和UI設(shè)計(jì)一線教學(xué)經(jīng)驗(yàn)也許仍然不能解決所有目前UI設(shè)計(jì)教學(xué)中存在的問(wèn)題，但是經(jīng)過(guò)三個(gè)學(xué)期基于新教學(xué)方案的調(diào)整和與同行的深入討論，筆者提出以下建議。

（一）專業(yè)課教師指導(dǎo)學(xué)生進(jìn)行課前相關(guān)理論課程的預(yù)習(xí)

UI設(shè)計(jì)一般開(kāi)設(shè)在第三學(xué)期，專業(yè)課教師可以從學(xué)生大一暑假期間推薦學(xué)生閱讀設(shè)計(jì)類理論書(shū)籍。例如康納德·諾曼撰寫(xiě)的《設(shè)計(jì)心理學(xué)》四部曲、原研哉撰寫(xiě)的《原研哉的設(shè)計(jì)》《設(shè)計(jì)中的設(shè)計(jì)》《RE-DESIGN 日常的21世紀(jì)》等著作。學(xué)生通過(guò)理論書(shū)籍的學(xué)習(xí)初步了解大腦感知科學(xué)原理和人的認(rèn)知層次與模型，感悟設(shè)計(jì)的意義，挖掘設(shè)計(jì)的源泉，為設(shè)計(jì)作品贏得用戶的喜愛(ài)打下良好的基礎(chǔ)。

此外，可以推薦學(xué)生閱讀《藝術(shù)三萬(wàn)年》《藝術(shù)博物館》《藝術(shù)的慰藉》等關(guān)于藝術(shù)發(fā)展歷史的書(shū)籍，以及《設(shè)計(jì)的覺(jué)醒》《設(shè)計(jì)的意義》《設(shè)計(jì)準(zhǔn)則》會(huì)對(duì)設(shè)計(jì)產(chǎn)生潛在幫助的書(shū)籍。

（二）通過(guò)優(yōu)化教學(xué)設(shè)計(jì)促進(jìn)課堂上的優(yōu)質(zhì)師生互動(dòng)

課堂教學(xué)中高效、優(yōu)質(zhì)的師生互動(dòng)技能提升學(xué)生的學(xué)習(xí)熱情，也能使教學(xué)成果最大化。

排版類的課程是UI設(shè)計(jì)的重點(diǎn)內(nèi)容之一，在進(jìn)行排版設(shè)計(jì)部分，教師可提前推薦學(xué)生在課中（不是課堂上）閱讀《版式設(shè)計(jì)從入門到精通》《設(shè)計(jì)元素》《商業(yè)設(shè)計(jì)三劍客》《西文字體》等書(shū)籍。因?yàn)樵O(shè)計(jì)的呈現(xiàn)最終還是落到每個(gè)頁(yè)面、每個(gè)點(diǎn)，甚至每條線。在課堂上，教師可以將學(xué)生分組，利用更多的實(shí)際案例激勵(lì)學(xué)生參與討論和作品分析，可以模擬普通用戶說(shuō)出對(duì)某些界面設(shè)計(jì)的體驗(yàn)和改善建議。改變以往教師教授、學(xué)生被動(dòng)接受的現(xiàn)狀。

軟件的基礎(chǔ)操作部分完全可以讓學(xué)生留到課外進(jìn)行學(xué)習(xí)。課堂上，教師不必從一些基礎(chǔ)的菜單和工具如何使用教起。而應(yīng)該將教學(xué)重點(diǎn)放在針對(duì)某些設(shè)計(jì)需求和效果達(dá)成進(jìn)行教學(xué)設(shè)計(jì)。教師的角色不能一直是教，更重要的是如何使學(xué)生主動(dòng)思考，在此階段的教學(xué)中提出一些有專題性質(zhì)的問(wèn)題。

在這些專題性質(zhì)的討論中，學(xué)生的經(jīng)驗(yàn)常常帶來(lái)思想的火花。例如在討論“使設(shè)計(jì)元素看起來(lái)更清晰”的專題中，學(xué)生給出了如下解決方案：第一，在某些元素周圍使用“多個(gè)陰影”或非常微妙的邊框（陰影要比實(shí)際陰影深一點(diǎn)），以使這些元素顯得更清晰，并注意避免出現(xiàn)很臟的陰影。第二，確保陰影始終僅來(lái)自一個(gè)光源。第三，巧妙使用留白。好的留白可以產(chǎn)生一些負(fù)空間，適度地使用可以產(chǎn)生類似國(guó)畫(huà)中“氣”的效果。留白是改進(jìn)設(shè)計(jì)最快、最簡(jiǎn)單的秘密武器之一。第四，選擇一種基礎(chǔ)顏色，然后使用“色調(diào)和陰影”添加均勻性。不必總是用多種顏色來(lái)填充設(shè)計(jì)。如果項(xiàng)目允許，只需要使用受限的調(diào)色板，選擇“基礎(chǔ)顏色”，然后使用“色彩和陰影”，就可以用最簡(jiǎn)單的方式為設(shè)計(jì)增加一致性。

在進(jìn)行“如何讓畫(huà)面產(chǎn)生更強(qiáng)大、更一致的視覺(jué)效果”的討論中，有學(xué)生提出在設(shè)計(jì)中只使用一種字體，通過(guò)調(diào)整字體大小、粗細(xì)和顏色，可以產(chǎn)生具有差異性的畫(huà)面。有學(xué)生提出用細(xì)微但簡(jiǎn)單的疊加層改善文本和圖像之間的對(duì)比度。根據(jù)文本在圖像上的放置位置，可以選擇經(jīng)過(guò)嘗試的完整圖像疊加層，也可以選擇更細(xì)微的（從下到上，或從上到下）漸變疊加層，以實(shí)現(xiàn)兩者之間的簡(jiǎn)單對(duì)比元素。有學(xué)生提出適度使用居中文本。主要通過(guò)嘗試僅對(duì)標(biāo)題和文本的小段落使用居中文本，可以提升文本靈活度。當(dāng)涉及文本的長(zhǎng)格式內(nèi)容時(shí)，某些常規(guī)粗體字看起來(lái)仍然有些沉重和鮮明。通過(guò)選擇類似深灰色（即#4F4F4F）的內(nèi)容，可以輕松地解決此問(wèn)題，從而使文本看起來(lái)更輕松。通過(guò)增加行高，使文案有更好的可讀性。

（三）加強(qiáng)學(xué)生課后的設(shè)計(jì)實(shí)踐和教師的指導(dǎo)

學(xué)生課后的設(shè)計(jì)實(shí)踐作業(yè)應(yīng)以企業(yè)的實(shí)際需求為導(dǎo)向，課程設(shè)置應(yīng)符合企業(yè)工作流程。

例如針對(duì)視傳專業(yè)學(xué)生普遍薄弱的環(huán)節(jié)，補(bǔ)充互聯(lián)網(wǎng)開(kāi)發(fā)概述知識(shí)，讓學(xué)生全面了解后端開(kāi)發(fā)流程，幫助學(xué)生成為懂分析、知心理、善邏輯、大格局、精技巧的全能設(shè)計(jì)師。對(duì)基礎(chǔ)較為薄弱的學(xué)生要補(bǔ)充專業(yè)預(yù)科課程。創(chuàng)意美術(shù)課程讓學(xué)生能夠成為一個(gè)真正既懂審美，又會(huì)軟件的高級(jí)設(shè)計(jì)師，提升學(xué)生的綜合素質(zhì)。

另外，非常重要的一點(diǎn)是，在專業(yè)課程的后期加入職業(yè)規(guī)劃和理想崗位的匹配與選擇等內(nèi)容，讓學(xué)生在走出校門之前已經(jīng)較為清楚地了解如何將自己的就業(yè)需求與用人單位的需求進(jìn)行比較研究，減少就業(yè)過(guò)程中的阻礙，提高就業(yè)能力。

例如，通過(guò)設(shè)計(jì)用戶體驗(yàn)問(wèn)卷，與學(xué)生討論“如何改善用戶的引導(dǎo)體驗(yàn)”。一些用戶希望隨時(shí)跳過(guò)設(shè)計(jì)好的界面引導(dǎo)，學(xué)生設(shè)計(jì)出將“跳過(guò)”鏈接按鈕放在容易觸及的范圍內(nèi)。通過(guò)不斷調(diào)整用戶界面圖標(biāo)，使其具有相同的視覺(jué)樣式，包括確保它們共享相同的視覺(jué)風(fēng)格，相同的重量，可以填充或勾勒輪廓等。始終將“號(hào)召性用語(yǔ)”放在屏幕上最突出的位置。通過(guò)使用顏色對(duì)比、大小和標(biāo)簽，不總是依靠icon，確保“號(hào)召性用語(yǔ)”盡可能突出。進(jìn)行簡(jiǎn)單調(diào)整后，可使用戶的體驗(yàn)更好，用戶的理解度也會(huì)有相應(yīng)的提升。

教師的課外指導(dǎo)也可以是比較具體的，例如，有些學(xué)生設(shè)計(jì)要在應(yīng)用程序內(nèi)部使用的菜單時(shí)，遇到難題求助教師。教師可有針對(duì)性地提出如何確保在屏幕上突出顯示最常用的上載圖像、添加文件等操作。如何為表格錯(cuò)誤添加額外的視覺(jué)輔助——用戶填寫(xiě)任何形式的表單時(shí)，在剛剛執(zhí)行的操作附近添加錯(cuò)誤消息可能是一種簡(jiǎn)單但有用的額外視覺(jué)幫助。

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

隨著越來(lái)越多網(wǎng)上虛擬工具的推出，無(wú)論是從事視覺(jué)傳達(dá)設(shè)計(jì)的專業(yè)人員，還是普通用戶，對(duì)于總用戶界面設(shè)計(jì)的接觸幾乎不可避免。一款好的程序，如果充分調(diào)研用戶的需求，設(shè)計(jì)時(shí)巧妙地利用專業(yè)知識(shí)為目標(biāo)用戶的愉快、便捷使用做深入研究，一款成功的App就完成了基于應(yīng)用使命的1/2。好的UI設(shè)計(jì)教學(xué)不僅讓學(xué)生理解如何讓軟件變得有個(gè)性、有品位，還要讓學(xué)生做到實(shí)施界面設(shè)計(jì)，讓軟件的操作變得舒適、簡(jiǎn)單、自由，充分體現(xiàn)軟件的定位和特點(diǎn)。只有不斷實(shí)施高質(zhì)量的教學(xué)設(shè)計(jì)，才能不斷提升學(xué)生的綜合設(shè)計(jì)能力。

參考文獻(xiàn)：

[1]周璨.高職院校計(jì)算機(jī)專業(yè)課程思政建設(shè)的探索與實(shí)踐——以《移動(dòng)UI界面設(shè)計(jì)》課程為例[J].知識(shí)文庫(kù)，2020（20）：3-4.

[2]黃耀輝，劉金滿.手機(jī)App的UI界面設(shè)計(jì)[J].科技創(chuàng)新與應(yīng)用，2020（30）：28-29.

[3]丁思儂.UI設(shè)計(jì)中的視覺(jué)體驗(yàn)研究[J].藝術(shù)品鑒，2020（27）：81-83.

[4]周璨.高職院校移動(dòng)UI界面設(shè)計(jì)課程教學(xué)改革探析[J].知識(shí)文庫(kù)，2020（18）：2.

（作者簡(jiǎn)介：趙越，女，碩士研究生，鄭州工商學(xué)院，講師，研究方向：視覺(jué)傳達(dá)設(shè)計(jì)）

（責(zé)任編輯 劉月嬌）