公司網(wǎng)站制作數字肌理的應用
日期 : 2019-03-08 13:55:07

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