本篇文章跟大家分享線面圖標設(shè)計制作解析,希望對大家有所幫助!
一、線面圖標組合基礎(chǔ)
在介紹線面圖標的設(shè)計樣式前,我們要先來了解一下線面圖標的組合基礎(chǔ),根據(jù)這些基礎(chǔ)知識我們能更好地理解下面介紹的設(shè)計樣式,也許還能自己超創(chuàng)出新的設(shè)計樣式。
1.面的比例
線面圖標在組合時,面所占比例大致有三種情況:小比例、大比例、全比例。
小比例的線面圖標本身色塊與背景色能形成一定的對比,豐富層次;大比例的線面圖標可以很好的將高光表現(xiàn)出來;全比例的線面圖標通過色彩的變化可以做出更加復(fù)雜的插畫圖標。
2.面的位置
線面圖標造型時,色塊面的位置大致也有四種情況:色塊面包含在線條內(nèi)部、色塊面與線條交叉錯開、色塊面與線條有交集拼接、色塊面與線條無交集拼接。
了解線面圖標的基礎(chǔ)知識后,不知道你有沒有發(fā)現(xiàn),其實線面圖標造型的重點就是線面位置關(guān)系以及面的多少,在這兩點的基礎(chǔ)上線與面本身的設(shè)計樣式完全可以參照線性圖標與面型圖標。
二、線包含面
線包含面,色塊面位于線條內(nèi)部,與線條沒有分離,根據(jù)面的所占比例分為部分包含以及全包含。
1.部分包含
線面圖標本身只有部分充滿色塊,如下圖:
這是一種常見的線面圖標,色塊面采用主題色,線條采用深黑色系。除了以上這種,再為大家舉幾種常見的處理方式。
線面不透明度改變
線條與色塊面采用同一色彩,部分色塊面降低不透明度與線條色彩形成差異,整體風(fēng)格清新簡約,并不會有線面圖標刻板的可愛風(fēng)格。
在這個基礎(chǔ)上可以對線條進行同色系的漸變處理,又是一種新的效果,如下圖:
多色色塊
色塊面采用多個色彩,線條采用深黑色系。比起單一色塊,更加豐富,色彩面面積更廣。
色彩漸變
色塊面采用多色彩漸變,是一種較常規(guī)的面型處理方式,也能使線面圖標整體更加豐富。
不透明度漸變
色塊面采用漸變色,一側(cè)色彩不透明度100%,一側(cè)色彩不同明度調(diào)至0~20%,比起純色色彩漸變,變化更加清新明快。
2.全包含
線面圖標的內(nèi)部面全包含色塊,色塊面的處理方式與部分包含區(qū)別不大(可以自己動手試試用部分包含面的處理方式繪制),這里主要介紹扁平線面插畫圖標以及MBE風(fēng)格線面圖標。
1)扁平線面插畫圖標
圖標造型相對復(fù)雜,會將圖形的細節(jié)表現(xiàn)出來,適合繪制有實物參考的圖形,常用在徽章、頭圖banner等偏向強視覺的運營處。
圖標參考實物進行線稿繪制后,對不同位置進行色彩填充,可以通過深色陰影以及白色高光增加圖標的厚度。
2)MBE線面圖標
MBE圖標是線面圖標中非常具有辨識度的一種風(fēng)格,最大的特點就是采用斷點線條,用色明亮并搭配一些簡單幾何做點綴。
三、線面分離
線與面分離開,根據(jù)線面分離的位置可以分為線條內(nèi)部分離、外部錯位以及拼接線面。
1.線條內(nèi)部分離
線條圖形內(nèi)部色塊面與線條分離,常見的處理方式有縮小內(nèi)部面、內(nèi)錯高光、內(nèi)部面型圖形。
1)縮小內(nèi)部面
將線面分離,并縮小內(nèi)部色塊面與外部線條形成一定的間距,如下圖:
2)內(nèi)錯高光
內(nèi)部色塊面通過布爾運算錯位與外部線條形成一個空白高光,對于規(guī)則的形狀可以直接通過形狀繪制。
3)內(nèi)部面型圖形
在線型圖標的基礎(chǔ)上,內(nèi)部采用色塊面增加一個圖形,可以將圖標本身內(nèi)部圖形改成面型色塊,也可以在圖標內(nèi)部增加一個規(guī)則色塊面,如下圖:
2.外部錯位
線條圖形色塊面與線條錯位分離,常見的處理方式有規(guī)則圖形錯位、圖標形狀錯位。
1)規(guī)則圖形錯位
在線性圖標的基礎(chǔ)上,在底層增加一個規(guī)則圖形(圓、矩形等)的色塊面形成錯位感,色塊面可根據(jù)面型圖標樣式進行各種嘗試,常見的如純色色塊、漸變色塊、不透明漸變色塊等。
2)圖標形狀錯位
線面圖標的線與色塊面直接分離并錯位交叉,一般會選擇將色塊面置于線條下部留出錯位感。
3.拼接線面
線條圖形與色塊面共同拼接形成完整的圖標,常見的處理方式有:有交集線面拼接、無交集線面拼接。
1)有交集線面拼接
圖標一半采用線條繪制,一半采用面型繪制,且線條與面有交集。這種拼接風(fēng)格較個性化,色塊面常常用色彩漸變添加。
2)無交集線面拼接
圖標一部分采用線條繪制,一部分采用面型繪制,且面與線之間沒有交集。與斷點線性圖標原理相似,不過將線與線斷點的一部分線型形狀改成了面型,如下圖:
劃重點
線面圖標的設(shè)計重點在于線面位置的改變以及面的所占比,在這兩點的基礎(chǔ)上線與面本身的設(shè)計樣式完全可以參照線性圖標與面型圖標。
常見的面占比大?。盒”壤?、大比例、全比例。
常見的線面位置:色塊面包含在線條內(nèi)部、色塊面與線條交叉錯開、色塊面與線條有交集拼接、色塊面與線條無交集拼接。
直線網(wǎng)公眾號,第一時間學(xué)習(xí)最新教程,看最新行業(yè)動態(tài)!!
0
喜歡他,就推薦他上首頁吧^_^
0371-86068866
4008887269
cndesign@163.com
CND設(shè)計網(wǎng)(CNDESIGN)會員所發(fā)布展示的 “原創(chuàng)作品/文章” 版權(quán)歸原作者所有,任何商業(yè)用途均需聯(lián)系作者。如未經(jīng)授權(quán)用作他處,作者將保留追究侵權(quán)者法律責(zé)任的權(quán)利。
Copyright ©2006-2019 CND設(shè)計網(wǎng)