福州印秀設(shè)計地圖

福州印秀設(shè)計

公司地址:福州市臺江區(qū)華興廣場1區(qū)5座3樓(達道一號)
公司電話:0591-8348 9135
服務(wù)熱線:400-800-9135
咨詢電話①:189 6508 9135 (張先生)
咨詢電話②:189 5031 4835 (張先生)
咨詢電話③:134 0599 8886 (何小姐)
公司網(wǎng)站:m.buildingsnationwide.com
QQ 咨詢:44454117

福州印秀設(shè)計logo 福州印秀設(shè)計微信二維碼

在線客服

電話①:189 6508 9135(張先生)
電話②:134 0599 8886(何小姐)
電話③:0591-83489135

設(shè)計文章


五條經(jīng)驗教你圖標的輔助圖形如何設(shè)計?


最近發(fā)現(xiàn)大家在做圖標練習(xí)的時候,經(jīng)常會在一些輔助圖形上遇到問題。今天彩云想分享一些自己的經(jīng)驗,希望對大家有些幫助。

什么是圖標輔助圖形?

很多人知道品牌設(shè)計中有輔助圖形的概念,輔助圖形對于品牌識別體系非常重要,但其實在圖標設(shè)計時,也會經(jīng)常用到輔助圖形。圖標中的輔助圖形,簡單理解就是圖標的裝飾元素,它能讓圖標設(shè)計有更多的細節(jié)和特點,強化圖標識別性,同時還能讓圖標更具視覺表現(xiàn)力。

舉個例子,像下面這套圖標中的淺色部分和噪點就是圖標中的輔助圖形,去掉這些輔助圖形不大會影響圖標的識別性,但增加這些輔助圖形后,圖標變得更有特點,更容易被記住。

五條經(jīng)驗教你圖標的輔助圖形如何設(shè)計

如何用好圖標輔助圖形?

善用輔助圖形為圖標增強表現(xiàn)力是圖標設(shè)計中的一個秘密武器,彩云在工作中總結(jié)了一些經(jīng)驗,大概有以下 5 點:

1. 盡量讓輔助圖形有意義

《簡約至上》這本書中提到過一個刪除原則:刪除是將不必要的元素都剔除掉,直到不能再刪除為止。那么在圖標設(shè)計中,這一點尤為重要,因為圖標本身就濃縮了大量的信息,所以要讓用到的輔助圖形有它存在的價值,不加多余的元素。

比如下面這個案例,容易看出其中的輔助圖形是綠色部分。在圖標中它們代表的是行動或者結(jié)果,作為事物主體的補充,可以理解為主語和賓語的關(guān)系。因為有了這樣的輔助圖形存在,強化了圖標的識別性,這就能讓圖標增色不少。

五條經(jīng)驗教你圖標的輔助圖形如何設(shè)計

下面這個案例是一位同學(xué)的練習(xí),整體來說還是不錯的,但就輔助圖形的使用上看就有些小問題了。淡黃色的輔助圖形圓形跟主體圖形沒有太大的關(guān)聯(lián),也沒有太多實際意義,可以理解為強行為了統(tǒng)一而統(tǒng)一。圖標主體已經(jīng)做了雙色設(shè)計,增加這些圓形后讓圖標變得比較復(fù)雜且刪除對圖標意義的表達也沒影響,所以這里的輔助圖形的使用稍顯多余。

五條經(jīng)驗教你圖標的輔助圖形如何設(shè)計

2. 結(jié)合品牌色

在配色上,輔助圖形還可以結(jié)合品牌色彩。用品牌色的主色作為主體顏色,輔助色作為輔助圖形的顏色,或者直接用品牌主色調(diào)作為輔助圖形的配色都可以作為圖標設(shè)計的亮點。

品牌色的加入,能夠讓圖標配色的使用找到立足的理由,馬上就能加分。

比如大家經(jīng)常在畫圖標的時候,圖標主體通常以單色為主,但此時可以嘗試加入以品牌色裝飾元素作為點綴,立馬就能提升圖標細節(jié)。下面這個案例是愛奇藝的首頁圖標設(shè)計,能看出來它的輔助圖形設(shè)計配色上是按品牌綠色來設(shè)計的。

五條經(jīng)驗教你圖標的輔助圖形如何設(shè)計

3. 避免太過一致

