圖標(biāo)設(shè)計(jì)的7大核心原則

0 評(píng)論 3632 瀏覽 15 收藏 8 分鐘

我們經(jīng)常能夠在網(wǎng)站上看到各色各樣的圖標(biāo)設(shè)計(jì),這些圖標(biāo)是通過(guò)什么核心原則設(shè)計(jì)出來(lái)的?本文總結(jié)了7個(gè)核心原則,通過(guò)大量真實(shí)示例展示了這些原則在實(shí)際中的應(yīng)用,一起來(lái)看看吧。

在打造高質(zhì)量的圖標(biāo)系列時(shí),需遵循深思熟慮的方法,具備訓(xùn)練有素的眼光,進(jìn)行反復(fù)迭代和大量實(shí)踐。以下是圖標(biāo)設(shè)計(jì)的七個(gè)核心原則,通過(guò)大量真實(shí)示例展示了這些原則在實(shí)際中的應(yīng)用,旨在讓讀者深入了解出色圖標(biāo)設(shè)計(jì)的關(guān)鍵屬性。

一、清晰度

圖標(biāo)的首要目標(biāo)是迅速傳達(dá)概念。在設(shè)計(jì)中,避免使用不熟悉的隱喻,確保圖標(biāo)在不同文化、年齡和背景中都能被理解。借鑒汽車(chē)信號(hào)裝置標(biāo)準(zhǔn)化的成功案例,考慮使用能引起共鳴的隱喻和顏色,使圖標(biāo)更易理解。

當(dāng)圖標(biāo)使用不熟悉的隱喻時(shí),很難理解。安全帶“提示燈”(左三)比較字面,我們很快就能掌握。“電動(dòng)助力轉(zhuǎn)向系統(tǒng)警告燈”(最右邊)更加模糊。隨著時(shí)間的推移,抽象的東西可以通過(guò)重復(fù)使用變得熟悉。這就是汽車(chē)信號(hào)裝置標(biāo)準(zhǔn)化的原因;目的是建立共同的理解。

以下是一些隨著時(shí)間的推移而逐漸熟悉的圖標(biāo)——代表愛(ài)/最?lèi)?ài)、警告、音樂(lè)和向上/前進(jìn)方向的符號(hào):

圖標(biāo)不僅對(duì)一組人來(lái)說(shuō)很容易理解,而且在不同的文化、年齡和背景中都是通用的??紤]您的聽(tīng)眾并使用能引起他們共鳴的隱喻和顏色。

二、可讀性

一旦圖標(biāo)的概念被理解,確保圖標(biāo)是可讀的。避免細(xì)節(jié)過(guò)多,使用多個(gè)形狀時(shí)要保持足夠的空間。使用清晰、易讀的筆觸,確保圖標(biāo)在不同尺寸下都能清晰展現(xiàn)。

以下剪貼板就存在閱讀性差的問(wèn)題,剪貼板圖標(biāo)看起來(lái)像一個(gè)斑點(diǎn),因?yàn)榧糍N板之間的空間太小了:

使用多個(gè)形狀時(shí),請(qǐng)?jiān)谒鼈冎g留出足夠的空間。更細(xì)的筆畫(huà),以及更多的筆畫(huà),會(huì)使圖標(biāo)更復(fù)雜,更難閱讀。

谷歌地圖在他們的交通圖標(biāo)方面做得非常出色——非常小的尺寸卻非常易讀:

三、簡(jiǎn)潔性

簡(jiǎn)潔是圖標(biāo)設(shè)計(jì)的金科玉律。避免使用過(guò)多的細(xì)節(jié),用適量的細(xì)節(jié)傳達(dá)所需信息。在用戶(hù)界面中,簡(jiǎn)化風(fēng)格可以突出重點(diǎn),為內(nèi)容讓路。

