UI界面設(shè)計(jì)中的裝飾語(yǔ)言研究

■崔佐卿 許雁翎/合肥職業(yè)技術(shù)學(xué)院

2019年界面設(shè)計(jì)的趨勢(shì)對(duì)于設(shè)計(jì)行業(yè)的從業(yè)人員提供了更新的信號(hào)，對(duì)行業(yè)咨詢的敏銳覺(jué)察能夠幫助契合當(dāng)下流行的設(shè)計(jì)風(fēng)格，從而迎合更多年輕受眾的審美喜好，有助于營(yíng)造更加設(shè)計(jì)思維更加新銳、更具實(shí)效性、年輕化的企業(yè)和品牌形象。

目前針對(duì)UI 設(shè)計(jì)領(lǐng)域的行業(yè)從業(yè)者主要的構(gòu)成形式涵蓋了以下幾個(gè)方面：一類是由企業(yè)內(nèi)部設(shè)置網(wǎng)站設(shè)計(jì)和運(yùn)維部門(mén)，網(wǎng)站創(chuàng)建人員根據(jù)不同的專業(yè)和技能形成涇渭分明的個(gè)分工。其中視覺(jué)設(shè)計(jì)人員和編程人員的分工明確，設(shè)計(jì)人員在標(biāo)記語(yǔ)言的 編寫(xiě)上遇到的問(wèn)題需由編程人員才能夠解決，而編程人員對(duì)于界面的視覺(jué)設(shè)計(jì)效果無(wú)法做到準(zhǔn)確的把控。過(guò)于明確的分工主要由界面設(shè)計(jì)工作的特殊性導(dǎo)致。設(shè)計(jì)工作包含對(duì)于優(yōu)秀版面視覺(jué)效果的審美性要求,以及對(duì)于網(wǎng)站框架搭建以及各種交互功能實(shí)現(xiàn)的功能性。設(shè)計(jì)專業(yè)的教育中對(duì)于javascript以及css等標(biāo)記語(yǔ)言的課程并沒(méi)有完全深入，而主要集中在對(duì)于美觀性、創(chuàng)意性的研究領(lǐng)域。另一方面，熟練撰寫(xiě)代碼的編程人員對(duì)于視覺(jué)效果的美觀性沒(méi)有接受過(guò)專門(mén)的課程練習(xí)。因此網(wǎng)站界面設(shè)計(jì)是一門(mén)需要結(jié)合跨界思維，橫跨兩個(gè)不同專業(yè)領(lǐng)域的特殊設(shè)計(jì)類別。作為設(shè)計(jì)者或設(shè)計(jì)的教育從業(yè)者以及學(xué)生，需要強(qiáng)化和吸收更多專業(yè)領(lǐng)域外部的新鮮知識(shí)和養(yǎng)分，才能夠供給日新月異的網(wǎng)站設(shè)計(jì)風(fēng)格和效果的實(shí)現(xiàn)，達(dá)到鞏固以及打破專業(yè)技能壁壘的目的。

從2019年界面設(shè)計(jì)的風(fēng)格趨勢(shì)角度而言，更動(dòng)態(tài)、更簡(jiǎn)化以及鮮艷活潑的色彩方案會(huì)成為整體趨勢(shì)。卡片式設(shè)計(jì)風(fēng)格的初創(chuàng)者：Pinterest亦加入了一些動(dòng)態(tài)的視頻代替圖片進(jìn)行展示，以達(dá)到信息更高效、集約的傳達(dá)。國(guó)內(nèi)方面，包括設(shè)計(jì)行業(yè)內(nèi)的一些商業(yè)網(wǎng)站，包括花瓣網(wǎng)、arting365 以及視覺(jué)同盟、天貓等電商網(wǎng)站，都開(kāi)始舍棄舊有的復(fù)雜界面設(shè)計(jì)，在界面響應(yīng)式的基礎(chǔ)上，一方面延展了設(shè)計(jì)的空間，設(shè)計(jì)者獲得了更大的發(fā)揮空間，于此同時(shí)，動(dòng)態(tài)視頻代替靜態(tài)圖片，以及更多的微交互、更簡(jiǎn)化的圖標(biāo)、圖形和字體也是主要的趨勢(shì)之一。

提及界面設(shè)計(jì)，普遍被探討最多的詞匯是用戶體驗(yàn)。而從用戶體驗(yàn)的角度出發(fā)，考慮到各種不同尺寸和型號(hào)的移動(dòng)終端正在覆蓋人們生活的方方面面，信息的冗雜性占據(jù)了用戶的思考空間。因此能夠在短時(shí)間內(nèi)讓繁忙的現(xiàn)代人以高效的方式盡可能多地吸收更多信息，成為界面設(shè)計(jì)維度用戶體驗(yàn)的關(guān)鍵。因此在信息的輸出上，首先融入更多大面積的動(dòng)態(tài)元素，在不造成視覺(jué)疲勞的基礎(chǔ)上相較于靜態(tài)元素更能吸引用戶的注意。例如花瓣網(wǎng)作為設(shè)計(jì)者常用網(wǎng)站之一，就率先在頁(yè)面上的部分模塊采納了這種動(dòng)態(tài)的視頻，結(jié)合卡片式的整體布局，讓信息更集約，傳達(dá)效率更高。使觀看者在繁雜的靜止圖片中，輕而易舉地關(guān)注到頁(yè)面上被強(qiáng)調(diào)的關(guān)鍵信息，并在幾秒的時(shí)間內(nèi)實(shí)現(xiàn)信息的吸收。

