圖標(biāo)可能是設(shè)計(jì)師設(shè)計(jì)產(chǎn)品組合中最重要的設(shè)計(jì)示例之一，也是被低估的設(shè)計(jì)示例之一。圖標(biāo)元素幾乎隨處可見(jiàn),，圖標(biāo)的設(shè)計(jì)可以與眾不同,，也可以為項(xiàng)目增添用戶體驗(yàn)和視覺(jué)美感。

今天讓我們來(lái)看看什么是2021-2022比較熱的趨勢(shì),。

01

手繪圖標(biāo)

手繪圖標(biāo)不僅是一種時(shí)尚風(fēng)格,，而且還可以為設(shè)計(jì)項(xiàng)目營(yíng)造出更貼心、更真實(shí)的感覺(jué),。這些圖標(biāo)的樣式可能差別很大,，從簡(jiǎn)單的形狀和線條到全彩圖標(biāo)。

手繪樣式很多實(shí)際上不必自己繪制它們,。網(wǎng)站上有很多手繪圖標(biāo)集可免費(fèi)商業(yè)使用,，所以只需要找到你想要的風(fēng)格。

02

具有深度的圖標(biāo)

創(chuàng)建圖標(biāo)設(shè)計(jì)的深度有些棘手,，但更多的設(shè)計(jì)師使用超大圖標(biāo)集的趨勢(shì),。使用陰影和幾何形狀創(chuàng)建正確的形狀組合，并添加幾乎三維效果的元素,。這些風(fēng)格很有趣,，有時(shí)使用趨勢(shì)變化的來(lái)來(lái)去去，如長(zhǎng)陰影,。

這些圖標(biāo)往往在更復(fù)雜的一面,，最適合使用圖標(biāo)是相當(dāng)大的或與另一個(gè)元素，如文本的標(biāo)志組合工作,。

03

懸停的圖標(biāo)

當(dāng)涉及到 Web 的圖標(biāo)時(shí),，最流行方式是以創(chuàng)建懸停狀態(tài)或動(dòng)畫(huà)的方式配對(duì)一組圖標(biāo)。這可能包括使用帶有顏色填充的圖標(biāo),，然后不使用或幾乎在圖標(biāo)周?chē)鷦?chuàng)建一個(gè)按鈕,。

如果設(shè)計(jì)使用某種帶有圖標(biāo)的懸停狀態(tài)，在圖標(biāo)設(shè)計(jì)階段就要考慮這一點(diǎn),。并非所有的圖標(biāo)或圖標(biāo)集都針對(duì)此技術(shù)進(jìn)行了優(yōu)化,。尋找一個(gè)完整的圖標(biāo)設(shè)置與變化，使創(chuàng)建懸停狀態(tài)容易得多,。

不用變得太復(fù)雜,，一個(gè)復(fù)雜設(shè)計(jì)的圖標(biāo)可能會(huì)丟失與懸停狀態(tài)，簡(jiǎn)單即可,。 

04

簡(jiǎn)化圖標(biāo)

即使是以前具有復(fù)雜圖標(biāo)樣式的網(wǎng)站和設(shè)計(jì),，也正在轉(zhuǎn)向更精簡(jiǎn)和簡(jiǎn)化的圖標(biāo),。他們的好處在于,，每個(gè)圖標(biāo)都描繪了一個(gè)可識(shí)別的東西，但表示并不總是 100% 字面意思,。圖標(biāo)設(shè)計(jì)者可以自由使用形狀或線條來(lái)創(chuàng)建圖標(biāo)形狀,，這是它所代表的項(xiàng)目的最簡(jiǎn)單版本,。

05

帶有顏色形狀的線圖標(biāo)

線圖標(biāo)是一個(gè)非常受歡迎的設(shè)計(jì)選擇，有多種多樣的風(fēng)格,，看起來(lái)不錯(cuò),，簡(jiǎn)約的設(shè)計(jì)元素。這種趨勢(shì)增加了多一點(diǎn)視覺(jué)興趣與流行的顏色,，往往以圓或正方形的形式,。在線圖標(biāo)后面，顏色形狀可能填充線圖標(biāo)設(shè)計(jì)的一部分,，但更多時(shí)候,，它只是漂浮在背景。這種微小的視覺(jué)興趣可以將圖標(biāo)集連接在一起,，強(qiáng)調(diào)品牌顏色,，或者只是刷新舊的線條圖標(biāo)站點(diǎn)。

