伊人久久大香线蕉综合影视_日韩精品少妇无码受不了_71pao成人国产永久免费视频_国产伦片中文免费观看_国产高清无码麻豆精品_九色综合伊人久久富二代_日韩黄色精品_日韩A∨精品日韩精品无码

圖標(biāo)設(shè)計(jì)零基礎(chǔ)科普指南

2021-4-23    周周


借著疫情期間在家休假的時(shí)間,將平時(shí)用到的一些零零散散的圖標(biāo)繪制方法與思路進(jìn)行了一次全面的匯總與沉淀。從實(shí)習(xí)期間畫(huà)一組圖標(biāo)的無(wú)從下手,每一個(gè)圖標(biāo)看起來(lái)都像是散裝的一樣,到后來(lái)慢慢學(xué)習(xí)與練習(xí),到現(xiàn)在變得了解了圖標(biāo)的繪制流程,過(guò)程也是比較麻煩,因?yàn)楹苌儆腥娴膱D標(biāo)講解文章,都是看一篇懂一點(diǎn),然后在揉到練習(xí)當(dāng)中。所以本篇文章盡量將圖標(biāo)進(jìn)行細(xì)致一些的流程說(shuō)明,有不足之處還望指教。

圖標(biāo)的可用性

圖標(biāo)可用性,顧名思義就是圖標(biāo)繪制出來(lái)是否能被用戶(hù)所看懂并快速識(shí)別,是否可以為業(yè)務(wù)賦能。為此我總結(jié)出了四條圖標(biāo)繪制的評(píng)判標(biāo)準(zhǔn)。

超長(zhǎng)干貨!圖標(biāo)設(shè)計(jì)零基礎(chǔ)科普指南

1. 凸顯性

用戶(hù)是否能在某頁(yè)面上迅速找到該圖標(biāo),凸顯性的目的是可以快速查找,幫助用戶(hù)做選擇。圖標(biāo)在識(shí)別的速度上遠(yuǎn)遠(yuǎn)大于文字,所以在一些頁(yè)面中的重要功能使用圖標(biāo)的目的是為了吸引用戶(hù)的注意力,讓重要功能得到凸顯,提高重要功能的點(diǎn)擊率。

2. 可識(shí)別性

圖標(biāo)的目的是要讓用戶(hù)猜出他看到的圖標(biāo)所表達(dá)的意義,有什么作用,以及點(diǎn)擊后會(huì)出現(xiàn)什么樣的場(chǎng)景,發(fā)生什么樣的事情。所以一個(gè)圖標(biāo)的好與壞最重要的因素就體現(xiàn)在這里:圖標(biāo)的可識(shí)別性與可預(yù)知性。

影響圖標(biāo)可識(shí)別性的三點(diǎn)因素

  • 視覺(jué)復(fù)雜性:圖標(biāo)的細(xì)節(jié)與組合圖形的元素
  • 熟悉性:圖標(biāo)中圖形所表達(dá)語(yǔ)義的熟悉程度
  • 具體性:圖標(biāo)或者圖標(biāo)中的圖形與現(xiàn)實(shí)生活中物體的相似程度

3. 美觀(guān)度

圖標(biāo)是否美觀(guān),對(duì)用戶(hù)是否有足夠的吸引力。在《設(shè)計(jì)通用法則》一書(shū)中有一條設(shè)計(jì)法則是:美即適用效應(yīng)。不管任何事物,美麗的外表都會(huì)給人帶來(lái)好感,讓人覺(jué)得這種事物在任何方面都非常美好。作為設(shè)計(jì)師,把一件事物美觀(guān)化是一件終生的必修課,用戶(hù)對(duì)圖標(biāo)或者界面的第一印象就是始于顏值。

4. 業(yè)務(wù)屬性

圖標(biāo)是否符合業(yè)務(wù)屬性,是否可以喚起用戶(hù)的使用情緒,提高點(diǎn)擊率,起到為業(yè)務(wù)賦能的作用。在界面中,我們?cè)O(shè)計(jì)的圖標(biāo)最終目的不只是讓用戶(hù)覺(jué)得它美觀(guān),而是要為我們的產(chǎn)品賦能,什么是為產(chǎn)品賦能呢?通俗來(lái)說(shuō)就是使圖標(biāo)能夠提升點(diǎn)擊率從而給公司創(chuàng)造收益。

圖標(biāo)如何為產(chǎn)品賦能呢?

  • 符合產(chǎn)品與業(yè)務(wù)屬性:比如兒童類(lèi)產(chǎn)品,圖標(biāo)就要圓滑,多彩,看起來(lái)萌一點(diǎn)的感覺(jué);如果是金融類(lèi)的產(chǎn)品就應(yīng)該使用微圓角,直角,中性色,金色來(lái)代表金融的莊嚴(yán)感與高級(jí)感。
  • 喚起用戶(hù)的使用情緒:比如在大眾點(diǎn)評(píng) app 中,有關(guān)與食品的圖標(biāo)都使用橙色的擬物,因?yàn)榕梢越o人們帶來(lái)食欲感,微擬物配合暖色系就可以喚起用戶(hù)對(duì)食品的情緒感。
  • 引導(dǎo)用戶(hù)點(diǎn)擊,提升點(diǎn)擊率:想要讓用戶(hù)點(diǎn)擊一個(gè)內(nèi)容,那必須要有足夠的吸引力吸引用戶(hù)去點(diǎn)擊,一般來(lái)說(shuō)美觀(guān)度越高、趣味元素越多的圖標(biāo)可以占據(jù)大部分的吸引力,一個(gè)圖標(biāo)在頁(yè)面中所占的比例也會(huì)影響對(duì)用戶(hù)的吸引力,合理的文案搭配也會(huì)吸引用戶(hù)去點(diǎn)擊,比如優(yōu)惠信息,新功能提示等。

圖標(biāo)的類(lèi)型

1. 線(xiàn)性圖標(biāo)

