我們知道，無論是在現代網站設計還是復古網站設計中，木紋元素的添加總是隨處可見。不管是列印產品、界面設計或總體布局，木紋總是能增強視覺效果。
在這篇文章中 ，我們將著眼於五個常見的設計元素，塑造出不同的木紋質感效果。
這五種網站設計元素是：
1.面料和縫合
2.紙質和陰影
3.刻字體和圖案
4.時尚現代的元素
5.立體效果
1.面料，縫製
面料和縫製這兩種元素用在木紋質網站設計裡面是天衣無縫的 ，因為它們都是很天然的手工品，有這類似的質感，無論是材質上還是視覺上 。我們來看幾個這三個元素結合在一起的網站範例。
範例
這裡運用了簡單的虛線式「針腳」設計，勾勒出圓徽章和旗幟的輪廓，就像被縫合在木質板背景上一樣。簡單的網站設計，真實的觸摸感。
在這個網頁設計中運用了不透明的面料材質，再加上針腳縫合，以及下拉陰影效果，塑造出與眾不同的網站視覺拼接效果。
數位化製作的木質紋理，使這個設計看起來很現代。細微的視覺梯度感和雕刻元素產生一個稍微立體，更逼真的外觀。特別是左上角可愛的徽章，同樣運用了縫合元素、皮質縫合效果。
2.紙質和陰影
紙質和陰影的網站設計效果是越來越受歡迎的，特別是與木質紋理的結合。下面我收集了一些不同紙質表達方式的網站設計供大家參考。
範例
不知道大家有沒有注意到，這個截圖同樣來自上節在講「面料和縫製」的那張，但是在這部分我們看到的是利用簡單的陰影效果和白色形狀扭曲的主題來塑造捲曲的紙張效果。
皺巴巴的紙質效果和木紋結合是非常協調的。在這UI文件中顯示一些可愛的剪影式的圖片，便於用戶瀏覽、收藏和共享有關食譜方面的信息。
這種設計是深度木材紋理、紙張和膠帶紋理的組合產生一個很有吸引力的用戶界面 。數位化紙張紋理和陰影的結合更顯逼真和形象。
這是我很喜歡的一個用戶界面樣本。細膩的木質紋理，同時利用內部陰影的效果創造搜索欄目。再加上面料和縫製元素，整體效果別具一格。
這種設計的靈感來源應該是受傳統航空信封圖案的啟發。特別還加上便籤釘在木板上的背景，使用戶界面更像是個形象的告示牌，而不是平面的網頁出現。
褐色木紋背景加上深度陰影，使得它想紙一樣呈現出來，特別是印徽章和棕褐色風格的照片結合，讓圖片看來就是被列印出來的 。真是奇妙的組合效果。
3.雕刻字體和圖案
雕刻字體和圖案的應用是網頁設計中相當普遍的技術，而且越來越受日常設計的歡迎。
範例
這個用戶界面的木紋設計用了做舊處理，讓褐色的半透明的圖像產生磨損的外觀。同時，雕刻技術讓字體看起來立體，就像真的刻在木板上一樣。
這是個看起來很乾淨舒服的用戶界面，基本運用了上述所有的技巧，但是最突出的特點應該是，木板頂部花卉圖案的雕刻元素確實值得稱讚。
誰會想到用金屬標牌掛在木質感的版頭做菜單導航呢，而且陰影的加入還營造了真實的鏽跡斑斑的效果，非常棒。
同樣，這裡的導航也是設計在木材的紋理上，雕刻的標題，我們仿佛還能看見木頭慢慢腐蝕的痕跡。
還是標牌式的設計，但是不是金屬質感的，而是木製感的。
這個界面採用了圓潤的現代設計元素。特別添加了突兀的「購買」按鈕，真實，立體，實在很神奇。
4.時尚現代元素
通常木質感被定義為復古，但是，只要處理得當，它同樣可以體現現代時尚的元素。
範例
在這個界面中，我們看到一個完全不同的風格元素，一個白色和一個綠色的滾動條設計很好的詮釋了現代設計元素。
同樣是面料和雕刻的元素，加入2像素的灰白色的圖標就會讓整個界面充滿現代感，有吸引力。
這個也是我喜歡的設計。它結合了時尚的漸變技巧、簡單的圖標、多變的文字，讓木質感不再單調，用戶更樂意去接受。
一個略帶三維效果的設計。非常強的木質感，甚至還帶有立體的光澤，相信用戶會為此深深著迷的。
發光、陰影、圖標。現代時尚設計不就是如此嗎？
典型的復古和現代元素的結合，你看出來了嗎？
這個很特別：木質的小鍵盤，紋理清晰生動。它的整體設計是默認iphone 的UIKIT.
5.三維效果
三維立體的設計，這真是令人難以置信的木質紋理效果。這種組合一般用於「架子式」的設計，我們通常可以在iphone和ipad接口，特別是蘋果的ibook應用裡看到。
範例
這些「貨架」具有很強的真實感，特別是陰影效果的添加。
這種設計看似更現代了些，而且很「實用」，不是嗎？
這是既現代又逼真，完美平衡與數位化效果質感的照片。
這裡的3D按鈕真令人難以置信。同樣是木製紋理，一個微妙的設計就能產生一種奇妙的效果。如果你看到這樣的按鈕，是不是會情不自禁的去按一下？
一個簡單而有效的3D效果已被應用到了導航欄，按鈕的設計就好像裝著無數秘密的抽屜。
作者：Ivan
原載：幻想互動（www.hx-h.com）
僅代表作者個人觀點。版權歸幻想互動所有，轉載時請註明出處。