圖標(biāo)設(shè)計(jì)的棘手部分是顏色形狀元素的位置和大小,。如果它太大或太亮的顏色,，它可以帶走圖標(biāo)。如果形狀太小,，可能會(huì)把它看起來(lái)像是一個(gè)錯(cuò)誤表示,。

雖然沒(méi)有完美的大小，但大多數(shù)使用此趨勢(shì)的圖標(biāo)將顏色形狀保持在圖標(biāo)完整尺寸的四分之一左右,。

06

抽象圖標(biāo)形狀

在不確定哪個(gè)圖標(biāo)表示想要的內(nèi)容,？抽象的圖標(biāo)形狀可能是答案。

越來(lái)越多的設(shè)計(jì)師正在創(chuàng)建抽象風(fēng)格的圖標(biāo),，這種風(fēng)格和趨勢(shì)的好處是,，抽象風(fēng)格創(chuàng)造了一種異想天開(kāi)的感覺(jué)。

處理抽象形狀的關(guān)鍵是確保您不會(huì)錯(cuò)誤地復(fù)制某些東西,，并且圖標(biāo)確實(shí)是抽象的,。（例如，不要嘗試創(chuàng)建類似于徽標(biāo)的圖標(biāo),，它們可能看起來(lái)就像錯(cuò)誤一樣,。對(duì)于真正匹配的，應(yīng)該使用相同的調(diào)色板來(lái)表示圖標(biāo)和品牌材料,。

07

原色

原色是小型設(shè)計(jì)元素的大膽,、明亮和引人入勝的選擇。此圖標(biāo)設(shè)計(jì)趨勢(shì)利用紅色,、藍(lán)色,、綠色和黃色（以及紫色和橙色）創(chuàng)建一組基本的顏色規(guī)則。使這種風(fēng)格工作的重點(diǎn)是顏色，以吸引人們對(duì)屏幕上的小元素的關(guān)注,。原色脫穎而出,，從所有"材料"亮度，一直占主導(dǎo)地位的色調(diào),。

08

帶有背景

此趨勢(shì)通常使用顏色和陰影來(lái)區(qū)分主焦圖標(biāo)和背景圖標(biāo),。主圖標(biāo)通常是全彩色或填充圖標(biāo)。背景圖標(biāo)幾乎總是線條風(fēng)格,，可能是淺色,。

可以通過(guò)以不同的方式混合來(lái)匹配圖標(biāo)，許多預(yù)制的圖標(biāo)套件創(chuàng)建此效果,。類似主題的圖標(biāo)創(chuàng)建深度和視覺(jué)興趣,，并堅(jiān)持使用少量元素，以防止場(chǎng)景變得過(guò)于繁雜,。不要害怕在背景和前景中使用和重用元素（可交替行和填充）,。

09

雙色圖標(biāo)

另一個(gè)基于流行線圖標(biāo)樣式的圖標(biāo)設(shè)計(jì)趨勢(shì)是創(chuàng)建雙色元素。

雙色圖標(biāo)可以建立在您現(xiàn)有的調(diào)色板或品牌顏色的基礎(chǔ)上,，或幾乎結(jié)合任何其他顏色對(duì),。使用圖標(biāo)趨勢(shì)進(jìn)行設(shè)計(jì)時(shí)，請(qǐng)查找從計(jì)劃使用圖標(biāo)的背景中脫穎而出的顏色對(duì),。

在設(shè)計(jì)方面,，為大多數(shù)圖標(biāo)選擇主要顏色。使用次要顏色來(lái)強(qiáng)調(diào)圖標(biāo)的元素,。（考慮使用 70%~80% 的設(shè)計(jì)）

10

圖標(biāo)“速記”

如果在瀏覽任何應(yīng)用商店,，你應(yīng)該有看到許多常見(jiàn)的標(biāo)記 - 郵件應(yīng)用的信封，檢查生產(chǎn)力應(yīng)用程序,，鎖定安全應(yīng)用程序,。

