本篇教程教大家如何用photoshop把普通照片設(shè)計(jì)處理成超棒的立體卡通頭像效果，制作過程簡單易懂，喜歡的童鞋可以收藏試著做做看。

原圖：

效果圖：

很多網(wǎng)頁都有一個(gè)醒目的大橫幅區(qū)域，但設(shè)計(jì)上大都千篇一律，如果你訪問FACTOR DESIGN網(wǎng)站，你會發(fā)現(xiàn)，該區(qū)域的變化比你想象中要豐富得多――并不是通過特效，而是通過版面設(shè)計(jì)，他們對橫幅的間隔設(shè)計(jì)讓你在任何平面設(shè)計(jì)中都能獲得靈感。

由圖片構(gòu)成的區(qū)域顯得結(jié)構(gòu)清晰、重點(diǎn)突出及信息有效傳達(dá)，并且具有多種意想不到的功能。

Factor Design網(wǎng)站令人一見難忘，其版面結(jié)合了作品展示及手冊設(shè)計(jì)的特點(diǎn)形成漂亮的效果。白色的開闊區(qū)域，高度簡潔及最小化的構(gòu)成，柔和的顏色搭配，通過一些隱藏的表格整潔清晰地呈現(xiàn)出來。

這個(gè)版式結(jié)構(gòu)我們有兩點(diǎn)是特別欣賞的：一是它采用了印刷類的平面設(shè)計(jì)風(fēng)格，使用襯線字體，文字顏色對比低調(diào)柔和，不同文字欄寬度形成強(qiáng)烈對比。二是上面的水平圖片區(qū)域設(shè)計(jì)，使整個(gè)版面顯得優(yōu)雅漂亮。這個(gè)圖片區(qū)域只看上一眼，你可能不能一下子認(rèn)識它的所有優(yōu)點(diǎn)，但我們之所以深入討論這個(gè)區(qū)域是因?yàn)槿绻麖募夹g(shù)上來說，你采用了同樣這種方法，就可以得到同樣漂亮的相似效果――無論是網(wǎng)站設(shè)計(jì)還是其它平面設(shè)計(jì)。看一下我們能夠從這個(gè)網(wǎng)站設(shè)計(jì)中學(xué)到什么。

版面結(jié)構(gòu)：

書本狀的頁面版式結(jié)合了印刷及網(wǎng)站設(shè)計(jì)的風(fēng)格，只使用一種襯線字體，而文字尺寸只有兩種。

顏色：

在開闊的白色背景上，兩種文字顏色已經(jīng)可以傳達(dá)出一種清新及悅目的效果。

文字顏色對比：

不同的背景顏色有不同的欄目文字名稱顏色，但文字與背景的顏色卻保持了低對比度的關(guān)系。

圖片區(qū)域：

放置圖片的橫幅區(qū)域的大小及位置是固定的，但里面卻可以有千變?nèi)f化。設(shè)計(jì)從最基本的空間分割開始：

充滿表現(xiàn)力的變化：

在下面，我們將會看到圖片通過結(jié)合、搭配、剪切及組織可以有非常豐富的變化，而讓人印象深刻的是這些效果都只是在這個(gè)簡單的橫幅中實(shí)現(xiàn)。

本文所用顏色數(shù)值（RGB）：

文章來自仟億科技官網(wǎng)：http://billionnet

水彩畫是一種非常受歡迎的藝術(shù)風(fēng)格，并可以納入你的設(shè)計(jì)項(xiàng)目，但是你不需要成為創(chuàng)建此類圖像的藝術(shù)家，因?yàn)锳dobe Photoshop可以通過內(nèi)置濾鏡創(chuàng)造逼真的水彩效果。在今天的教程中，我將可以通過一系列設(shè)置，可將任何照片轉(zhuǎn)換為手繪水彩畫。 本教程水彩畫效果的產(chǎn)生是模擬了基于水彩進(jìn)行手繪的設(shè)計(jì)美學(xué)。一些列的PS設(shè)置將創(chuàng)造基本的水彩畫效果，用水彩筆刷產(chǎn)生的暈染效果和紙質(zhì)紋理疊加將增加其真實(shí)感而達(dá)到令人信服的效果。

步驟1

在Adobe Photoshop中打開您選擇的圖像。我正在使用的金門大橋照片來自Unsplash的Patrick Tomasso，右鍵單擊背景圖層，然后選擇轉(zhuǎn)換為智能對象。

步驟2

單擊濾>濾鏡庫>藝術(shù)效果>干畫筆，將設(shè)置更改為：畫筆大小為10，畫筆細(xì)節(jié)為10和紋理1，單擊確定以應(yīng)用效果。

步驟3