在使用輔助圖形的時候,尤其是對于多圖標體系來說,完全一致的輔助圖形就顯得比較呆板,缺乏細節(jié)。再拿上面那個同學(xué)的練習(xí)來看,不看輔助圖形的具體含義和復(fù)雜度,在整體上看起來也缺乏變化,圓形都在同一個位置,保持著同一個大小和顏色。

五條經(jīng)驗教你圖標的輔助圖形如何設(shè)計

輔助圖形的使用想要有更好的效果,盡量在一定的范圍能多一些變化。

比如下面這個例子,雖然圖形的位置和大小都一樣,但在顏色上做了不同的變化,整體看來細節(jié)度還是不錯的。

五條經(jīng)驗教你圖標的輔助圖形如何設(shè)計

再比如下面這個案例,輔助圖形的使用有豐富的變化,使得圖標的細節(jié)滿滿。

五條經(jīng)驗教你圖標的輔助圖形如何設(shè)計

另外值得注意的是,變化應(yīng)該在一定的范圍,不可以變化太大。

比如另一位同學(xué)的練習(xí),她在圖標的底部用了淺色的藍色填充作為輔助圖形,但這 3 個之間的輔助圖形差異太大,前面 2 個還能理解是一套,但對于第三個圖標來說,輔助圖形的比例明顯大于前 2 個圖標,顯得不夠統(tǒng)一。

五條經(jīng)驗教你圖標的輔助圖形如何設(shè)計

而對于下面這組圖標來說,藍色的輔助圖形的面積變化相對一致,顯得更為統(tǒng)一。

五條經(jīng)驗教你圖標的輔助圖形如何設(shè)計

4. 不要喧賓奪主

雖然使用圖標輔助圖形會讓圖標顯得更加有特點,但也要分清主次,不應(yīng)該超過圖標本身的核心意義,不能太搶用戶的注意力而影響識別性。

比如下面的案例,圖標主體特征一眼就能識別出來,輔助圖形的加入并不會影響主次關(guān)系。

五條經(jīng)驗教你圖標的輔助圖形如何設(shè)計

一位同學(xué)做的練習(xí),這里的輔助圖形有些太過于搶眼,且蓋在圖標上面影響了一定的圖標識別性。修改方向是如果能把輔助圖形的玻璃質(zhì)感做一個強化,增加一些透明度,把主體元素凸顯出來就會好很多。

五條經(jīng)驗教你圖標的輔助圖形如何設(shè)計

這是另一位同學(xué)的練習(xí),也是同樣的問題,輔助圖形搶了主體元素的風(fēng)頭。修改方向是把輔助圖形改小一些就會好很多。

五條經(jīng)驗教你圖標的輔助圖形如何設(shè)計

她畫這個圖標是臨摹了原作的效果,能看到原作中的星星輔助圖形小一些會好很多。

五條經(jīng)驗教你圖標的輔助圖形如何設(shè)計

5. 風(fēng)格保持一致

圖標輔助圖形也是圖標的一部分,從整體上也需要遵循圖標本身的風(fēng)格體系。

這是一位同學(xué)的練習(xí),輔助圖形用星星是沒問題的,但這里星星的尖角相對于主圖形的圓角來說就顯得風(fēng)格不夠統(tǒng)一,把星星的尖角改為圓角就會好很多。

五條經(jīng)驗教你圖標的輔助圖形如何設(shè)計

這位同學(xué)的作品也是臨摹了原作的效果,能看到在原作中輔助圖形都是以同樣的圓潤圖形為主的,這里就體現(xiàn)了風(fēng)格的一致性。

五條經(jīng)驗教你圖標的輔助圖形如何設(shè)計

比如對照看看 MBE 的圖標風(fēng)格,他的輔助圖形跟主圖形一樣,都是比較圓潤可愛的,這樣看起來整體的風(fēng)格更加統(tǒng)一和諧。

五條經(jīng)驗教你圖標的輔助圖形如何設(shè)計

總結(jié)

以上這 5 點就是彩云關(guān)于圖標輔助圖形的一些個人經(jīng)驗總結(jié),不一定適用于所有場景,僅供參考。

對于圖標來說,輔助圖形經(jīng)常不被重視,以為只是為了讓圖標看起來不單調(diào)就加一些效果堆上去,其實這里面也有很多規(guī)律和要注意的細節(jié)。希望大家能夠合理善用輔助圖形,關(guān)注細節(jié),讓自己設(shè)計的圖標更具亮點。


相關(guān)文章

首頁  電話  咨詢  頂部