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

作為一名UI設(shè)計(jì)師，除了分析并梳理產(chǎn)品需求的能力外，視覺(jué)基礎(chǔ)力更是會(huì)直接影響該設(shè)計(jì)師的Level。而視覺(jué)基礎(chǔ)能力，是可以通過(guò)刻意練習(xí)進(jìn)行提升的。在這里，我從幾個(gè)維度來(lái)進(jìn)行總結(jié)，希望能對(duì)剛?cè)腴T的設(shè)計(jì)師朋友有所幫助。

一、視覺(jué)5大要素

在一個(gè)完整的頁(yè)面的視覺(jué)設(shè)計(jì)當(dāng)中，我們可以它理解為幾大核心點(diǎn)，如版、質(zhì)、形、色、字。

• 版：版式及柵格，版式間距會(huì)直接影響到頁(yè)面的張力及空間感
• 質(zhì)：頁(yè)面風(fēng)格、肌理維度，整個(gè)產(chǎn)品視覺(jué)調(diào)性
• 形：大面積區(qū)域的形狀，控件尺寸比例，icon形狀的統(tǒng)一性
• 色：顏色風(fēng)格，頁(yè)面色相、彩度、明度整體風(fēng)格統(tǒng)一性
• 字：字體的樣式，字體、字號(hào)、襯線，內(nèi)容識(shí)別性

二、什么是版?

版，在界面設(shè)計(jì)當(dāng)中，版式會(huì)直接影響到用戶對(duì)該頁(yè)面的理解能力，良好的信息傳達(dá)力離不開(kāi)科學(xué)的組織布局。

1. 親密性

可以通過(guò)一個(gè)很簡(jiǎn)單的話術(shù)來(lái)表達(dá)，那就是「同類相近，異類相遠(yuǎn)」，信息聯(lián)系緊密的，間距相近，不同性質(zhì)間距要遠(yuǎn)。

2. 節(jié)奏性

一個(gè)頁(yè)面內(nèi)容中，間距不要太多，盡量使用倍數(shù)，比如1x、2x、3x、4x。

以12為基準(zhǔn)，比如間距一律使用12、24、36、48。

如果是信息較為緊密的，則可以使用8的倍數(shù)，如8、16、24、32等。

當(dāng)然，這也不是絕對(duì)值，具體使用情況，還得根據(jù)實(shí)際情況跟業(yè)務(wù)屬性而定。

▲通過(guò)分析，京東金融app的間距是以4為單位進(jìn)行倍增，但用的則是較大的間距，如24、28、32、36、40、44。

而Airbnb則是以12的單位進(jìn)行縮放，如12、24、36、48、60的單位，不同的柵格比例傳遞的情感也是不一樣的。因此間距沒(méi)有絕對(duì)的設(shè)定值，而是根據(jù)業(yè)務(wù)進(jìn)行適當(dāng)調(diào)整。

3. 黃金比例

黃金比例是在UI設(shè)計(jì)當(dāng)中用的較多的一個(gè)比例，此比例通過(guò)了自然界大數(shù)據(jù)的驗(yàn)證。在實(shí)際項(xiàng)目中，使用黃金比例的作品，往往更具有美感，令人賞心悅目。

除了黃金比例，其實(shí)還有著白銀鉑金等比例，這類比例也是具有著較多的美感的。相信很多同學(xué)不知道，這里也發(fā)出來(lái)讓各位同學(xué)知曉下。網(wǎng)址可自行百度:黃金比例在線生成。

三、什么是質(zhì)?

質(zhì)，是頁(yè)面的風(fēng)格特征。產(chǎn)品的風(fēng)格應(yīng)當(dāng)與產(chǎn)品的整體形象保持一致，好的質(zhì)感表現(xiàn)，不僅幫用戶記住產(chǎn)品，更能讓產(chǎn)品拉開(kāi)與同類產(chǎn)品的區(qū)別，做到別具一格。

這里簡(jiǎn)單給大家介紹幾種常見(jiàn)的風(fēng)格類型。

樣式1：大卡片、輕投影式

這種風(fēng)格在iOS11后更是變得普及了起來(lái)，因?yàn)槲⑼队澳茉诤芎玫乩_(kāi)層級(jí)提升空間感的同時(shí)，還能讓頁(yè)面變的更為細(xì)膩。