再次選擇濾鏡>濾鏡效果>藝術(shù)效果>木刻，確保不要選擇頂部默認(rèn)選項(xiàng)，這將重新應(yīng)用相同的效果，設(shè)置參數(shù)如下：色階數(shù)為5，邊緣簡化度為4和邊緣逼真度為1。

步驟4

回到圖層面板，將圖層混合模式改為點(diǎn)光。

步驟5

再次單擊濾鏡菜單，這一次選擇去模糊>特殊模糊，設(shè)置參數(shù)：半徑５，閾值100，并將“質(zhì)量”更改為“高”。

步驟6

雙擊編輯濾鏡混合選項(xiàng)，將特殊模糊效果的混合模式更改為濾色，并將不透明度降低到50％。

步驟7

步驟10

將工具欄前景顏色切換為白色，調(diào)整畫筆的大小。點(diǎn)擊畫布來回復(fù)渲染在照片邊緣的水彩畫風(fēng)格。

步驟11

點(diǎn)擊幾下后，為了避免重復(fù)，換另一種水彩畫筆繼續(xù)恢復(fù)圖片的水彩色調(diào)。

由于所有的效果都被設(shè)置為智能對象的一部分，所以通過編輯智能對象層的內(nèi)容，可以將水彩繪畫效果應(yīng)用于替代照片。雙擊智能對象縮略圖打開.PSB文件。添加另一張照片，然后保存并關(guān)閉文件?；氐街黜撁?，會發(fā)現(xiàn)所有的效果已經(jīng)立即應(yīng)用到新的圖片。

是不是很簡單又實(shí)用，大家一起來創(chuàng)建自己的水彩畫風(fēng)格的作品吧！

原文地址：SPOON GRAPHICS 譯者：解答團(tuán)-郭郭

圖片是組成網(wǎng)頁的重要元素，相比較文字人們更容易被圖片所有吸引，相比較視頻來說，圖片會更為直觀，閱讀使用的流量遠(yuǎn)比視頻要少很多，如何運(yùn)用好圖片設(shè)計(jì)讓你的網(wǎng)頁更為合理，對網(wǎng)頁設(shè)計(jì)人員來說至關(guān)重要，下面為大家介紹一些運(yùn)用圖片設(shè)計(jì)網(wǎng)頁的方法技巧：

第一：首圖要吸引人眼球

網(wǎng)頁首屏很重要，用戶進(jìn)入網(wǎng)站的第一眼就是首屏，首屏是否吸引人眼球決定了用戶訪問的深度和停留長度，所以，漂亮的首圖是抓住用戶注意力的重要手段。優(yōu)質(zhì)的首圖能夠讓用戶明白，他們可以從這個(gè)網(wǎng)站獲取一些什么。

其次：排版要合理，合理運(yùn)用圖文混排

精心設(shè)計(jì)的排版能夠?yàn)槟愕钠放铺嵘齻€(gè)性，當(dāng)這些排版和圖片搭配到一起的時(shí)候，整個(gè)設(shè)計(jì)的形式感和表現(xiàn)力就有了明顯的提升。文本的樣式和其中包含的信息，和圖片內(nèi)容相互呼應(yīng)，互為解讀，這是最佳的搭配。

第三：圖片真實(shí)、有代入感：

根據(jù)環(huán)境和使用場景來展示產(chǎn)品是電商網(wǎng)站常用的技巧。而實(shí)際的數(shù)據(jù)也表明，這樣的圖片擁有著極高的轉(zhuǎn)化率。將產(chǎn)品置于實(shí)際的使用場景中，給予用戶真實(shí)的使用體驗(yàn)。

第四：色彩運(yùn)用

這里說的色彩疊加指的是用半透明的色彩圖層疊加在圖片上，這種手法通常能夠讓圖片更加匹配品牌色，或者視覺設(shè)計(jì)的需求。所疊加的色彩能夠讓圖片更容易引起用戶的情緒反應(yīng)。

最后：不對稱布局：

不對稱布局本身也是一種流行的設(shè)計(jì)手法。許多網(wǎng)頁設(shè)計(jì)師尤其喜歡這種有趣的排版布局方式。這種布局非常適合用來引導(dǎo)用戶的視覺，因?yàn)轫撁嬗辛溯p重對比，所以它可以以合乎邏輯的方式引導(dǎo)用戶的眼睛逐步瀏覽頁面內(nèi)容。

互聯(lián)網(wǎng)用戶的閱讀習(xí)慣和關(guān)注點(diǎn)不斷變化，因此，我們在設(shè)計(jì)頁面的時(shí)候也要根據(jù)用戶的特點(diǎn)進(jìn)行合理設(shè)計(jì)，圖片的使用也是一樣的，設(shè)計(jì)趨勢和技術(shù)的變化直接影響著圖片的使用，但是總體上而言，對于圖片素質(zhì)的要求是越來越高了。