線(xiàn)性圖標(biāo),顧名思義,即圖標(biāo)是由直線(xiàn)、曲線(xiàn)、點(diǎn)在內(nèi)等元素組合而成的圖標(biāo)樣式。線(xiàn)性圖標(biāo)具有辨識(shí)度高,清晰唯美,簡(jiǎn)約易看等優(yōu)點(diǎn),線(xiàn)性圖標(biāo)不會(huì)對(duì)頁(yè)面造成太多的視覺(jué)干擾。缺點(diǎn)是:線(xiàn)性圖標(biāo)的創(chuàng)作空間較少,太復(fù)雜的線(xiàn)性圖標(biāo)看起來(lái)會(huì)讓人感覺(jué)到累。

2. 面性圖標(biāo)

面性圖標(biāo),即使用對(duì)圖形內(nèi)容進(jìn)行色彩填充的圖標(biāo)樣式。面性圖標(biāo)是現(xiàn)實(shí)生活中物體的縮影,優(yōu)點(diǎn)非常多,比如表意能力強(qiáng),細(xì)節(jié)豐富,色彩豐富,情緒感強(qiáng),視覺(jué)突出,創(chuàng)作空間大等。面性圖標(biāo)可以讓用戶(hù)迅速定位圖標(biāo)位置,快速預(yù)知點(diǎn)擊后的狀態(tài)。但是面性圖標(biāo)在頁(yè)面中不可過(guò)多出現(xiàn),否則會(huì)造成頁(yè)面臃腫,難分主次,用戶(hù)視覺(jué)疲勞。

3. 混合型圖標(biāo)

在設(shè)計(jì)圖標(biāo)類(lèi)型的時(shí)候,不一定局限于單純的線(xiàn)性與面性,也可以?xún)烧呓Y(jié)合,讓圖標(biāo)即有線(xiàn)性描邊的輪廓,還有色彩填充的區(qū)域,混合型圖標(biāo)可以讓頁(yè)面變得更加有活力,同時(shí)還可以吸引用戶(hù)的注意力,美觀(guān)與創(chuàng)意性強(qiáng)。但是混合型圖標(biāo)在商業(yè)產(chǎn)品中要謹(jǐn)慎使用,因?yàn)槭褂貌划?dāng)會(huì)讓頁(yè)面變得雜亂不堪,用戶(hù)無(wú)法識(shí)別圖標(biāo)表達(dá)的語(yǔ)義。

超長(zhǎng)干貨!圖標(biāo)設(shè)計(jì)零基礎(chǔ)科普指南

圖標(biāo)的色彩

1. 色彩情緒

色彩情緒即顏色心理,指不同波長(zhǎng)色彩的光信息作用于人的視覺(jué)器官,通過(guò)視覺(jué)神經(jīng)傳入大腦后,經(jīng)過(guò)思維,與以往的記憶及經(jīng)驗(yàn)產(chǎn)生聯(lián)想,從而形成一系列的色彩心理反應(yīng)。在任何場(chǎng)景下合理使用色彩心理可以調(diào)起用戶(hù)情緒,還可以讓用戶(hù)產(chǎn)生聯(lián)想進(jìn)而快速識(shí)別。

在設(shè)計(jì)圖標(biāo)的時(shí)候,合理的運(yùn)用色彩情緒,會(huì)使圖標(biāo)更具有科學(xué)性,可以讓用戶(hù)在使用的過(guò)程中更加自然、舒服,同時(shí)也會(huì)增加用戶(hù)的識(shí)別速度喚起用戶(hù)的使用情緒。

色彩情緒表

超長(zhǎng)干貨!圖標(biāo)設(shè)計(jì)零基礎(chǔ)科普指南

2. 配色方法

配色時(shí),我們采用更具備科學(xué)性、更符合人類(lèi)感官的 HSB 系統(tǒng)進(jìn)行配置。在根據(jù)主色配置漸變色時(shí),我們經(jīng)常是在主色的基礎(chǔ)上加白或者加黑。但是只加入大量的白或者黑就會(huì)改變?cè)旧实拿鞫扰c飽和度,從而使畫(huà)面顯得霧蒙蒙的,不夠清晰通透。正確的做法是在給主色變亮減暗的同時(shí),改變主色的飽和度。在 hsb 色相條中,最亮的三個(gè)顏色分別是,藍(lán)紫色,青綠色與黃色,如果需要加亮主色就在混白的同時(shí)將藍(lán)色向青色改變色相,如果需要減暗則是相反,這樣在調(diào)制漸變色變化的過(guò)程中不會(huì)出現(xiàn)太臟的顏色。

超長(zhǎng)干貨!圖標(biāo)設(shè)計(jì)零基礎(chǔ)科普指南

3. 配色方案

常見(jiàn)的色彩搭配

中性色(黑白)+主色、主色+點(diǎn)綴色、主色+透明度、單漸變、雙漸變錯(cuò)層、撞色疊加穿透等效果。一般常用的就是中性色+主色、主色+點(diǎn)綴色。

點(diǎn)綴色配色

  • 互補(bǔ)色:互補(bǔ)色就是在色環(huán)上距離 180° 的色彩,形成具有視覺(jué)沖擊力的色彩。
  • 近似色:近似色是在色環(huán)上距離 45° 左右的色彩,形成的配色效果風(fēng)格和諧統(tǒng)一。
  • 對(duì)比色:對(duì)比色是在色環(huán)上 120° 左右的色彩,可以產(chǎn)生較為強(qiáng)烈鮮明的視覺(jué)效果。

超長(zhǎng)干貨!圖標(biāo)設(shè)計(jì)零基礎(chǔ)科普指南

圖標(biāo)繪制技巧

1. 像素對(duì)齊

我們?cè)诶L制圖標(biāo)的時(shí)候,應(yīng)該將圖標(biāo)的每個(gè)像素盡量對(duì)齊于像素點(diǎn),這樣導(dǎo)出圖標(biāo)時(shí)像素的邊緣不會(huì)出現(xiàn)鋸齒,不會(huì)出現(xiàn)過(guò)于模糊的情況。通常在繪制時(shí)我們應(yīng)該去除繪制軟件中 x 與 y 軸,寬(w)與高(h)的小數(shù)點(diǎn),這樣就可以避免無(wú)法對(duì)齊像素的情況。

