UI知識(shí),UI需要什么樣的美術(shù)能力:應(yīng)用篇

2023-12-22 17:31:40 來源/作者: / 己有:1人學(xué)習(xí)過

我們現(xiàn)在來加入牛皮扣:

首先這個(gè)絕對(duì)不ok,扁平化的牛皮扣可以這么做,但是有透視的不行。

UI知識(shí),UI需要什么樣的美術(shù)能力:應(yīng)用篇

因?yàn)榕Fた凼歉街阱X包上的,它必須遵守錢包的結(jié)構(gòu),才能包裹住錢包。

UI知識(shí),UI需要什么樣的美術(shù)能力:應(yīng)用篇

同樣面片向上移動(dòng)就有了厚度,復(fù)制縮小,就留出了牛皮扣的邊框。當(dāng)你理解了空間,結(jié)構(gòu),光原理,其實(shí)你就很容易的利用一個(gè)最初的形狀去做加減法,大大增加了繪制效率。

UI知識(shí),UI需要什么樣的美術(shù)能力:應(yīng)用篇

牛皮扣,也不可能是完全平面,所以我們給出了弧面的高光和陰影。

UI知識(shí),UI需要什么樣的美術(shù)能力:應(yīng)用篇

一個(gè)圓形,復(fù)制,移動(dòng),等于扣子。

我們下面來為錢包增加細(xì)節(jié),既然是錢包,那總應(yīng)該有點(diǎn)錢吧?

UI知識(shí),UI需要什么樣的美術(shù)能力:應(yīng)用篇

我們做了兩個(gè)面片,一個(gè)硬幣,但是看起來總有點(diǎn)問題,問題在哪呢?層級(jí)!

UI知識(shí),UI需要什么樣的美術(shù)能力:應(yīng)用篇

用陰影遮擋住錢幣以后,錢幣才看起來像是放在錢包里。UI中有很多層級(jí)問題,都是通過陰影遮擋達(dá)到的。

先后級(jí)問題,需要透視,光,結(jié)構(gòu),等原理一起解決。

請(qǐng)注意第一個(gè)錢幣的陰影,與第二個(gè)修正之后的陰影,第二個(gè)更尊重錢包本身的結(jié)構(gòu),也就看起來更舒服。

所以結(jié)構(gòu)影響光,陰影,陰影也必須跟結(jié)構(gòu)的透視關(guān)系是一致的。

UI知識(shí),UI需要什么樣的美術(shù)能力:應(yīng)用篇

我隨便在網(wǎng)上找一個(gè)牛皮材質(zhì),覆蓋在錢包之上,因?yàn)槊靼店P(guān)系都已經(jīng)做完了,所以看起來直接就變成牛皮錢包了。

UI知識(shí),UI需要什么樣的美術(shù)能力:應(yīng)用篇

我只要更改材質(zhì)的顏色,就可以更改錢包的顏色。

那么下一步就是手繪修正了,把材質(zhì)的范圍,收到牛皮部分,調(diào)整高光大小增加細(xì)節(jié)。

UI知識(shí),UI需要什么樣的美術(shù)能力:應(yīng)用篇

差距大么?恩,貌似很大,因?yàn)檫@是一個(gè)網(wǎng)上的效果圖。感謝作者,省了我很多時(shí)間。

總結(jié)一下:

這一講,從剪影,到面片,到空間結(jié)構(gòu)。我們?cè)诎凑战Y(jié)構(gòu)原理,光原理,透視原理,不停的復(fù)雜化一個(gè)物品。

我的目的不是要講,怎么畫一個(gè)東西好看,我的目的是希望大家能夠通過這些簡(jiǎn)單原理,去分析你要做的東西,無(wú)論做加法還是減法,都需要尊重這些原理。

UI不是一個(gè)繪畫工作,了解繪畫原理是為了,拆解我們的工作過程,合理化,規(guī)劃設(shè)計(jì)流程。

其實(shí)UI里很少涉及到你需要大量手繪的部分。都是基本形狀的應(yīng)用。所以,繪畫原理也可以淺嘗即止。不需要每個(gè)UI都擁有原畫師級(jí)別的繪畫能力。