其次，插圖元素的運(yùn)用使畫(huà)面的表現(xiàn)性層次更加生動(dòng)，不同肌理風(fēng)格和筆觸的注入使頁(yè)面設(shè)計(jì)融入了更多的趣味性和手繪元素，讓畫(huà)面更具情感性，傳遞出設(shè)計(jì)者對(duì)于每一寸色彩和每一根線條的關(guān)照和誠(chéng)摯思索。

界面的色彩方案上，2019年高飽和度高明度的漸變色彩以及漸層效果的色彩風(fēng)格延伸到設(shè)計(jì)領(lǐng)域的各個(gè)角落，柔和的過(guò)渡和明快的色調(diào)傳達(dá)出積極歡快的情感，配合非襯線設(shè)計(jì)字體的運(yùn)用，帶來(lái)一個(gè)一種新的色彩沖擊和特殊的視覺(jué)體驗(yàn)。

極簡(jiǎn)主義設(shè)計(jì)風(fēng)格源于二戰(zhàn)后歐洲復(fù)興計(jì)劃隨之而來(lái)的給予資源節(jié)約觀念的設(shè)計(jì)風(fēng)格和一系列的設(shè)計(jì)教育風(fēng)格的實(shí)踐。受包豪斯和烏爾姆設(shè)計(jì)觀念的影響下，設(shè)計(jì)受到重視，一種以銳利的線條和極簡(jiǎn)的圖形元素構(gòu)成的設(shè)計(jì)風(fēng)格一直被延續(xù)下來(lái)，擴(kuò)散到建筑設(shè)計(jì)、平面視覺(jué)設(shè)計(jì)等方方面面。

Web VR以及全景視頻的融入亦成為新的趨勢(shì)，一些與VR技術(shù)密切相關(guān)的領(lǐng)域商業(yè)網(wǎng)站早已開(kāi)始融入全景視頻的交互功能，體現(xiàn)出全景視頻在用戶體驗(yàn)上帶來(lái)的全方位多維度的觀察角度，讓視頻、圖像的表現(xiàn)層面更加豐富，與用戶的使用更加貼合，更便捷。然而在國(guó)內(nèi)外其它領(lǐng)域的部分商業(yè)網(wǎng)站界面設(shè)計(jì)和手機(jī)界面設(shè)計(jì)上，也充分凸顯了全景視頻帶來(lái)的360`全新視覺(jué)體驗(yàn)給交互設(shè)計(jì)帶來(lái)的不同體驗(yàn)。因此在技術(shù)的實(shí)現(xiàn)上，由于新技術(shù)的開(kāi)發(fā)，就要求網(wǎng)站的設(shè)計(jì)人員對(duì)全景視頻的拍攝、剪輯具備更專業(yè)的操作基礎(chǔ)，能夠制作、剪輯和拼合全景視頻，并熟知全景視頻的格式和嵌入的方式。

以cinemagraphs取代GIF動(dòng)態(tài)圖片的，原本的網(wǎng)站設(shè)計(jì)一些動(dòng)態(tài)效果多數(shù)通過(guò)GIF動(dòng)圖的形式出現(xiàn)，但是GIF格式的圖片具備一定的局限性，尤其是對(duì)于圖片文件量的限制以及對(duì)于動(dòng)態(tài)效果的局限性，GIF格式的圖片在一定程度上構(gòu)成局限。在cinemagraphs雖然是靜態(tài)圖像，但它與GIF動(dòng)畫(huà)不同，一般在使用上只包含一個(gè)動(dòng)態(tài)元素，但是能夠在限制較小文件量的基礎(chǔ)上，保證網(wǎng)站的加載速度，同時(shí)帶來(lái)一定的動(dòng)態(tài)效果，讓網(wǎng)站的視覺(jué)效果層次更加豐富。

除此之外，更多的微互動(dòng)設(shè)計(jì)，主要集中在手機(jī)UI界面設(shè)計(jì)，以及分屏式設(shè)計(jì)、去按鈕設(shè)計(jì)等方法，從前幾年流行的幽靈按鈕，轉(zhuǎn)移到了直接去除按鈕，讓用戶直接使用滑動(dòng)界面的方式，讓用戶體驗(yàn)過(guò)程更加簡(jiǎn)便、流暢。

綜上所述，2019年至今界面設(shè)計(jì)的趨勢(shì)整體呈現(xiàn)出更簡(jiǎn)潔、層次更豐滿、色彩風(fēng)格更明快，動(dòng)態(tài)取代靜態(tài)的態(tài)勢(shì)。作為設(shè)計(jì)者，需要時(shí)刻保持敏銳的洞察和實(shí)踐，讓自己的作品契合最新的流行趨勢(shì)，實(shí)現(xiàn)更便捷、更高效、更新鮮的用戶體驗(yàn)，得到視覺(jué)效果的整體升華。