如何設(shè)計優(yōu)秀的網(wǎng)站ICON圖標(biāo)

2021-06-05 分類：網(wǎng)站建設(shè)

圖標(biāo)設(shè)計，即icon設(shè)計在界面設(shè)計中占有很重要的位置，決定一個界面風(fēng)格的重要構(gòu)成元素。一個好的圖標(biāo)，可以讓用戶“一秒即懂”，如何設(shè)計出優(yōu)秀的圖標(biāo)？
  圖標(biāo)的類型多種多樣，總共分為三大類：工具圖標(biāo)，裝飾圖標(biāo)，啟動圖標(biāo)。其中風(fēng)格多種多樣。主要風(fēng)格有大體有這些：
  工具圖標(biāo)：線性風(fēng)格、面性風(fēng)格、混合風(fēng)格
  裝飾圖標(biāo)：扁平風(fēng)格、擬物風(fēng)格、2.5D風(fēng)格、炫彩漸變風(fēng)格、實物貼圖風(fēng)格
  啟動圖標(biāo)：文字形式、圖形形式、圖標(biāo)形式、插畫形式、擬物形式
  優(yōu)秀的圖標(biāo)都有哪些特點？
01.易識別
  圖標(biāo)必須第一時間傳達(dá)最重要的信息。當(dāng)圖標(biāo)不能夠立刻表達(dá)出所代表含義時，它就會變成一種“視覺噪音”，失去了圖標(biāo)存在的意義。優(yōu)秀的圖標(biāo)即不用閱讀標(biāo)簽或文字提示，就可以被認(rèn)知理解。
02.視覺舒適

可以通過插畫、顏色以及圖標(biāo)傳達(dá)品牌個性。如果做得好，圖標(biāo)肯定可以增強(qiáng)設(shè)計的美感。限制顏色使用數(shù)量，使用不超過3或4種顏色，保持設(shè)計簡潔。通過聚焦于對象的基本特征，來減少圖形設(shè)計細(xì)節(jié)的數(shù)量。盡量保持設(shè)計的概要性，因為設(shè)計概要性的在不同的界面和分辨率都可以進(jìn)行轉(zhuǎn)換。

設(shè)計優(yōu)秀的網(wǎng)站ICON圖標(biāo)

03.合適尺寸
  圖標(biāo)應(yīng)該很好地作為用戶的目標(biāo)點。參考：目標(biāo)在屏幕中點擊范圍為7-10mm。并且，請確保在目標(biāo)對象之間添加填充，以防止不準(zhǔn)確的點擊。
04.一致性
  當(dāng)使用相似的元素且具有一致的外觀和功能時，可以讓可用性和可學(xué)習(xí)性都得到提升改善。
a.內(nèi)部一致性
  圖標(biāo)設(shè)計應(yīng)該保持視覺統(tǒng)一，你決定用于你的產(chǎn)品的圖標(biāo)，應(yīng)該保持統(tǒng)一樣式。理想情況下，它們看起來應(yīng)該是一位設(shè)計師設(shè)計的。以下是你需要遵循的關(guān)于創(chuàng)造統(tǒng)一性的幾條原則：1.使用相同顏色或者顏色組合在你的圖標(biāo)上；2.使用相同的形狀和其他樣式屬性（例如邊框的大?。?。

b.與平臺保持一致

確保你的目標(biāo)風(fēng)格與平臺一致，它們會讓用戶更容易去理解。

設(shè)計優(yōu)秀的網(wǎng)站ICON圖標(biāo)

c.與整個產(chǎn)品風(fēng)格保持一致
如果你擁有整個產(chǎn)品系列，確保一致的圖標(biāo)風(fēng)格（或至少類似）應(yīng)用在你所有的產(chǎn)品中。
作者：Nick Babich

翻譯：JaylonG

分享題目：如何設(shè)計優(yōu)秀的網(wǎng)站ICON圖標(biāo)
網(wǎng)址分享：http://m.kartarina.com/news25/116425.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供ChatGPT、網(wǎng)站建設(shè)、響應(yīng)式網(wǎng)站、手機(jī)網(wǎng)站建設(shè)、網(wǎng)站導(dǎo)航、外貿(mào)網(wǎng)站建設(shè)

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時需注明來源：創(chuàng)新互聯(lián)

猜你還喜歡下面的內(nèi)容

英文版企業(yè)網(wǎng)站的設(shè)計注意事項 2021-06-05
題材和內(nèi)容的選擇 2021-06-05
APP圖標(biāo)設(shè)計方法 2021-06-05
優(yōu)秀網(wǎng)站的首頁 2021-06-05
網(wǎng)頁版式設(shè)計如何增強(qiáng)空間層次感 2021-06-05