超長(zhǎng)干貨!圖標(biāo)設(shè)計(jì)零基礎(chǔ)科普指南

2. 圖標(biāo)參考線(xiàn)

在繪制兩個(gè)或者以上的圖標(biāo)時(shí),為了避免多個(gè)圖標(biāo)出現(xiàn)大小不一的情況,我們應(yīng)該使用由谷歌材料設(shè)計(jì)語(yǔ)言提供的圖標(biāo)參考線(xiàn)進(jìn)行繪制,使用圖標(biāo)盒子可以讓一整套圖標(biāo)在視覺(jué)效果上更加統(tǒng)一和諧,不會(huì)出現(xiàn)一大一小一長(zhǎng)一短的情況。

超長(zhǎng)干貨!圖標(biāo)設(shè)計(jì)零基礎(chǔ)科普指南

使用方法

先繪制一個(gè) 152*152px 的正方形,一個(gè) 176*176px 的正圓形,一個(gè)寬 176*128px 的水平矩形和一個(gè) 128*176px 的垂直矩形,圓角為 4px,然后將這個(gè)四個(gè)形狀進(jìn)行水平居中對(duì)齊,之后得出一個(gè)圖標(biāo)的參考線(xiàn)。

在寬度相等的情況下,正方形的面積要大于正圓的面積,所以在繪制圓形圖標(biāo)時(shí)應(yīng)該將圓形的上下左右四個(gè)頂點(diǎn)頂齊與圖標(biāo)盒子正方形區(qū)域的四條邊;在繪制方形圖標(biāo)時(shí)應(yīng)該將方形的四個(gè)角點(diǎn)頂齊與圓形參考線(xiàn)的外圍邊;在繪制橫向矩形與縱向矩形圖標(biāo)時(shí),應(yīng)該將圖標(biāo)的左右邊或者是上下邊控制在正方形的參考線(xiàn)之內(nèi),這樣矩形圖標(biāo)繪制出來(lái)會(huì)更加的圓潤(rùn),相對(duì)于其他的形狀圖標(biāo)更加匹配。

超長(zhǎng)干貨!圖標(biāo)設(shè)計(jì)零基礎(chǔ)科普指南

3. 可訪(fǎng)問(wèn)性

我們繪制的圖標(biāo)必須要保證清晰度,可辨別性。不管是在強(qiáng)光下還是正常光下都需要良好的可讀性。這就需要圖標(biāo)不論是自身元素之間的對(duì)比度還是和頁(yè)面底板背景之間的對(duì)比度都需要很好的可讀性。我們檢測(cè)圖標(biāo)的可讀性通常要將圖標(biāo)的背景色底板在黑色和白色之間進(jìn)行切換對(duì)比,不論是黑色還是白色的背景都可以看清圖標(biāo)的全部細(xì)節(jié),還需要確保圖標(biāo)中的每一種顏色都是可見(jiàn)的。第二就是將圖標(biāo)拿到強(qiáng)光下進(jìn)行觀(guān)察,在強(qiáng)光下是否可以看清圖標(biāo)的主題結(jié)構(gòu),圖標(biāo)是否有足夠的辨識(shí)度。

在繪制圖標(biāo)時(shí),我們可以參考 WCAG 2.1:圖形和用戶(hù)界面組件的對(duì)比度至少為 3 : 1 的標(biāo)準(zhǔn)進(jìn)行相應(yīng)配色,以達(dá)到良好的可視狀態(tài)。

可訪(fǎng)問(wèn)性測(cè)試:https://webaim.org/resources/contrastchecker/

超長(zhǎng)干貨!圖標(biāo)設(shè)計(jì)零基礎(chǔ)科普指南

4. 統(tǒng)一性

在繪制多個(gè)類(lèi)型相同的圖標(biāo)時(shí),我們需要注意這一套圖標(biāo)合集需要在視覺(jué)上保持統(tǒng)一性。在一整套產(chǎn)品中,會(huì)有很多種圖標(biāo),但是圖標(biāo)的功能不一樣,所表達(dá)的內(nèi)容也不同。這時(shí),圖標(biāo)一致性的意義就體現(xiàn)出來(lái)了,根據(jù)格式塔原理中的相似性原則:人們會(huì)將如元素彼此相似的東西感知為一組。這也意味著如果具有相同功能、含義和層次結(jié)構(gòu)級(jí)別的元素,則應(yīng)在視覺(jué)上保持統(tǒng)一匹配。我們傾向于將彼此相似的元素視為同一個(gè)分組,相似性可以幫助我們組織和分類(lèi)頁(yè)面里的元素對(duì)象,并將它們與特定的含義或功能相關(guān)聯(lián)。有不同的方法可以使元素被認(rèn)為是相似的,這些方法包括顏色、大小、形狀、紋理、尺寸和方向的相似性。

圖標(biāo)內(nèi)容的統(tǒng)一會(huì)讓用戶(hù)明白相似的圖標(biāo)所代表的的功能也相同,而且在視覺(jué)上也更加和諧美觀(guān)。因此我們?cè)诶L標(biāo)后還需檢查線(xiàn)條的粗細(xì)比重,邊角的大小,配色方案,細(xì)節(jié)層次和設(shè)計(jì)元素在整個(gè)合集中是否是不變且一致的。

超長(zhǎng)干貨!圖標(biāo)設(shè)計(jì)零基礎(chǔ)科普指南

5. 圖標(biāo)呼吸感

呼吸感的意思就是適當(dāng)留白。在設(shè)計(jì)中,適當(dāng)?shù)牧舭卓梢酝怀鲋黧w內(nèi)容,讓內(nèi)容具備易看性。不管是圖標(biāo)還是界面,元素與元素之間都應(yīng)該存在一定的間距。在圖標(biāo)的繪制過(guò)程中,我們應(yīng)該注意圖標(biāo)元素之間的間距不宜過(guò)近,元素也不宜過(guò)多。圖標(biāo)是一個(gè)物體的簡(jiǎn)略縮影,目的是為了表達(dá)內(nèi)容,讓用戶(hù)快速理解,但是在有限的空間中,太過(guò)復(fù)雜的細(xì)節(jié)會(huì)影響圖標(biāo)的識(shí)別速度。因此在圖標(biāo)的繪制過(guò)程中應(yīng)該刪除所有無(wú)法傳達(dá)圖標(biāo)意義的元素,避免使圖標(biāo)變得太過(guò)復(fù)雜難以識(shí)別。