簡(jiǎn)潔適合圖標(biāo)設(shè)計(jì),因?yàn)槲覀兘?jīng)常在小畫(huà)布上工作。為圖標(biāo)使用適量的細(xì)節(jié),不要使用超過(guò)需要的細(xì)節(jié)。在用戶(hù)界面中,簡(jiǎn)化風(fēng)格可以傳達(dá)重點(diǎn)并為內(nèi)容讓路。

四、一致性

為了保持圖標(biāo)系列的和諧感,需要在視覺(jué)上對(duì)齊圖標(biāo)元素。圖標(biāo)的視覺(jué)重量由填充、筆觸粗細(xì)、大小和形狀等參數(shù)決定,在整個(gè)系列中保持這些參數(shù)的一致性,有助于建立整體協(xié)調(diào)感。

任何給定的圖標(biāo)都有一定的視覺(jué)重量,由填充、筆觸粗細(xì)、大小和形狀等參數(shù)決定。在一組中保持這些參數(shù)相同可以建立一致性。


對(duì)于大型圖標(biāo)系列,尤其是涉及多個(gè)作者時(shí),保持一致性并不是一件容易的事。有明確的原則和規(guī)則可供遵循(和遵循)是至關(guān)重要的。

五、個(gè)性

每個(gè)圖標(biāo)集都應(yīng)有獨(dú)特的風(fēng)格,體現(xiàn)品牌個(gè)性,創(chuàng)造獨(dú)特的氛圍。添加一些獨(dú)特的細(xì)節(jié),使圖標(biāo)在大眾中脫穎而出,建立集合的獨(dú)特性。

六、易用性

完善的圖標(biāo)集需要進(jìn)一步測(cè)試和準(zhǔn)備,以確保設(shè)計(jì)者、貢獻(xiàn)者和工程師都能輕松使用。建議構(gòu)建工具來(lái)促進(jìn)圖標(biāo)的創(chuàng)建、生產(chǎn)和使用,并保持有條理、有據(jù)可查。

七、學(xué)習(xí)和迭代

持續(xù)學(xué)習(xí)并迭代圖標(biāo)設(shè)計(jì),考慮現(xiàn)成的隱喻,使用標(biāo)準(zhǔn)化的規(guī)則和原則。在圖標(biāo)設(shè)計(jì)中,不僅僅相信數(shù)字,用眼睛檢查工作,確保圖標(biāo)在上下文中協(xié)調(diào)一致。

八、總結(jié)

在圖標(biāo)設(shè)計(jì)的七大核心原則中,清晰度、可讀性、一致性、簡(jiǎn)潔性、個(gè)性、易用性等方面的考慮是打造高質(zhì)量圖標(biāo)系列的關(guān)鍵。明晰性要求圖標(biāo)能夠快速傳達(dá)概念,而可讀性則確保圖標(biāo)在不同尺寸下清晰可辨。

一致性是為了保持整個(gè)系列的和諧感,而簡(jiǎn)潔性則強(qiáng)調(diào)用適量的細(xì)節(jié)傳達(dá)信息。個(gè)性則賦予圖標(biāo)獨(dú)特的風(fēng)格和品牌氛圍。

最后,易用性不僅要求圖標(biāo)設(shè)計(jì)有條理、有據(jù)可查,還需要構(gòu)建工具來(lái)促進(jìn)圖標(biāo)的創(chuàng)建、生產(chǎn)和使用。

本文由 @唐小白 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理,未經(jīng)許可,禁止轉(zhuǎn)載

題圖來(lái)自 Unsplash,基于 CC0 協(xié)議。

該文觀(guān)點(diǎn)僅代表作者本人,人人都是產(chǎn)品經(jīng)理平臺(tái)僅提供信息存儲(chǔ)空間服務(wù)。

更多精彩內(nèi)容,請(qǐng)關(guān)注人人都是產(chǎn)品經(jīng)理微信公眾號(hào)或下載App
評(píng)論
評(píng)論請(qǐng)登錄
  1. 目前還沒(méi)評(píng)論,等你發(fā)揮!