像Appstore跟大量產(chǎn)品，都使用了這類較為不錯(cuò)的樣式。不過(guò)要注意的是，漸變樣式不能太過(guò)于厚重，頁(yè)面留白要大。

樣式2：高純度漸變，彌散投影

跟以前陰影較為厚重的漸變相比，新的漸變樣式變得更為扁平更為輕量化了起來(lái)。

在Dribbble流行起漸變風(fēng)之后，國(guó)內(nèi)各大應(yīng)用也開(kāi)始使用起來(lái)，如淘寶與京東金融、優(yōu)酷、餓了么等主流應(yīng)用開(kāi)始紛紛效仿。

同樣在漸變的配色方案中，不適合多類顏色同時(shí)漸變，漸變的兩個(gè)顏色在一個(gè)色系，上進(jìn)行微調(diào)即可。

樣式3：輕擬物

輕擬物的視覺(jué)主流更多的是在扁平的基礎(chǔ)上加些擬物的元素，在汽車終端、智能家居等物聯(lián)網(wǎng)系統(tǒng)尤為多見(jiàn)。

但與傳統(tǒng)的擬物相比，現(xiàn)代的擬物風(fēng)變得更為簡(jiǎn)潔，主要層級(jí)信息變得更為突出。通過(guò)視覺(jué)明暗，來(lái)拉開(kāi)不同信息的層級(jí)關(guān)系。

三、什么是形?

形，決定著整個(gè)產(chǎn)品線的調(diào)性，能直接將產(chǎn)品所蘊(yùn)含的情感文化通過(guò)視覺(jué)表現(xiàn)傳達(dá)給用戶。

無(wú)論是按鈕的圓角比例，還是圖標(biāo)的統(tǒng)一性，都是形的重要組成部分。而在UI界面設(shè)計(jì)中圖形更多的體現(xiàn)在圖標(biāo)及按鈕上，這里可以嘗試這樣來(lái)提升形的統(tǒng)一感。

1. 圖標(biāo)風(fēng)格

在圖標(biāo)設(shè)計(jì)中，首先要把控好icon視覺(jué)語(yǔ)言的核心，以較為常見(jiàn)的線性圖標(biāo)為例，例如描邊線寬、圓角、斷點(diǎn)方式、點(diǎn)綴、顏色填充類型、圖標(biāo)重心等，都是需要進(jìn)行統(tǒng)一規(guī)范化。

如果你是剛?cè)腴T的設(shè)計(jì)師，對(duì)圖標(biāo)這塊不擅長(zhǎng)，可以去圖標(biāo)網(wǎng)站如iconfont上找相關(guān)圖標(biāo)進(jìn)行參考，再根據(jù)自己的想法進(jìn)行繪制。

2. 統(tǒng)一的圖形元素

圖形也是一個(gè)重要的元素，決定著一個(gè)企業(yè)的品牌形象。在界面設(shè)計(jì)中使用品牌圖形能讓用戶牢記品牌形象，讓產(chǎn)品快速搶占市場(chǎng)，提高用戶比例。如

天貓、京東、QQ、網(wǎng)易云等優(yōu)秀產(chǎn)品，在這塊就運(yùn)用得非常巧妙。

▲網(wǎng)易云，提取了唱片的元素，整個(gè)圖標(biāo)風(fēng)格，都使用了較為圓潤(rùn)的造型。

四、什么是色?

色，往往是人感官中留下的第一印象。合理運(yùn)用顏色并不容易。在界面設(shè)計(jì)中，選擇配色方案，就好像穿衣服一樣，顏色越多越花哨，整個(gè)檔次感覺(jué)越low。

跟傳統(tǒng)的空間設(shè)計(jì)一樣，在大部分界面設(shè)計(jì)中，一般使用三種顏色就夠了。除非設(shè)計(jì)師擁有者非常高的配色駕馭能力，不其然整個(gè)頁(yè)面都會(huì)顯得較為花哨，影響信息傳遞。

下面，我們可以使用兩個(gè)小技巧，來(lái)幫助你提升配色的能力。

技巧1：使用情緒板決定主色調(diào)

設(shè)計(jì)師往往在做界面設(shè)計(jì)時(shí)，都是感性的，難以支撐各樣的質(zhì)疑。