超長(zhǎng)干貨!圖標(biāo)設(shè)計(jì)零基礎(chǔ)科普指南

6. 合理運(yùn)用布爾運(yùn)算

布爾運(yùn)算在設(shè)計(jì)行業(yè)中被得到廣泛的運(yùn)用,比如工業(yè)設(shè)計(jì),影視后期,logo 設(shè)計(jì)等,布爾運(yùn)算具有一致性與規(guī)范性的優(yōu)點(diǎn)。我們?cè)谠O(shè)計(jì)面性圖標(biāo)的時(shí)候可以合理使用布爾運(yùn)算進(jìn)行繪制,這樣繪制的圖標(biāo)具有吸引力和說(shuō)服力。

超長(zhǎng)干貨!圖標(biāo)設(shè)計(jì)零基礎(chǔ)科普指南

7. 頁(yè)面層次感

在頁(yè)面中,有需要吸引用戶(hù)點(diǎn)擊的圖標(biāo),也有起到輔助作用的指示圖標(biāo),還有引導(dǎo)用戶(hù)操作的圖標(biāo),這些圖標(biāo)在頁(yè)面中占據(jù)著不同的地位.在所有圖標(biāo)中,有色圖標(biāo)強(qiáng)于無(wú)色圖標(biāo),多色圖標(biāo)強(qiáng)于單色圖標(biāo),面性圖標(biāo)強(qiáng)于線(xiàn)性圖標(biāo),帶背景圖標(biāo)強(qiáng)于無(wú)背景圖標(biāo),在設(shè)計(jì)圖標(biāo)的時(shí)候應(yīng)該根據(jù)業(yè)務(wù)需要進(jìn)行視覺(jué)強(qiáng)弱不同的設(shè)計(jì)。

超長(zhǎng)干貨!圖標(biāo)設(shè)計(jì)零基礎(chǔ)科普指南

8. 業(yè)務(wù)屬性

如文上所說(shuō),圖標(biāo)采用與業(yè)務(wù)相符合的色彩搭配會(huì)讓用戶(hù)在使用的過(guò)程中更加自然、舒服,同時(shí)也會(huì)增加用戶(hù)的識(shí)別速度,喚起用戶(hù)的使用情緒。一個(gè)圖標(biāo)的繪制是否具備商業(yè)價(jià)值也恰恰體現(xiàn)在這里。

如下圖所示,左圖是斗魚(yú)直播 APP 的截圖,右圖是京東金融的圖標(biāo)截圖。這兩款產(chǎn)品的業(yè)務(wù)以及所對(duì)應(yīng)的用戶(hù)群體完全不一樣,斗魚(yú)是一款直播的產(chǎn)品,直播面向的用戶(hù)群體是青少年,所以整體的產(chǎn)品調(diào)性是:萌、活潑、多彩、絢麗、時(shí)尚等,斗魚(yú)直播的圖標(biāo)繪制需要面向年輕人,色彩的高飽和與有趣的元素來(lái)抓住用戶(hù)的眼球。但是京東金融是一款理財(cái)?shù)漠a(chǎn)品,面向的用戶(hù)則是中老年,大多數(shù)都是有一些存款的人,這些人不需要斗魚(yú)那樣花里胡哨的元素,他們只在乎這個(gè)產(chǎn)品是否安全,利息是否高,所以京東金融這個(gè)產(chǎn)品的整體風(fēng)格就需要偏向于:安全、高端、大氣,這樣才能給用戶(hù)從視覺(jué)上營(yíng)造信任感。我們?cè)O(shè)計(jì)圖標(biāo)時(shí)通常使用產(chǎn)品的調(diào)性作為主風(fēng)格,但是像美團(tuán)淘寶這些業(yè)務(wù)眾多的產(chǎn)品中,我們就需要根據(jù)產(chǎn)品下的細(xì)分業(yè)務(wù)進(jìn)行風(fēng)格定位,然后設(shè)計(jì)中相應(yīng)融入產(chǎn)品的品牌元素,使用合理的色彩情緒等讓圖標(biāo)變得更符合業(yè)務(wù)的風(fēng)格。

超長(zhǎng)干貨!圖標(biāo)設(shè)計(jì)零基礎(chǔ)科普指南

最終測(cè)試

當(dāng)我們的圖標(biāo)繪制完成后需要測(cè)試這一組圖標(biāo)的重心是否統(tǒng)一,常用的方法是使用標(biāo)準(zhǔn)的正圓形和正方形來(lái)和所有繪制的圖標(biāo)進(jìn)行對(duì)比,保證所有的圖標(biāo)重心相近,視覺(jué)統(tǒng)一。也可以采用不同角度的觀(guān)察法,可以從上下左右四個(gè)角度去觀(guān)察圖標(biāo),看看圖標(biāo)在不同的角度下重心是否統(tǒng)一。

超長(zhǎng)干貨!圖標(biāo)設(shè)計(jì)零基礎(chǔ)科普指南

一組圖標(biāo)的繪制流程

1. 情緒板

情緒板是在執(zhí)行一項(xiàng)設(shè)計(jì)操作之前非常重要的一個(gè)步驟,情緒板并不是像設(shè)計(jì)平臺(tái)展示作品集里那樣放幾張圖片,幾個(gè)關(guān)鍵詞,而是一套對(duì)接下來(lái)設(shè)計(jì)的一個(gè)風(fēng)格走向定位。根據(jù)不同的用戶(hù)人群,不同顏色的色彩情緒,不同產(chǎn)品的業(yè)務(wù),將用戶(hù)調(diào)研的結(jié)果,產(chǎn)品的背景進(jìn)行總結(jié)與思考,定位接下來(lái)的設(shè)計(jì)風(fēng)格。

2. 繪制流程

選取照片