此圖標(biāo)速記提供了一個(gè)快速的視覺(jué)消息，告訴用戶應(yīng)用程序的作用,。同樣的速記幾乎普遍適用于所有的圖標(biāo)設(shè)計(jì),。當(dāng)設(shè)計(jì)師們嘗試以自己的風(fēng)格使用圖標(biāo)時(shí)，人們傾向于使用圖標(biāo)來(lái)快速表達(dá)特定的含義,。

圖標(biāo)很容易看了一眼,，一目了然。圖標(biāo)應(yīng)幫助用戶知道他們應(yīng)該做什么,，以及他們應(yīng)該如何與設(shè)計(jì)交互,。這個(gè)常見(jiàn)的圖標(biāo)速記是一個(gè)很好的表達(dá)到這一點(diǎn)。

11

鮮艷的顏色

明亮的顏色選擇在設(shè)計(jì)的方方面面都很重要,。明亮的顏色是吸引眼球的圖標(biāo)的誘人方式,。當(dāng)涉及到圖標(biāo)設(shè)計(jì)趨勢(shì)時(shí),，顏色正以幾種不同的方式使用：

1.作為具有白色或黑色線式圖標(biāo)的背景；

2.對(duì)于全彩色圖標(biāo)元素,，具有更逼真的外觀；

3.對(duì)于具有更平坦,、梯度或超亮設(shè)計(jì)的圖標(biāo)元素,；

明亮的流行顏色選擇包括黃色、藍(lán)色,、綠色和紫色,。

12

logo中的圖標(biāo)

注意有多少logo具有圖標(biāo)。一旦你開(kāi)始思考它,，看到logo設(shè)計(jì)的小圖標(biāo)是很少很難的,。

logo中的圖標(biāo)的好處是，它與品牌名稱配合工作,，并且有一定的時(shí)間和品牌公平性可以獨(dú)立,。上面的例子 Spotify 。盡管音樂(lè)提供商（在品牌范圍內(nèi)）沒(méi)有出現(xiàn)這么久,，但三行的圓圈是高度可識(shí)別的,。

該圖標(biāo)以彩色工作，無(wú)需強(qiáng)圖標(biāo)的鍵 ,， 可以獨(dú)立或與字母,。這種多功能性使得很容易理解為什么圖標(biāo)是logo設(shè)計(jì)中受歡迎的元素。

13

圈

圓圈是最和諧的形狀之一,。當(dāng)涉及到圖標(biāo)設(shè)計(jì),，他們是相當(dāng)受歡迎的。從球體內(nèi)的圖標(biāo)到物體內(nèi)的圓圈,，使用圓圈創(chuàng)建設(shè)計(jì)標(biāo)記可以為用戶建立恰到好處的感覺(jué),。

圓圈在圖標(biāo)設(shè)計(jì)中的部分影響可能與谷歌與材料設(shè)計(jì)提出的一些準(zhǔn)則聯(lián)系起來(lái)。所有這些圓形按鈕都非常適合點(diǎn)擊手機(jī),。同樣的理念也適用于圖標(biāo)設(shè)計(jì),。（試想一下圖標(biāo)是可觸摸或可點(diǎn)擊元素的頻率）

創(chuàng)建圓形圖標(biāo)時(shí)，請(qǐng)確保圖標(biāo)設(shè)計(jì)的內(nèi)容在小尺寸下易于理解,，因?yàn)槟仨毥?jīng)?？s小圖標(biāo)以適應(yīng)其他地方。

14

線風(fēng)格圖標(biāo)設(shè)計(jì)

線風(fēng)格圖標(biāo)似乎是永遠(yuǎn)不會(huì)過(guò)時(shí)的趨勢(shì),。部分原因在于,，這種圖標(biāo)樣式幾乎可以應(yīng)用在任何背景類型上的任何地方。

在上面的示例中很容易看到這一點(diǎn),。每個(gè)圖標(biāo)幾乎在任何尺寸上都兼容,，展示也很美觀,。

15

簡(jiǎn)單元素和表示