那么通過(guò)場(chǎng)景關(guān)鍵詞，收集相應(yīng)的圖片素材，使用情緒板來(lái)創(chuàng)建顏色，能更好幫助設(shè)計(jì)師完成對(duì)產(chǎn)品情緒的理解。同時(shí)提高工作效率流程，并且能讓界面設(shè)計(jì)更符合用戶的預(yù)期，完成產(chǎn)品目標(biāo)需求。設(shè)計(jì)出來(lái)的方案也更具有說(shuō)服力，能更好幫助設(shè)計(jì)師拿到產(chǎn)品視覺(jué)設(shè)計(jì)的主導(dǎo)權(quán)。

技巧2：六三一原則

所謂的六三一原則就是在空間設(shè)計(jì)中，通常主色調(diào)占60%，輔助色占30%，突出色占10%。其實(shí)在界面設(shè)計(jì)中也是一樣的，設(shè)計(jì)稿中顏色不宜過(guò)多，不同色系最好不要超過(guò)三種。

如果對(duì)色系不能很好理解的同學(xué)，我這邊給個(gè)辦法，就像當(dāng)初學(xué)畫畫，瞇著眼睛看即可看出其主要色調(diào)。但如果一個(gè)大型圖案的個(gè)別色塊很大的話，同樣得視為一種色。

五、何為字?

字，字體的形狀及樣式會(huì)直接影響到信息傳遞的速度。所以根據(jù)不同的場(chǎng)景，使用不同的字體樣式也是極為重要的，這里也給大家提供幾個(gè)小技巧，幫助大家提升對(duì)字體的理解能力。

技巧1：合理的使用字體樣式

界面設(shè)計(jì)時(shí)，永遠(yuǎn)要把內(nèi)容的可讀性放在首位，其次再去考慮其它樣式。根據(jù)不同的業(yè)務(wù)模式，選擇不同的字體，可以讓頁(yè)面更容易達(dá)到用戶的心理預(yù)期。

如襯線字與無(wú)襯線字，傳遞出來(lái)的感受是有著較大區(qū)別的。

一般而言，需要強(qiáng)調(diào)的文字或者小篇文字中，使用無(wú)襯線字會(huì)更合適一些。

而在一些長(zhǎng)篇文章中，使用襯線體則會(huì)更容易閱讀。如在網(wǎng)頁(yè)設(shè)計(jì)中，最小的11號(hào)字體使用襯線體宋體，會(huì)比非襯線體的微軟雅黑更具有優(yōu)勢(shì)。

技巧2：合理的使用字重

在單色環(huán)境中，使用不同的字重能更好地加強(qiáng)內(nèi)容之間的呼應(yīng)對(duì)比。減少過(guò)渡色階層級(jí)的使用，能使核心內(nèi)容更為聚焦，減輕閱讀負(fù)擔(dān)。因此在界面設(shè)計(jì)中，使用較粗的字重來(lái)作為標(biāo)題是較為合適的。在iOS11中，這樣的設(shè)計(jì)手法尤為多見(jiàn)。

▲上圖很明顯，左邊的圖會(huì)更利于信息閱讀，因?yàn)閷蛹?jí)的主次得到了很好的區(qū)分。

因此大家在設(shè)計(jì)界面中，不妨把一些主標(biāo)題加粗試試，或許有一些意想不到的效果。

技巧3：合理的控制字距

字距跟行距會(huì)直接影響到大排文字的閱讀性。標(biāo)題的字間距要緊密，正文大排文字的字間距要稀疏一些。另外正文的行間距應(yīng)該設(shè)置為字體大小的120%到150%之間。

大家可以多進(jìn)行一下嘗試，直到信息較容易識(shí)別閱讀為止。

總結(jié)

以上幾個(gè)大點(diǎn)，構(gòu)成了一套較為完整的視覺(jué)語(yǔ)言。我們可以通過(guò)對(duì)以上這幾個(gè)點(diǎn)進(jìn)行刻意練習(xí)，來(lái)熟練掌握這些基本知識(shí)。

另外除了通過(guò)臨摹一些優(yōu)秀的視覺(jué)作品，拿現(xiàn)有產(chǎn)品進(jìn)行Redesign或者視覺(jué)改版都是一個(gè)較為不錯(cuò)的選擇。

提升自己的視覺(jué)設(shè)計(jì)水平，也并非一朝一夕之事，靠的也是不斷地積累，不斷學(xué)習(xí)。

作者：阿坤，微信公眾號(hào)：我們的設(shè)計(jì)日記（ID：helloskys）

本文由 @我們的設(shè)計(jì)日記 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可，禁止轉(zhuǎn)載。

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