觀(guān)察生活,對(duì)想畫(huà)的圖標(biāo)進(jìn)行照片實(shí)物造型的提取。圖標(biāo)是對(duì)生活中事物的精簡(jiǎn)概括。利用現(xiàn)實(shí)照片作為設(shè)計(jì)參考可以讓繪制出的圖標(biāo)更真實(shí),辨識(shí)度更高,還可以做到差異化設(shè)計(jì)。

造型勾勒

使用矢量軟件的基本圖形與鋼筆工具描著照片進(jìn)行輪廓的繪制。

簡(jiǎn)化優(yōu)化

簡(jiǎn)化草稿輪廓的結(jié)構(gòu),只保留一個(gè)物體的主要特點(diǎn)元素,刪除多余元素。優(yōu)化圖標(biāo)細(xì)節(jié),需要時(shí)將圖標(biāo)線(xiàn)性轉(zhuǎn)面性。

業(yè)務(wù)屬性

根據(jù)業(yè)務(wù)需要,調(diào)整圖標(biāo)風(fēng)格,添加質(zhì)感。

超長(zhǎng)干貨!圖標(biāo)設(shè)計(jì)零基礎(chǔ)科普指南

3. 制定規(guī)范

無(wú)規(guī)矩不成方圓,規(guī)矩的出現(xiàn)可以讓一切雜亂的東西變得合理,統(tǒng)一起來(lái)。在設(shè)計(jì)上也是如此,規(guī)范具有統(tǒng)一輸出,指引細(xì)節(jié)、便于查看的好處,規(guī)范就是一組圖標(biāo)中的規(guī)矩,所有圖標(biāo)的繪制都按照規(guī)矩來(lái),最終的成品就會(huì)顯得井然有序。

在制定規(guī)范時(shí),我們通常先繪制出一個(gè)符合業(yè)務(wù)風(fēng)格的圖標(biāo),然后根據(jù)這一個(gè)圖標(biāo)定制后續(xù)的圖標(biāo)規(guī)范,最基本的規(guī)范便是描邊寬度,斷點(diǎn)位置、圓角大小,主色輔色,漸變角度,點(diǎn)綴元素,光影角度等,在一組中的圖標(biāo)需要在這些圖形屬性中進(jìn)行統(tǒng)一,這樣的圖標(biāo)雖然形狀不一樣但是在視覺(jué)上看起來(lái)是屬于同一合集的。

制定規(guī)范一般分為三個(gè)過(guò)程:

  • 拆分細(xì)節(jié):將圖標(biāo)中的細(xì)節(jié)元素進(jìn)行分解,在規(guī)范中制定細(xì)節(jié)元素的使用法則。
  • 風(fēng)格定位:根據(jù)產(chǎn)品調(diào)性,業(yè)務(wù)屬性在規(guī)范中制定相應(yīng)的色彩心理、質(zhì)感風(fēng)格。
  • 功能劃分:功能相近的包括色彩、質(zhì)感應(yīng)該采取相近性。


文章來(lái)源:優(yōu)設(shè)網(wǎng)    作者:簫灬西人生


藍(lán)藍(lán)設(shè)計(jì)www.cqzjtgb.com )是一家專(zhuān)注而深入的界面設(shè)計(jì)公司,為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶(hù)體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)


日歷

鏈接

個(gè)人資料

存檔

