...
素材網 品牌美學館标志
主站 營銷美學 品牌設計 免費素材
素材公社伴您走天涯 - 访问手机站 品牌美學館 品牌美學 經典案例

如何讓你的網頁背景圖更高級?

发布于 2019-09-09 | 閱讀(644)|標簽: 網頁

在網頁设计中创建背景材质通常是根据设计方向展开设计的第一步,也是确定设计基调的重要环节。


虽然大多数情况下,網頁背景材质是非常细微和低调的,但是由于整个背景的范围较大,所以会给人强烈的心理感受。



所以这篇文章中,我会就網頁背景材质创建过程中常用到的方法做一总结,希望对于大家在设计中的开头步骤能够给与帮助的参考。


一、使用现成的图案来创建網頁背景材质。


1、下載現成的圖案樣式,或者自己動手創建圖案。下載完或者創建好圖案之後,在圖層樣式中選擇圖案疊加即可。雖然看起來是很簡單的一個步驟,但是如果有了高質量的圖案樣式,效果非常顯著。


2、如果下載的圖案色調不符合設計要求的話,可以通過圖層混合模式來進行調整。比如我們想要創建淺色的背景材質,但是手頭的圖案樣式是暗色的,如果圖案疊加的混合模式爲正常的話,創建出來的效果如下圖:

但是我想用這款圖案做出淺色的背景來,該怎麽做呢?這時候就可以通過調整圖案疊加的混合模式來實現。在背景色不完全是白色的情況下,一般像上面的圖案,通過調整混合模式到亮光就能得到如下圖的效果。


3、還不滿意的話,比如想要亮度再稍微再亮一點,還可以通過新建調整圖層來實現。在這個例子中,使用色階調整圖層就可以實現我們的設計目標。


你還可以通過添加黑白圖層來給整個背景材質去色,通過色相飽和度圖層調整背景材質的色相以及明暗值。

4、通過在圖案圖層上方新建一個顔色填充圖層,調整該圖層的圖層混合模式,我們可以給圖案圖層添加一定的顔色。


比如加一點黃色進去,或者加一點藍色。當然這裏我們依然可以通過添加色相以及飽和度調整圖層來給本來是灰度的材質上色,具體方法就是在色相飽和度調整圖層的對話框中勾選著色框,然後調整色相的滑動塊來實現。

 

二、应用滤镜来创建網頁材质背景。


在使用滤镜来给網頁背景添加材质的方法中,最常见到的莫过于使用滤镜中的添加杂色命令来实现需要的效果了。


應用步驟爲,先將圖層轉轉爲智能對象,目的是方便隨時調整濾鏡值。然後應用濾鏡>雜色>添加雜色命令即可,非常簡單。


一般來說,添加雜色時,濾鏡數值的設置非常低,一般使用1%就夠了,而且效果非常好,數值太大材質看上去不夠自然。具體設置如下圖所示:

雜色背景效果如下圖:


三、使用筆刷來添加質感。


使用笔刷来创建網頁背景材质也很简单,一般的步骤是,将前景色调整为白色,选择画笔工具,调整好大小,在新建的图层上随机添加一些笔刷效果,通过多建几个图层,调整不同图层的图透明度可以让添加的材质看上去更自然和真实。


之後將圖層的混合模式調整爲疊加或者柔光讓筆刷效果和背景更好的融合。


下面的圖片是添加了劃痕和做舊效果的筆刷後,未更改圖層混合模式之前和更改後的效果:

 

除了上面的做旧风格常用到这种方法外,笔刷方法的应用还常常出现在水彩风格的網頁设计过程中。

四、使用材质图片来创建網頁背景


比如我们要让網頁背景看上去是纸质的感觉。当然可以通过添加不同层次的滤镜效果模拟来实现类似于纸张的材质,但是相较于直接把一张纸质材质的图片拖到文档中,通过调整图层的混合模式以及上面提到的各种调整图层来实现的话,后面的一种方法做出来的效果往往要更真实和自然。类似的还有木质的背景材质的实现。


下面的截圖展示了木質背景材質的效果:


五、總結

实际上,在创建網頁背景材质时,上面讲到的方法都会涉及到,只不过依据设计目标,有时只会用到其中的一种方法,比如杂色背景的话,应用添加杂色的滤镜命令往往就够了,有时却要复杂一些,可能上面的方法都会用得到。


所以我们要依据总的设计目标来选择性的使用,但是这些方法不用说都是網頁设计中必须要掌握的,这样我们的设计手法才能灵活多变。


素材公社-品牌美學館底部标志

品牌美學館 - 汇集国内和国外优秀品牌营销案例和品牌設計作品,有最经典广告语大全,产品促销广告语,品牌顶尖文案,国外品牌视觉形象(VI)设计等。

素材公社手机版二维码
手机站 更好玩
© Copyright 素材公社tooopen.com 本站部份内容收集于网络,如有侵犯您权益请告知删除| 湘ICP備11010972號