新手福利：實(shí)例講解如何設(shè)計(jì)小清新風(fēng)格插畫(huà)
簡(jiǎn)述：?這些簡(jiǎn)約扁平唯美的插畫(huà)風(fēng)如何從無(wú)到有的過(guò)程呢缭乘，除了用手繪板去畫(huà)键科，其實(shí)用AI+PS也可以完成這樣的插畫(huà)風(fēng)俊马。
關(guān)注【ui179179】公眾號(hào)即可獲取相對(duì)應(yīng)的學(xué)習(xí)資料兵怯！課程學(xué)習(xí)
感謝您的關(guān)注 期待與您一起進(jìn)步纵竖！加油
漸變扁平插畫(huà)風(fēng)應(yīng)用在APP閃屏漠烧、H5設(shè)計(jì)杏愤、海報(bào)靡砌、UI界面中、扁平化簡(jiǎn)單的插畫(huà)風(fēng)格讓更多人所接受喜愛(ài)
這些簡(jiǎn)約扁平唯美的插畫(huà)風(fēng)如何從無(wú)到有的過(guò)程呢珊楼，除了用手繪板去畫(huà)通殃，其實(shí)用AI+PS也可以完成這樣的插畫(huà)風(fēng)。
今天帶給大家一個(gè)教程厕宗，如何用PS+AI快速實(shí)現(xiàn)扁平化插畫(huà)風(fēng)画舌，這個(gè)教程應(yīng)該在去年的時(shí)候就應(yīng)該分享給大家，因?yàn)楣ぷ鞅容^忙這個(gè)事就擱淺了已慢，還好現(xiàn)在去做這個(gè)教程還不算晚曲聂，畢竟這個(gè)風(fēng)格一直現(xiàn)在延續(xù)。為了寫(xiě)這一篇文章教程佑惠，自己設(shè)計(jì)了三張扁平化插畫(huà)風(fēng)海報(bào)朋腋，根據(jù)照片來(lái)源靈感，結(jié)合流行漸變色進(jìn)行創(chuàng)意組合設(shè)計(jì)膜楷。以下為實(shí)例的教程旭咽，不只是步驟上教大家如何去完成，其實(shí)更多是一些在設(shè)計(jì)過(guò)程中的一些思考赌厅。分享的教程頁(yè)面可能會(huì)很長(zhǎng)穷绵，為了讓大家更好的理解步驟介紹的相對(duì)比較詳細(xì)，其實(shí)大致總結(jié)起來(lái)也就幾個(gè)步驟快速的完成特愿。
在設(shè)計(jì)繪制插畫(huà)風(fēng)的時(shí)候先不要求快仲墨，首先要有一個(gè)思考，想一個(gè)題材揍障。是想要做哪方面的插畫(huà)目养，是藍(lán)天、深林亚兄、沙漠等 有個(gè)大致的腦圖混稽。然后根據(jù)想要做的主題去找一些唯美的照片，從照片中吸取一些靈感，然后創(chuàng)意重新組合匈勋，或者從顏色上進(jìn)行變化礼旅，達(dá)到想要的效果。以下是前期準(zhǔn)備中找到的靈感參考照片素材：
了解現(xiàn)在流行的漸變色洽洁，多看看色彩相關(guān)的設(shè)計(jì)痘系，從設(shè)計(jì)中提取出一些色彩搭配應(yīng)用在設(shè)計(jì)中。在漸變插畫(huà)風(fēng)中色彩表現(xiàn)手法各有不同饿自，色彩冷暖對(duì)比汰翠、互補(bǔ)顏色對(duì)比、同等色調(diào)明度對(duì)比昭雌、反差對(duì)比复唤、相近色系等，都是為了整個(gè)畫(huà)面達(dá)到層次關(guān)系烛卧、空間感佛纫、對(duì)比強(qiáng)烈、畫(huà)面融合总放。在做圖的時(shí)候就要知道想要什么樣顏色作為畫(huà)面的主色調(diào)呈宇，用什么樣的方式表達(dá)。
原創(chuàng)第一張插畫(huà)為例局雄，在前期準(zhǔn)備主題定位甥啄、色彩了解之后整體結(jié)合元素組合創(chuàng)意布局，在紙上把想要表達(dá)和照片保留繪制一個(gè)草圖炬搭，草圖不需要造型多準(zhǔn)確蜈漓。只是能表達(dá)出來(lái)即可、給接下來(lái)工作提供了方便尚蝌。
根據(jù)草圖迎变，收集一些元素圖片，目的是知道海豚飘言、漁船衣形、陽(yáng)光是什么樣的。根據(jù)圖片創(chuàng)意加工造型變化姿鸿，變成自己所需要的素材谆吴。收集一些云彩、遠(yuǎn)處的山苛预、漁夫小船句狼、海豚、陽(yáng)光等相關(guān)素材热某。
在元素繪制的時(shí)候沒(méi)有特別的規(guī)定是PS去繪制還是AI去繪制,兩者都可.主要還是根據(jù)自己的軟件操作習(xí)慣而定,最終達(dá)到目的就可以了腻菇。至于如何畫(huà)太陽(yáng)胳螟、如何去畫(huà)一個(gè)小船和漁夫、如何畫(huà)個(gè)小山筹吐、就不做演示糖耸。這更多的是造型能力和軟件操作能力。主要講的是在做這個(gè)漸變扁平插畫(huà)的一個(gè)怎樣的思考和過(guò)程,如何去做頁(yè)面的處理丘薛。元素如何去畫(huà)還是要根據(jù)找的照片素材進(jìn)行延展和一些造型上的一個(gè)參考在進(jìn)行創(chuàng)作,然后進(jìn)行AI中繪制這的過(guò)程嘉竟。
以上準(zhǔn)備都做完之后就需要開(kāi)始進(jìn)行PS實(shí)際進(jìn)行操作了。
1在PS中ctrl+n建一個(gè)畫(huà)布為750*1335洋侨， 分辨率72舍扰。?
2在畫(huà)布上給畫(huà)面一個(gè)背景顏色，背景顏色在前期構(gòu)想中就要有個(gè)想法希坚，大致要什么樣的顏色边苹。漸變色填充整個(gè)背景，背景色彩會(huì)主導(dǎo)整個(gè)畫(huà)面顏色方向漸變數(shù)值為：
#83a3ea #ebd0e2 #fee9e0 #d3c2e3
3確定天水地分割線吏够，分割線會(huì)更清晰的知道哪部分是天上的部分空間勾给，哪些是水面的部分空間滩报，哪些是地面的空間锅知，CTRL+R標(biāo)尺下相應(yīng)位置作為標(biāo)記
4繪制小山可在PS中或者AI中繪制，哪個(gè)方便就用哪個(gè)脓钾，沒(méi)有特意要求售睹，把小山放在天水分割線處，給小山顏色#b2a2cc 然后復(fù)制出一層小山作為倒影可训，顏色#e6d6e0
5繪制陽(yáng)光在AI中繪制了一個(gè)陽(yáng)光昌妹，拖拽到PS中，陽(yáng)光填充顏色：#fffff 陽(yáng)光在PS中顯得比較突兀握截，和整體不融合飞崖，這樣就需要給圓做一個(gè)外發(fā)光。選中陽(yáng)光圖層右鍵-混合選項(xiàng)-外發(fā)光谨胞，混合模式：濾色固歪、不透明度75%、圖素大小:27胯努，方法：柔和牢裳，顏色：#ffe7e3
6.湖面處理在底色上復(fù)制一個(gè)太陽(yáng)縮小一點(diǎn)太陽(yáng)，垂直旋轉(zhuǎn)作為投影叶沛。濾鏡-模糊-高斯模糊蒲讯，然后給投影一個(gè)透明度60%
7.湖面陽(yáng)光倒影處理使陽(yáng)光及湖面更真實(shí)做進(jìn)一步的細(xì)化。在AI中繪制這樣的圖形灰署，然后拖拽到PS中判帮。給圖形一個(gè)顏色局嘁，讓圖形融合水面顏色值#faf6f8
8.在AI中繪制線條圖形，拖拽到PS中晦墙，有點(diǎn)像水紋的感覺(jué)海面不那么平平导狡。水紋只是個(gè)輔助的作用，所以不用那么突出偎痛。把水紋的顏色調(diào)整體融入一些旱捧，顏色#f8eef1
9.湖面也處理差不多了、那么給整個(gè)畫(huà)面增加一些輔助氣氛踩麦、在AI中畫(huà)的小船漁夫?qū)氲疆?huà)面中枚赡，擺放好位置，給小船一個(gè)顏色#bba8da谓谦，這樣小船感覺(jué)像在空中飄著贫橙，緊接著給小船一個(gè)陰影讓小船有一個(gè)厚重感是在海面上飄著的。復(fù)制一層小船反粥，然后旋轉(zhuǎn)把小船壓扁一些感覺(jué)像個(gè)倒影卢肃、給小船陰影一個(gè)顏色#ded1f3。
10.在AI中繪制海豚的時(shí)候要拆分分層兩個(gè)部分才顿，一個(gè)整個(gè)的海豚和海豚下半部嘴的部分莫湘、拆分的原因是在上色的時(shí)候會(huì)更方便一些。
把海豚放在相應(yīng)的位置郑气，放在太陽(yáng)正上方有一些太居中幅垮，往右移動(dòng)幾像素從視角上來(lái)說(shuō)生動(dòng)了不少。然后給海豚一個(gè)漸變的色值尾组，從左上方拉到右下方忙芒、色值為：#dbd1f8 #a789d3 要注意的是#a789d3給的多一些、因?yàn)檫@個(gè)是主色調(diào)讳侨。然后把海豚的第二部分嘴下半部元素組合給一個(gè)色值：#f8e1fe
這個(gè)海豚看似是完成了呵萨，其實(shí)應(yīng)該在細(xì)節(jié)上在給一些環(huán)境色，選中海豚圖層跨跨，按住CTRL+左鍵單擊潮峦。框選海豚然后按照箭頭位置給一些漸變色歹叮，完畢之后CTRL+D取消線框跑杭，加完是不是更加的融合、更加的飽滿了咆耿。設(shè)計(jì)中的確是需要一些夸張的手法德谅，但是也需要符合一些場(chǎng)景，所以需要給海豚加一些特效萨螺，對(duì)了就是出水時(shí)候的水滴和水花窄做，營(yíng)造一下氣氛愧驱，放在最佳的位置、然后給個(gè)顏色椭盏。水花色值#f8f6f7這樣才是一個(gè)完整的出水海豚组砚。
11.岸邊根據(jù)草圖從形態(tài)上做一些藝術(shù)處理、折疊起伏這樣的岸邊掏颊、畫(huà)一個(gè)元素圖形就可以糟红，變換一下位置折疊愚铡，接著就是給一些漸變色值：#ecdcea #c7bce5 從上往下漸變岸邊完成之后感覺(jué)空一些缅茉，增加一些元素來(lái)點(diǎn)綴一下悲酷，營(yíng)造一些氣氛堰酿。三角面分隔明顯，對(duì)比也比較強(qiáng)烈备禀，所選三角作為裝飾虏束。明暗之間的對(duì)比桶癣，融合主色調(diào)做一下純度的降低乐横。立體三角元素畫(huà)一個(gè)就可以求橄，然后復(fù)制大小遠(yuǎn)近去做組合。
12.天空的處理葡公，增加一些云彩罐农，及星星點(diǎn)點(diǎn)元素即點(diǎn)綴了畫(huà)面，也讓整個(gè)畫(huà)面飽滿和符合畫(huà)面氣氛匾南。到現(xiàn)在這個(gè)步驟畫(huà)面已經(jīng)完成啃匿，給畫(huà)面加分地方就是在來(lái)一點(diǎn)英文，這個(gè)畫(huà)面整體感就提升蛆楞。看上就會(huì)高大上一些夹厌。放一些比較細(xì)的英文字體豹爹，比較干凈不破壞整個(gè)效果。在做圖的時(shí)候圖層整理分組也是一個(gè)優(yōu)秀設(shè)計(jì)師日常設(shè)計(jì)良好習(xí)慣矛纹，更清晰的分組
對(duì)于UI臂聋，平面設(shè)計(jì)設(shè)計(jì)是否還是處于一知半解，沒(méi)有頭緒或南，處于迷茫的境界呢孩等？
這都不是問(wèn)題，希望想學(xué)習(xí)的你采够，不管是什么基礎(chǔ)肄方，或者是想轉(zhuǎn)行都可以加群，期待你的加群一些學(xué)習(xí)【667576606】關(guān)注【ui179179】公眾號(hào)獲取學(xué)習(xí)資料
感謝您的關(guān)注 期待與您一起進(jìn)步蹬癌！加油