看黄色毛片网站| 大香蕉97超碰在线| 日本欧美国产在线视频| 特大巨黑吊av在线直播| 亚洲无线观看免费| 91午夜精品亚洲一区二区三区| 精品一区二区免费观看| av卡一久久| 成人二区视频| 成人高潮视频无遮挡免费网站| 国产精品国产三级专区第一集| 在线免费观看的www视频| 男女视频在线观看网站免费| 亚洲国产色片| 男人和女人高潮做爰伦理| 视频中文字幕在线观看| 亚洲av男天堂| 成人国产麻豆网| 夫妻性生交免费视频一级片| 国产在线男女| 少妇的逼水好多| 一级毛片aaaaaa免费看小| 久热久热在线精品观看| 人妻系列 视频| 嫩草影院入口| 91在线精品国自产拍蜜月| 欧美日韩视频高清一区二区三区二| 国产黄a三级三级三级人| 国产精品无大码| 人妻夜夜爽99麻豆av| 国产黄频视频在线观看| 亚洲av男天堂| 久久99热这里只频精品6学生| 亚洲国产色片| 国产综合懂色| 欧美高清成人免费视频www| 成年版毛片免费区| 精品不卡国产一区二区三区| 国产精品一区二区性色av| 亚洲精品久久久久久婷婷小说| 日本午夜av视频| 国产一区亚洲一区在线观看| 91av网一区二区| 亚洲国产av新网站| 舔av片在线| 亚洲精品久久久久久婷婷小说| .国产精品久久| 亚洲第一区二区三区不卡| av网站免费在线观看视频 | 哪个播放器可以免费观看大片| 亚洲欧洲国产日韩| 舔av片在线| 国产淫片久久久久久久久| 超碰97精品在线观看| 精品久久久久久久久久久久久| 联通29元200g的流量卡| 国产成人freesex在线| 伦精品一区二区三区| 中文资源天堂在线| 美女脱内裤让男人舔精品视频| 久久99精品国语久久久| 精品国产三级普通话版| 亚洲av.av天堂| 一边亲一边摸免费视频| 中国国产av一级| 91在线精品国自产拍蜜月| 国产精品精品国产色婷婷| 听说在线观看完整版免费高清| 日韩三级伦理在线观看| 九色成人免费人妻av| 成人特级av手机在线观看| 男女视频在线观看网站免费| 又爽又黄a免费视频| 大陆偷拍与自拍| 久久久久久伊人网av| 男女视频在线观看网站免费| 国产片特级美女逼逼视频| 99热全是精品| 老师上课跳d突然被开到最大视频| 国产一级毛片在线| 久久草成人影院| 亚洲精品中文字幕在线视频 | .国产精品久久| 国产一区二区三区av在线| 日本免费a在线| 成年免费大片在线观看| 伊人久久精品亚洲午夜| 亚洲综合色惰| 男插女下体视频免费在线播放| 国产精品麻豆人妻色哟哟久久 | 97精品久久久久久久久久精品| 国产伦精品一区二区三区四那| 22中文网久久字幕| 少妇裸体淫交视频免费看高清| 国产69精品久久久久777片| 搞女人的毛片| 免费av毛片视频| av国产久精品久网站免费入址| 高清毛片免费看| 国产精品一区二区在线观看99 | 麻豆av噜噜一区二区三区| 日韩成人伦理影院| 97人妻精品一区二区三区麻豆| 日本免费a在线| 欧美成人精品欧美一级黄| 久久久久久久久久久免费av| 五月玫瑰六月丁香| 亚洲成人久久爱视频| 久久久精品免费免费高清| 男的添女的下面高潮视频| 亚洲国产精品专区欧美| 国产精品日韩av在线免费观看| 搡老妇女老女人老熟妇| 91久久精品国产一区二区成人| 欧美日韩视频高清一区二区三区二| 欧美性感艳星| 日日摸夜夜添夜夜爱| 亚洲国产精品成人综合色| 欧美成人一区二区免费高清观看| 少妇熟女欧美另类| 国产成人精品福利久久| 一本—道久久a久久精品蜜桃钙片 精品乱码久久久久久99久播 | 插阴视频在线观看视频| 日韩一区二区视频免费看| 亚洲精品自拍成人| 丝袜美腿在线中文| 久久精品熟女亚洲av麻豆精品 | 大香蕉97超碰在线| 国产亚洲精品av在线| 久久99蜜桃精品久久| 一夜夜www| a级毛色黄片| 最近的中文字幕免费完整| 男女边吃奶边做爰视频| 狂野欧美激情性xxxx在线观看| 一二三四中文在线观看免费高清| 99热6这里只有精品| 亚洲av成人精品一区久久| 小蜜桃在线观看免费完整版高清| 精品酒店卫生间| 日韩人妻高清精品专区| 欧美日韩在线观看h| 国产成人91sexporn| 国产 亚洲一区二区三区 | 在线观看av片永久免费下载| 亚洲欧美日韩无卡精品| 激情 狠狠 欧美| 久久99热6这里只有精品| 日本熟妇午夜| 美女国产视频在线观看| 国产中年淑女户外野战色| 91狼人影院| 亚洲精品成人久久久久久| 亚洲精品影视一区二区三区av| 中文字幕人妻熟人妻熟丝袜美| 国产午夜福利久久久久久| 国产一区二区亚洲精品在线观看| 国产视频内射| 亚洲成人av在线免费| 一级爰片在线观看| 两个人的视频大全免费| av在线天堂中文字幕| 18禁动态无遮挡网站| h日本视频在线播放| 最近最新中文字幕免费大全7| 精品一区二区三区视频在线| 黄色一级大片看看| 一级a做视频免费观看| 国产精品国产三级国产专区5o| 国产白丝娇喘喷水9色精品| 亚洲av免费在线观看| av女优亚洲男人天堂| 中国美白少妇内射xxxbb| 国产不卡一卡二| 亚洲综合精品二区| 欧美+日韩+精品| 成人国产麻豆网| 97热精品久久久久久| 精品久久久久久久人妻蜜臀av| 自拍偷自拍亚洲精品老妇| 91久久精品国产一区二区成人| 观看免费一级毛片| 深夜a级毛片| 一级毛片我不卡| 80岁老熟妇乱子伦牲交| 久久久久久伊人网av| 乱系列少妇在线播放| 免费大片黄手机在线观看| 七月丁香在线播放| 日本黄色片子视频| 国产免费福利视频在线观看| 国产成人a∨麻豆精品| 一级爰片在线观看| 久久精品国产自在天天线| 亚洲最大成人手机在线| 岛国毛片在线播放| 淫秽高清视频在线观看| 又黄又爽又刺激的免费视频.| 日日啪夜夜撸| 亚洲最大成人手机在线| 国内精品一区二区在线观看| 久久久精品94久久精品| 免费黄网站久久成人精品| 亚洲欧美精品自产自拍| 91久久精品国产一区二区成人| 国产日韩欧美在线精品| 久久久久精品久久久久真实原创| 午夜激情福利司机影院| 亚洲av二区三区四区| 2018国产大陆天天弄谢| 内地一区二区视频在线| 亚洲精品久久久久久婷婷小说| 亚洲高清免费不卡视频| av在线亚洲专区| 亚洲av男天堂| 久久久久久久国产电影| 蜜臀久久99精品久久宅男| 国产大屁股一区二区在线视频| 天天躁夜夜躁狠狠久久av| 69人妻影院| 免费黄频网站在线观看国产| 精华霜和精华液先用哪个| 精品一区二区三区视频在线| av天堂中文字幕网| 日本爱情动作片www.在线观看| 国产大屁股一区二区在线视频| 国产精品国产三级专区第一集| 欧美xxxx黑人xx丫x性爽| 小蜜桃在线观看免费完整版高清| 国产精品国产三级国产av玫瑰| 青春草国产在线视频| 九九在线视频观看精品| 日本爱情动作片www.在线观看| 国产日韩欧美在线精品| 成人国产麻豆网| 最近2019中文字幕mv第一页| 成人亚洲精品一区在线观看 | 你懂的网址亚洲精品在线观看| a级毛片免费高清观看在线播放| 蜜桃久久精品国产亚洲av| 麻豆久久精品国产亚洲av| 日本免费a在线| 国产精品麻豆人妻色哟哟久久 | 国产在视频线在精品| 亚洲激情五月婷婷啪啪| 男插女下体视频免费在线播放| 人妻一区二区av| 免费电影在线观看免费观看| 高清毛片免费看| 亚洲精品亚洲一区二区| 日韩亚洲欧美综合| 黄色配什么色好看| 嫩草影院精品99| 又爽又黄a免费视频| 免费高清在线观看视频在线观看| 久久久色成人| 一个人看的www免费观看视频| 91久久精品国产一区二区三区| 国产 一区 欧美 日韩| 日韩av不卡免费在线播放| 国产精品久久久久久av不卡| 亚洲,欧美,日韩| 国产av不卡久久| 亚洲av不卡在线观看| 国内少妇人妻偷人精品xxx网站| 91在线精品国自产拍蜜月| 亚洲丝袜综合中文字幕| 爱豆传媒免费全集在线观看| 九九爱精品视频在线观看| 亚洲av国产av综合av卡| 久久国内精品自在自线图片| 精品酒店卫生间| 国产精品爽爽va在线观看网站| 国产 一区 欧美 日韩| 五月伊人婷婷丁香| 麻豆av噜噜一区二区三区| 亚洲欧美一区二区三区黑人 | 欧美日韩综合久久久久久| 18禁在线播放成人免费| 青春草视频在线免费观看| 久久精品久久久久久噜噜老黄| 最近2019中文字幕mv第一页| 人妻夜夜爽99麻豆av| 久久6这里有精品| 波多野结衣巨乳人妻| 一级毛片 在线播放| 国产单亲对白刺激| 国产精品福利在线免费观看| 三级毛片av免费| 高清午夜精品一区二区三区| 在线观看免费高清a一片| 国产精品人妻久久久久久| 亚州av有码| 亚洲av电影不卡..在线观看| 亚洲乱码一区二区免费版| 久久国内精品自在自线图片| av福利片在线观看| 一个人免费在线观看电影| 久久久a久久爽久久v久久| 91av网一区二区| 狂野欧美白嫩少妇大欣赏| 精品国产露脸久久av麻豆 | 成人午夜精彩视频在线观看| av又黄又爽大尺度在线免费看| 久久精品国产鲁丝片午夜精品| 91aial.com中文字幕在线观看| 久久久久网色| 一级毛片黄色毛片免费观看视频| 精品久久久久久久末码| 日韩,欧美,国产一区二区三区| 一本—道久久a久久精品蜜桃钙片 精品乱码久久久久久99久播 | 国产精品久久久久久av不卡| 在线观看人妻少妇| 3wmmmm亚洲av在线观看| 国产乱人偷精品视频| 精品久久久久久久久亚洲| 亚洲精品第二区| 欧美日韩一区二区视频在线观看视频在线 | 亚洲av二区三区四区| or卡值多少钱| 波多野结衣巨乳人妻| 爱豆传媒免费全集在线观看| 中文字幕人妻熟人妻熟丝袜美| 精品久久久久久久久亚洲| 亚洲欧美一区二区三区国产| 三级国产精品欧美在线观看| 2021少妇久久久久久久久久久| 国产精品一区二区在线观看99 | 少妇的逼水好多| 国产欧美另类精品又又久久亚洲欧美| 国产大屁股一区二区在线视频| 亚洲自拍偷在线| 最近2019中文字幕mv第一页| 久久久久久九九精品二区国产| 性色avwww在线观看| 久久久久国产网址| 日本av手机在线免费观看| 人人妻人人看人人澡| 亚洲国产欧美人成| 日韩欧美一区视频在线观看 | 午夜免费观看性视频| 国产精品一及| 久久精品国产亚洲av天美| 国产 一区精品| 三级国产精品片| 亚洲精品自拍成人| 午夜激情福利司机影院| 午夜日本视频在线| 在线免费观看不下载黄p国产| 日本-黄色视频高清免费观看| 卡戴珊不雅视频在线播放| 91精品一卡2卡3卡4卡| 九色成人免费人妻av| 久久久久久久亚洲中文字幕| 久久99热这里只有精品18| 亚洲av不卡在线观看| 精品人妻视频免费看| 久久精品夜色国产| 日韩人妻高清精品专区| 人妻系列 视频| 亚洲精品亚洲一区二区| 非洲黑人性xxxx精品又粗又长| 身体一侧抽搐| 男人爽女人下面视频在线观看| 免费观看av网站的网址| 免费观看的影片在线观看| 夫妻性生交免费视频一级片| 午夜福利视频精品| 搞女人的毛片| 亚洲自偷自拍三级| 麻豆av噜噜一区二区三区| 亚洲国产高清在线一区二区三| 欧美性猛交╳xxx乱大交人| 国产在线一区二区三区精| 久久久久久九九精品二区国产| 国产精品女同一区二区软件| 久久草成人影院| 夜夜看夜夜爽夜夜摸| or卡值多少钱| 精品久久久久久成人av| 亚洲第一区二区三区不卡| 偷拍熟女少妇极品色| 乱码一卡2卡4卡精品| 汤姆久久久久久久影院中文字幕 | 中文字幕亚洲精品专区| 亚洲av日韩在线播放| 在线观看美女被高潮喷水网站| 蜜桃久久精品国产亚洲av| 一区二区三区高清视频在线| 偷拍熟女少妇极品色| 亚洲av成人精品一区久久| 自拍偷自拍亚洲精品老妇| 国产精品嫩草影院av在线观看| 欧美日韩综合久久久久久| 国产精品久久视频播放| 国产男女超爽视频在线观看| 亚洲国产最新在线播放| 国产高清不卡午夜福利| 男插女下体视频免费在线播放| 欧美日韩综合久久久久久| 国产精品久久视频播放| 在线天堂最新版资源| 大香蕉97超碰在线| 永久免费av网站大全| 成人性生交大片免费视频hd| 久久久久久九九精品二区国产| 在线免费十八禁| 午夜福利网站1000一区二区三区| 久久久久精品性色| 日韩精品青青久久久久久| 国产中年淑女户外野战色| 日韩精品青青久久久久久| 午夜激情福利司机影院| 国产精品无大码| 特大巨黑吊av在线直播| 日本wwww免费看| 精品亚洲乱码少妇综合久久| 国产 亚洲一区二区三区 | 久久久久久久久久久丰满| 男女下面进入的视频免费午夜| 91精品国产九色| 亚洲欧美精品专区久久| 男人狂女人下面高潮的视频| 又大又黄又爽视频免费| 又爽又黄a免费视频| av免费在线看不卡| 大又大粗又爽又黄少妇毛片口| 亚洲欧洲日产国产| 亚洲欧美成人精品一区二区| 91在线精品国自产拍蜜月| 国产成人精品福利久久| 亚洲国产最新在线播放| 日本免费在线观看一区| 一本一本综合久久| 欧美精品一区二区大全| 最近的中文字幕免费完整| 国产极品天堂在线| 少妇的逼好多水| 久久久久久久久久久丰满| 菩萨蛮人人尽说江南好唐韦庄| 极品少妇高潮喷水抽搐| 日韩欧美三级三区| 联通29元200g的流量卡| 综合色av麻豆| 亚洲,欧美,日韩| 毛片一级片免费看久久久久| 国产有黄有色有爽视频| 国产淫片久久久久久久久| 天天躁夜夜躁狠狠久久av| 少妇熟女欧美另类| 亚洲成人中文字幕在线播放| 亚洲av在线观看美女高潮| av免费在线看不卡| 亚洲三级黄色毛片| 激情五月婷婷亚洲| 特级一级黄色大片| 国产精品久久视频播放| 国产免费一级a男人的天堂| 久99久视频精品免费| 午夜福利在线在线| 亚洲美女搞黄在线观看| av免费在线看不卡| 亚洲丝袜综合中文字幕| 免费看美女性在线毛片视频| 国产精品.久久久| 精品久久久久久久末码| 精品一区二区三区人妻视频| 97精品久久久久久久久久精品| 日本与韩国留学比较| 国产一级毛片在线| 精品久久久久久电影网| 欧美97在线视频| 久久久精品94久久精品| 国产精品一区二区三区四区免费观看| 国语对白做爰xxxⅹ性视频网站| 麻豆久久精品国产亚洲av| 97精品久久久久久久久久精品| 亚洲自拍偷在线| 免费黄网站久久成人精品| 99久久中文字幕三级久久日本| 大又大粗又爽又黄少妇毛片口| 综合色av麻豆| 国产在线一区二区三区精| 777米奇影视久久| 中国美白少妇内射xxxbb| 91精品伊人久久大香线蕉| 夜夜看夜夜爽夜夜摸| 人妻少妇偷人精品九色| 亚洲乱码一区二区免费版| 精品久久久久久成人av| av又黄又爽大尺度在线免费看| 80岁老熟妇乱子伦牲交| 最近中文字幕高清免费大全6| 久久久久久久久久久免费av| 美女cb高潮喷水在线观看| 午夜福利网站1000一区二区三区| 麻豆乱淫一区二区| 草草在线视频免费看| 精品一区二区三卡| 久久综合国产亚洲精品| 一个人看的www免费观看视频| 2021少妇久久久久久久久久久| 男女边摸边吃奶| 免费看av在线观看网站| 美女国产视频在线观看| 国产激情偷乱视频一区二区| 国产综合精华液| 网址你懂的国产日韩在线| 99久国产av精品国产电影| 在线观看av片永久免费下载| 国产精品久久久久久久久免| 色综合亚洲欧美另类图片| 国产成人精品一,二区| 综合色av麻豆| 老司机影院毛片| 男人爽女人下面视频在线观看| 人人妻人人澡欧美一区二区| 亚洲图色成人| 午夜激情久久久久久久| 欧美激情国产日韩精品一区| videossex国产| 成人毛片a级毛片在线播放| 干丝袜人妻中文字幕| 国产精品av视频在线免费观看| 国产色婷婷99| 欧美日韩视频高清一区二区三区二| 国产黄片美女视频| 麻豆成人午夜福利视频| 美女大奶头视频| 99热这里只有是精品50| 成人漫画全彩无遮挡| 人人妻人人澡人人爽人人夜夜 | 一个人看的www免费观看视频| 亚洲av免费高清在线观看| 免费高清在线观看视频在线观看| 欧美高清性xxxxhd video| 一边亲一边摸免费视频| 伊人久久精品亚洲午夜| 国产亚洲精品久久久com| 日本与韩国留学比较| 又爽又黄a免费视频| 久久久久久国产a免费观看| 日本熟妇午夜| 国产亚洲av嫩草精品影院| 日日啪夜夜撸| 久久久久久久久久久丰满| 国产亚洲午夜精品一区二区久久 | 日韩制服骚丝袜av| av专区在线播放| av在线播放精品| 国产成人精品久久久久久| 欧美丝袜亚洲另类| 亚洲av国产av综合av卡| 午夜福利成人在线免费观看| 中文精品一卡2卡3卡4更新| 午夜免费男女啪啪视频观看| 国产免费视频播放在线视频 | 久久久久性生活片| 热99在线观看视频| 国产伦精品一区二区三区四那| 国产黄片视频在线免费观看| av在线蜜桃| 如何舔出高潮| 久久久国产一区二区| 伊人久久精品亚洲午夜| 国产在视频线精品| 亚洲真实伦在线观看| 国产在视频线在精品| 综合色av麻豆| 波野结衣二区三区在线| 最近的中文字幕免费完整| 亚洲av男天堂| 久久亚洲国产成人精品v| 国产在视频线精品| 国产黄频视频在线观看| 丝袜喷水一区| 18禁在线播放成人免费| 夜夜看夜夜爽夜夜摸| 久久精品久久久久久久性| 国产精品人妻久久久影院| 搞女人的毛片| 精品欧美国产一区二区三| 亚洲成人中文字幕在线播放| 欧美97在线视频| 久久97久久精品| 我的老师免费观看完整版| 91精品国产九色| 久久久久久国产a免费观看| h日本视频在线播放| 少妇熟女欧美另类| 国产精品一及| 欧美人与善性xxx| 国产亚洲av嫩草精品影院| 亚洲熟女精品中文字幕| 欧美97在线视频| 18禁在线无遮挡免费观看视频| 日韩av不卡免费在线播放| 久久久久久久久久久丰满| 舔av片在线| 国产精品久久久久久久电影| 免费看av在线观看网站| 国产欧美另类精品又又久久亚洲欧美| 内射极品少妇av片p| 国产成人aa在线观看| 99热网站在线观看| 人妻一区二区av| 在线 av 中文字幕| 最新中文字幕久久久久| 欧美潮喷喷水| 一二三四中文在线观看免费高清| ponron亚洲| 日日啪夜夜爽| 亚洲精品久久午夜乱码| 纵有疾风起免费观看全集完整版 | 街头女战士在线观看网站|