中文字幕无码av不卡一区,亚洲综合AV永久无码精品一区二区,黑人巨大白妞出浆,黄色高清无码免费看,久久久久免费精品国产,久久无码人妻丰满熟妇区毛片,欧美日韩国产综合草草,久久福利网站,亚洲一区二区三区中文字幕在线,av国内精品久久久久影院

“識(shí)別性”、“符合行為習(xí)慣”、“原創(chuàng)性”、“易用性”……這是大家常說(shuō)的幾個(gè)圖標(biāo)設(shè)計(jì)大原則。而今天作者結(jié)合自身的實(shí)戰(zhàn)經(jīng)驗(yàn)，分享幾個(gè)接地氣的設(shè)計(jì)原則，希望在你的實(shí)際工作中能夠有所受益。

圖標(biāo)設(shè)計(jì)是界面設(shè)計(jì)最重要的組成部分之一，作為UI視覺(jué)設(shè)計(jì)師，這項(xiàng)技能已經(jīng)是我們必須要掌握的基本技能，那圖標(biāo)設(shè)計(jì)要遵循什么樣的原則呢？

“識(shí)別性”、“符合行為習(xí)慣”、“原創(chuàng)性”、“易用性”···

上面這些原則都是大的標(biāo)準(zhǔn)，在圖標(biāo)設(shè)計(jì)的時(shí)候起到了指導(dǎo)性的意義，但是這些規(guī)則其實(shí)都被大家說(shuō)爛了，如果你對(duì)上面這幾點(diǎn)還不太了解，可以自行百度一下，這里我就不多說(shuō)了，我要分享的是能夠幫助你提升專(zhuān)業(yè)度的一些實(shí)戰(zhàn)經(jīng)驗(yàn)，如果你所做的圖標(biāo)能做到以下這幾點(diǎn)，那么恭喜你，你及格了！

本文沒(méi)有對(duì)圖標(biāo)進(jìn)行詳細(xì)的分類(lèi)，所談范圍也只是app中一些功能性圖標(biāo)的設(shè)計(jì)經(jīng)驗(yàn)。

還是先來(lái)看下大綱：

• 一、像素對(duì)齊
• 二、多用布爾運(yùn)算
• 三、獨(dú)特的風(fēng)格
• 四、視覺(jué)大小的統(tǒng)一
• 五、2017年圖標(biāo)的流行趨勢(shì)預(yù)測(cè)

一、像素對(duì)齊

我記得以前在小公司的時(shí)候，一個(gè)人負(fù)責(zé)整個(gè)app的交互設(shè)計(jì)與視覺(jué)設(shè)計(jì)，設(shè)計(jì)團(tuán)隊(duì)只有兩個(gè)人，有什么問(wèn)題都沒(méi)人可以請(qǐng)教，當(dāng)時(shí)困惑我最大的一個(gè)問(wèn)題就是：為什么我做的圖標(biāo)總是發(fā)虛的呢？直到來(lái)了大公司和前輩們學(xué)習(xí)之后，才知道原來(lái)是因?yàn)橄袼貨](méi)有對(duì)齊。

我們來(lái)看下面這張圖：

圖片背景的網(wǎng)格就是我們所說(shuō)的像素網(wǎng)格，我標(biāo)明紅點(diǎn)是想告訴大家，第一條豎線做到了像素對(duì)齊，而第二條豎線沒(méi)有做到。我們沒(méi)有看到二者的區(qū)別是因?yàn)楝F(xiàn)在是在矢量圖形的環(huán)境下顯示的，如果導(dǎo)出來(lái)圖片就會(huì)變成下面這樣：

這就是圖標(biāo)發(fā)虛的原因，因?yàn)槲覀儧](méi)有嚴(yán)格的做到像素對(duì)齊，尤其是在做較小尺寸的圖標(biāo)時(shí)，如果不嚴(yán)格的遵循像素對(duì)齊，那最終的顯示效果就會(huì)出現(xiàn)問(wèn)題，比如說(shuō)下面這種情況：

所以在你通往專(zhuān)業(yè)UI設(shè)計(jì)師的路上，這一點(diǎn)是必須要注意的。

多用布爾運(yùn)算

在做圖標(biāo)的時(shí)候，能用基本圖形進(jìn)行布爾運(yùn)算的時(shí)候，盡量不要使用鋼筆，這樣做的好處有如下幾點(diǎn)：

• 讓你的圖標(biāo)更加規(guī)范
• 對(duì)圖形結(jié)構(gòu)理解更加深刻
• 后期更改形狀更加方便

舉個(gè)例子，下面這個(gè)圖標(biāo)：

如果我們使用鋼筆直接去畫(huà)，其實(shí)我們很難畫(huà)的特別規(guī)范，而且后期調(diào)整也很麻煩，最正確的方法就是去思考他的結(jié)構(gòu)，這樣一個(gè)外形是否可以使用基本圖形進(jìn)行組合來(lái)實(shí)現(xiàn)，在經(jīng)過(guò)思考與嘗試后，我們會(huì)發(fā)現(xiàn)，其實(shí)他是用一個(gè)圓形和三個(gè)矩形組合而成的，如下圖：

