曾幾何時(shí), 計(jì)算機(jī)中的數(shù)字世界是一個(gè)獨(dú)立于現(xiàn)實(shí)之外的虛擬世界, 由于網(wǎng)速帶寬和界面設(shè)計(jì)師水平等條件的限制, 數(shù)字界面設(shè)計(jì)在發(fā)展過(guò)程中長(zhǎng)期存在設(shè)計(jì)機(jī)械化、枯燥乏味, 缺乏真實(shí)情感聯(lián)想、藝術(shù)美感以及吸引力匱乏等問(wèn)題。而今, 在人們的生活中, 數(shù)字世界已經(jīng)和真實(shí)世界互相交融, 密不可分, 設(shè)計(jì)師開始嘗試在虛擬世界表達(dá)現(xiàn)實(shí)主義和人文精神, 其中具有代表意義的現(xiàn)象是肌理設(shè)計(jì)和應(yīng)用成為近年來(lái)界面設(shè)計(jì)領(lǐng)域的趨勢(shì)和潮流。
肌理, 也稱為質(zhì)感, 是物質(zhì)表面的組織結(jié)構(gòu), 即物質(zhì)表面呈現(xiàn)出的色彩、光澤、紋理、方向、深淺、粗糙度、透明度等多種外在特性的綜合表現(xiàn)。現(xiàn)實(shí)生活中的肌理千變?nèi)f化, 不必然依賴于材質(zhì)而存在, 因此設(shè)計(jì)師可以通過(guò)模擬和虛構(gòu)肌理從而觸發(fā)人們的感受, 使得肌理設(shè)計(jì)擁有數(shù)字化發(fā)展的廣闊前景。
根據(jù)給人的知覺感受, 肌理可以分為觸覺肌理和視覺肌理。顧名思義, 觸覺肌理是通過(guò)皮膚觸摸而感受到的光滑、粗糙等感覺;視覺肌理是無(wú)須皮膚接觸, 直接通過(guò)眼睛即可識(shí)別的肌理。數(shù)字肌理的表現(xiàn)雖然以視覺肌理為主, 但設(shè)計(jì)師可以充分運(yùn)用視覺肌理來(lái)表現(xiàn)相應(yīng)的觸覺心理體驗(yàn), 這種不同感官之間的互通現(xiàn)象也被稱為聯(lián)覺或通感。
數(shù)字形態(tài)的肌理本質(zhì)上都是計(jì)算機(jī)程序產(chǎn)生的數(shù)字符號(hào), 但它的表現(xiàn)形式大致可以分為兩類:一類是模擬肌理, 即模擬現(xiàn)實(shí)世界中已經(jīng)存在的肌理;另一類是虛構(gòu)肌理, 即利用數(shù)字技術(shù)創(chuàng)造只在非現(xiàn)實(shí)世界中存在的肌理。
一、數(shù)字肌理的生成
如何創(chuàng)造網(wǎng)頁(yè)設(shè)計(jì)中使用的數(shù)字肌理?技巧和方法不拘一格, 總體來(lái)說(shuō)主要有攝影、掃描、程序模擬、圖案、筆刷等。這些技巧和方法既可以分別獨(dú)立使用, 也可以綜合使用從而創(chuàng)造精致多變的整體肌理效果。
1、攝影
攝影在創(chuàng)造肌理中主要有兩方面的用途, 一是獲取現(xiàn)實(shí)世界中已經(jīng)存在的材質(zhì)和紋理的原始素材, 如木材、金屬、石頭、磚墻等;二是通過(guò)攝影捕捉現(xiàn)實(shí)生活中的感受和氛圍, 并將之應(yīng)用到設(shè)計(jì)之中。攝影是一種視覺細(xì)節(jié)極為豐富, 氣氛情感傳達(dá)最便捷, 給人真實(shí)感極強(qiáng)的肌理表現(xiàn)手法。
2、掃描
掃描主要用于獲取不同質(zhì)地的紙張表面的紋理, 以及捕捉不同的筆觸和顏料與紙張相互作用而產(chǎn)生的微觀視覺效果。在使用不同類型的紙、筆、顏料, 以及顏料的用量、運(yùn)筆速度存在差異的情況下, 肌理的形態(tài)也有明顯不同。掃描能準(zhǔn)確地復(fù)制出這些手繪和手寫的痕跡, 因此非常適合用于表現(xiàn)藝術(shù)和生命的氣息。
3、程序模擬
程序模擬理論上可以創(chuàng)造出任何的紋理, 無(wú)論現(xiàn)實(shí)中存在與否, 但是由于成本和技術(shù)含量過(guò)高, 效果可能不盡如人意, 因此很多時(shí)候網(wǎng)頁(yè)設(shè)計(jì)師不得不選擇更加簡(jiǎn)便的方法, 比如攝影、掃描等。程序模擬方法主要在三維軟件中使用, 結(jié)合攝影和掃描生成的素材貼圖, 再加上光影和凹凸效果, 就可以模擬出逼真的表面材質(zhì)紋理。Adobe Photoshop和Illustrator的濾鏡應(yīng)用可以給素材快速地添加Cloud云紋、Noise噪音等具有一定的隨機(jī)性的肌理。
4、圖案
制作圖案是在網(wǎng)頁(yè)設(shè)計(jì)中經(jīng)常使用的一種方法。圖案是通過(guò)單體的規(guī)律性的重復(fù), 形成無(wú)縫銜接的效果, 經(jīng)常用于頁(yè)面中的邊框和背景。圖案的原始素材可以來(lái)自現(xiàn)實(shí)紋理的模擬, 如布紋紙紋;也可以是來(lái)自圖形軟件繪制的矢量圖案, 如幾何、波點(diǎn)以及花紋圖案;還可以是程序隨機(jī)生成的圖案。這完全取決于設(shè)計(jì)師想要通過(guò)圖案?jìng)鬟_(dá)什么信息。
5、筆刷
筆刷是一種在繪圖軟件中手繪添加肌理的方式, 筆刷的生成方式既可以通過(guò)對(duì)掃描的紋理進(jìn)行矢量化疊加處理, 也可以將軟件中直接繪制生成的圖形轉(zhuǎn)換成筆刷。在網(wǎng)頁(yè)的插畫和圖標(biāo)、Logo和標(biāo)題的設(shè)計(jì)中, 都可以看到筆刷的頻繁使用。筆刷效果通常是設(shè)計(jì)師通過(guò)在外接手寫板上手繪的方式添加的, 因此具有一定的靈活度和隨意感。
二、網(wǎng)頁(yè)設(shè)計(jì)中數(shù)字肌理的應(yīng)用
數(shù)字肌理之所以成為近年來(lái)網(wǎng)頁(yè)設(shè)計(jì)領(lǐng)域的潮流, 是因?yàn)樵O(shè)計(jì)師體會(huì)到了數(shù)字肌理在網(wǎng)頁(yè)中的重要作用。通過(guò)設(shè)計(jì)與內(nèi)容相符的獨(dú)特肌理, 并和圖形、文字、色彩等元素搭配, 能夠?qū)崿F(xiàn)快速吸引觀眾目光、引導(dǎo)互動(dòng)流程、高效傳達(dá)信息等設(shè)計(jì)目的, 還能創(chuàng)造出具有高度識(shí)別性和便于人們記憶的網(wǎng)站風(fēng)格, 給觀眾帶來(lái)豐富細(xì)膩的情感體驗(yàn), 不失為一種全面提升網(wǎng)頁(yè)用戶體驗(yàn)的有效方法。數(shù)字肌理在網(wǎng)頁(yè)中的應(yīng)用方式可分為以下幾種:
1、設(shè)置視覺焦點(diǎn), 引導(dǎo)視線流程
視覺焦點(diǎn), 又稱為興趣中心或視覺中心, 是頁(yè)面上最吸引人們注意的地方, 也是視線集中交匯之處。肌理內(nèi)部細(xì)節(jié)比較豐富, 在與干凈平滑的純色背景形成對(duì)比時(shí), 非常容易成為視覺焦點(diǎn)。利用相關(guān)性原則, 可以引導(dǎo)用戶的視線流暢地移動(dòng)到色彩與肌理部分一致的說(shuō)明文字上。設(shè)計(jì)師將數(shù)字肌理應(yīng)用在重點(diǎn)信息和行動(dòng)召喚按鈕上, 能起到增加點(diǎn)擊量和提高轉(zhuǎn)化率的作用。
2、傳達(dá)真實(shí)信息, 構(gòu)建情感聯(lián)結(jié)
由于模擬肌理具有很強(qiáng)的寫實(shí)性, 觀眾在瀏覽的第一時(shí)間就能產(chǎn)生對(duì)現(xiàn)實(shí)事物的聯(lián)想, 這使得內(nèi)容的可信度和真實(shí)感隨之增強(qiáng), 非常適合應(yīng)用在講述真人真事的網(wǎng)站上。圖1所示的網(wǎng)站綜合應(yīng)用了多種肌理創(chuàng)作手法, 將手寫字體、水彩畫、高清晰度的攝影圖片以及模仿報(bào)紙印刷效果的字體結(jié)合成一個(gè)整體, 形成了極強(qiáng)的感染力, 觀眾在閱讀文章的過(guò)程中, 很快就將自己代入故事的情境之中, 情感隨著主人公而起伏波動(dòng)。
3、表達(dá)文化內(nèi)涵和藝術(shù)氣息
手繪和手寫的行為與繪畫藝術(shù)和書法藝術(shù)直接相關(guān), 因此使得手繪和手寫的視覺質(zhì)感天然具有一種文化和藝術(shù)內(nèi)涵, 對(duì)于想要傳達(dá)深刻文化底蘊(yùn)和內(nèi)涵的網(wǎng)站來(lái)說(shuō)非常適合。手繪的筆觸顏料漸變的肌理與人文主義風(fēng)格的字體組合在一起, 賦予了頁(yè)面強(qiáng)烈的視覺沖擊力, 讓人聯(lián)想到歷史給文物留下的滄桑痕跡。
4、增加裝飾性細(xì)節(jié), 吸引用戶停駐
在整體幾何形為主的現(xiàn)代主義設(shè)計(jì)風(fēng)格中, 設(shè)計(jì)師也可以通過(guò)在局部添加數(shù)字肌理, 增加一些裝飾性的細(xì)節(jié), 避免用戶感到單調(diào)無(wú)趣而過(guò)早離開。如網(wǎng)頁(yè)用色數(shù)量少, 呈現(xiàn)極簡(jiǎn)風(fēng)格, 設(shè)計(jì)師在插畫圖標(biāo)元素部分用噪點(diǎn)筆刷添加一些局部細(xì)節(jié), 利用筆刷疊加的層數(shù)多少構(gòu)成陰影深淺的假象, 這種應(yīng)用方式給單色圖標(biāo)營(yíng)造了一種層次感和立體感。
5、創(chuàng)造獨(dú)特風(fēng)格, 便于識(shí)別和記憶
設(shè)計(jì)師都想設(shè)計(jì)出具有自己獨(dú)特風(fēng)格的頁(yè)面, 使之在同類型網(wǎng)站中更容易被用戶識(shí)別和記憶。網(wǎng)站的設(shè)計(jì)風(fēng)格是品牌形象體系和表現(xiàn)手法在結(jié)構(gòu)上的統(tǒng)一, 一種數(shù)字肌理在網(wǎng)頁(yè)同類設(shè)計(jì)元素中進(jìn)行穩(wěn)定一致的使用, 是形成網(wǎng)站統(tǒng)一風(fēng)格的重要因素之一。
三、使用數(shù)字肌理應(yīng)注意的地方
1、牢記對(duì)比, 過(guò)猶不及
在網(wǎng)頁(yè)設(shè)計(jì)中合理地應(yīng)用數(shù)字肌理能起到畫龍點(diǎn)睛的作用, 相反, 如果數(shù)字肌理過(guò)量使用, 不僅會(huì)降低用戶獲取信息的效率, 還會(huì)給人留下頁(yè)面臟亂差的負(fù)面印象。肌理的應(yīng)用是為傳達(dá)信息而服務(wù)的, 只有在對(duì)比中, 信息才能體現(xiàn)出主次之分, 切忌添加過(guò)多無(wú)用的肌理。
2、綜合運(yùn)用, 打造整體
數(shù)字肌理在設(shè)計(jì)中不是一個(gè)獨(dú)立的個(gè)體, 設(shè)計(jì)師需要思考如何將肌理和字體、圖形、照片、色彩、插畫以及互動(dòng)交互等其他網(wǎng)頁(yè)元素結(jié)合在一起, 使數(shù)字肌理為網(wǎng)站的整體風(fēng)格服務(wù)。設(shè)計(jì)師需要在數(shù)字肌理和頁(yè)面其他元素之間掌握一個(gè)平衡點(diǎn)。