與 2021 年的大多數(shù)其他設(shè)計(jì)趨勢(shì)一樣，簡(jiǎn)單性也是圖標(biāo)設(shè)計(jì)的一部分,。簡(jiǎn)單的形狀和意思理解表示組合在一起,，用簡(jiǎn)單的設(shè)計(jì)元素表示。使用戶看起來(lái)是一個(gè)相當(dāng)巧妙的設(shè)計(jì),。

在使用上面的食物圖標(biāo)的示例中,，每個(gè)圖標(biāo)都使用圖標(biāo)中圓圈的常見(jiàn)線程。這可能是圖標(biāo)本身的整體形狀或圖標(biāo)設(shè)計(jì)的一部分,。此形狀使項(xiàng)目中的每個(gè)圖標(biāo)得到統(tǒng)一,。

16

帶漸變的圖標(biāo)

漸變色彩趨勢(shì)已成為 2022 年的主要主題之一，也是圖標(biāo)設(shè)計(jì)的一個(gè)趨勢(shì),。從線筆畫(huà)中的簡(jiǎn)單漸變（如上圖所示）,、全漸變著色、漸變背景上的白色圖標(biāo),，這幾種漸變配色方式很受歡迎,。

17

專注簡(jiǎn)單著色

圖標(biāo)也經(jīng)常采取了相反的顏色方法，并堅(jiān)持簡(jiǎn)單,，更有限,，更基本的色調(diào)作為這些小的設(shè)計(jì)元素。使用有限的色調(diào)是一個(gè)好主意,。設(shè)計(jì)小元素,，太多的顏色或細(xì)節(jié)會(huì)迅速壓倒空間，并造成眼睛的壓力,。

小元素在色調(diào)上的使用可以使每個(gè)單個(gè)圖標(biāo)更容易看到和理解,。對(duì)于小的圖標(biāo)，這一點(diǎn)最為重要,。

18

厚,、均勻的筆畫(huà)

不僅線式圖標(biāo)很受歡迎，并且具有粗線筆畫(huà)的圖標(biāo)也是很受歡迎,。這些圖標(biāo)通常專為單色應(yīng)用設(shè)計(jì),，通常以白色或黑色在顏色或照片背景之上使用。具有厚重,、均勻筆畫(huà)的圖標(biāo)最常使用,，例如車(chē)圖標(biāo)或聯(lián)系圖標(biāo)。

19

表情符號(hào)

表情符號(hào)幾乎已經(jīng)成為他們自己的語(yǔ)言（一種更直觀的交流形式）,，越來(lái)越被人們所接受,。

圖標(biāo)設(shè)計(jì)也具有表情符號(hào)式的天賦。這些圖標(biāo)是可識(shí)別的,，因?yàn)殛P(guān)注一個(gè)人或生物的頭部形狀,。（上面受星球大戰(zhàn)啟發(fā)的表情符號(hào)圖標(biāo)是如何與圖標(biāo)設(shè)計(jì)玩得開(kāi)心的一個(gè)很好的例子）,。

這種圖標(biāo)風(fēng)格可用于聯(lián)系頁(yè)面或在設(shè)計(jì)中代表人員或角色。

如何設(shè)計(jì)更好的圖標(biāo)

制作一個(gè)好的圖標(biāo)或圖標(biāo)集不僅僅是跳到圖標(biāo)設(shè)計(jì)中的一些最新趨勢(shì),。由于圖標(biāo)體積小,，注重細(xì)節(jié)和精度是設(shè)計(jì)過(guò)程的重要組成部分。對(duì)于 2021-2022年的圖標(biāo)設(shè)計(jì),，簡(jiǎn)單的規(guī)則仍然適用,。將這些指南與上面的一些趨勢(shì)想法配對(duì)，以創(chuàng)建您喜歡的東西：

01.從網(wǎng)格開(kāi)始

02.用幾何形狀構(gòu)建

03.創(chuàng)建獨(dú)特的形狀

04.給圖標(biāo)足夠的空間

05.堅(jiān)持您的品牌顏色

06.使用一致的二重奏

07.為最小尺寸設(shè)計(jì)所需的

08.不要裝飾

原文來(lái)源：designshack.net

作者：Carrle cousins