在平時(shí)，我們可以多去嘗試分析并練習(xí)一些好看的圖標(biāo)或者真實(shí)的物體，去理解其中的結(jié)構(gòu)與制作方法，當(dāng)你積累的經(jīng)驗(yàn)足夠多時(shí)，你就可以很自如的去設(shè)計(jì)你想要的精美圖標(biāo)了。

三、獨(dú)特的風(fēng)格

作為專(zhuān)業(yè)視覺(jué)設(shè)計(jì)師的你，在時(shí)間充足的情況下，千萬(wàn)不要去網(wǎng)上下幾個(gè)圖標(biāo)直接拿來(lái)用，你會(huì)上癮的，并且也會(huì)被一些行內(nèi)人進(jìn)行批判，因?yàn)樗麄兒苋菀拙湍芸闯鰜?lái)你做的圖標(biāo)是直接在網(wǎng)上下載的，比如下面這樣的圖標(biāo)：

我們?cè)谧鱿盗袌D標(biāo)的時(shí)候，一定要在前期給圖標(biāo)設(shè)定一個(gè)風(fēng)格及原則，使之看起來(lái)與眾不同，例如下面的圖標(biāo)：

一眼看上去，我們就可以看出上面圖標(biāo)的特點(diǎn)，線條是斷開(kāi)的、所有的圖標(biāo)都是一筆畫(huà)出來(lái)的，這些都可以讓你的圖標(biāo)變得與眾不同。再比如你也可以從顏色上做文章，如下圖：

其實(shí)方法還有很多，大家可以多多嘗試與創(chuàng)新。

在這里值得一提就是，我們?cè)谧鼍€性圖標(biāo)時(shí)，一定要保證描邊粗細(xì)相同、圓角相同，如果這些基礎(chǔ)的規(guī)則都沒(méi)有遵循，那也就談不上風(fēng)格的統(tǒng)一、創(chuàng)新了。

四、視覺(jué)大小統(tǒng)一

看上面這張圖，同樣都是44x44px尺寸的形狀，方形就會(huì)比圓形看著大一些，雖然我們統(tǒng)一了物理尺寸，但是在視覺(jué)大小上沒(méi)有進(jìn)行統(tǒng)一。

在進(jìn)行圖標(biāo)設(shè)計(jì)的時(shí)候，我們會(huì)使用柵格輔助線來(lái)幫助我們更加嚴(yán)格謹(jǐn)慎，但一定不要被輔助線困住，學(xué)會(huì)靈活運(yùn)用，保持視覺(jué)上的大小統(tǒng)一。

再舉個(gè)英文字體的例子，如下圖：

雖然在設(shè)計(jì)的時(shí)候，使用了輔助線，但是設(shè)計(jì)者并沒(méi)有被輔助線所束縛，為了達(dá)到視覺(jué)大小的統(tǒng)一，將曲線字母（例如o）進(jìn)行了適當(dāng)?shù)姆糯?，這樣整體看起來(lái)才會(huì)和諧穩(wěn)固。

設(shè)計(jì)圖標(biāo)的時(shí)候也是一樣，不僅僅是圖標(biāo)的大小，包括元素與元素的距離、正形與負(fù)形的比例都是我們需要考慮的內(nèi)容，如果有哪些內(nèi)容自己還不太清楚，那就需要利用業(yè)余的時(shí)間去好好補(bǔ)充一下系統(tǒng)知識(shí)了。

五、2017年圖標(biāo)的流行趨勢(shì)預(yù)測(cè)

觀察了很多app的改版，發(fā)現(xiàn)功能性圖標(biāo)的變化趨勢(shì)在某種程度上有一定的共性可尋，在這里我來(lái)分享兩個(gè)自己的預(yù)測(cè)：

1.利用局部顏色差異來(lái)突顯圖標(biāo)風(fēng)格

這種風(fēng)格一直出現(xiàn)在dribbble網(wǎng)站上的概念圖標(biāo)，現(xiàn)在也慢慢的在移動(dòng)app上面使用起來(lái)，如果現(xiàn)在你正在尋找圖標(biāo)風(fēng)格，這個(gè)方向不妨一試。

2.閱讀類(lèi)app圖標(biāo)的無(wú)色化

底部導(dǎo)航圖標(biāo)的無(wú)色化風(fēng)格，在閱讀類(lèi)app開(kāi)始慢慢流行起來(lái)，這種情況也可以理解，是為了讓用戶(hù)更好的聚焦閱讀內(nèi)容，優(yōu)化閱讀體驗(yàn)。

但不知道以后其它類(lèi)型的app圖標(biāo)會(huì)不會(huì)也走這個(gè)風(fēng)格路線呢？

以上就是我本次分享的內(nèi)容，其實(shí)一些很基本的原則，例如：識(shí)別性、易用性，也都是十分重要的，但我覺(jué)得沒(méi)什么好解釋的，就沒(méi)有特別拿出來(lái)闡述，希望大家能把所有重要的原則都銘記于心，不斷地分析、練習(xí)，也許未來(lái)的圖標(biāo)設(shè)計(jì)大師就是你了！

作者：菜心（微信公眾號(hào)：菜心設(shè)計(jì)鋪），華為ITUX用戶(hù)體驗(yàn)設(shè)計(jì)師（主視覺(jué)）

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