今天咱就講一個實用小案例，看看能不能講的透徹一點！

2021-6-9    seo達人


今天我們就講一個星友的案例，好好講講這里面的原理，讓大家吸收一波！本文案例強調(diào)重點畫面主體突出，包括大小和顏色、考慮畫面的深度、元素和背景顏色前后關(guān)系；仔細把元素的精致度做好。這樣就能大大提升畫面質(zhì)感。

下面這個是星友參考的原作：

圖片

然后下面這個是他練習(xí)的一個作品：

圖片

我們來分析下二者差在那里。
我認為有以下4點：
1. 主體物與背景的色系反差
2. 主體物與輔助元素的大小對比
3. 輔助顏色的前后關(guān)系
4. 元素的精致度

 

1. 主體物與背景的色系反差

從色系來看，我們看原作：

圖片

背景是冷色，周圍元素也是冷色，只有最突出的主體物是暖色，這樣的好處就是讓主體十分突出。
我們做設(shè)計都知道，畫面里盡量保證只有一個主要物體突出，如果所有元素都很搶，那整體看起來就會有點亂，就像下面這個練習(xí)：

圖片

背景是暖色，元素的顏色有藍色、綠色，都屬于冷色，而且元素的色相都是和背景差異比較大的色相，這樣就會導(dǎo)致整體有點凌亂。

 

2. 主體元素與輔助元素的大小對比

這點很容易理解，我們看原作的主體物是不是要比輔助元素大很多：

圖片

而練習(xí)的這個主體就不夠大，沒有拉開對比：

圖片

主次不分明，也是畫面不精致的原因之一。

 

3.輔助顏色的前后關(guān)系

我們在觀察畫面的時候一定要注意，不要只關(guān)注二維平面的關(guān)系，還要看三維的前后關(guān)系，什么意思呢？
我們看原作的顏色：

圖片

他是有很明顯的前后關(guān)系的，輔助元素有藍色：

圖片

藍色和背景的藍比較相近，顏色就會比較靠后。
除此之外，還有灰白色，和卡片的顏色相近：

圖片

顏色也會比較靠后，這樣就形成了顏色的前后關(guān)系。
在使用多色時，一定要想辦法融入一些無彩色，黑白灰，這樣會讓湖面沒那么膩。
我們再來看下練習(xí)的作品，四個元素的顏色和背景都是剝離開的，沒有一個是靠向背景的：

圖片

這就會讓畫面的深度不夠，沒有前后關(guān)系。

 

4. 元素精致度

這個點以前經(jīng)常說，元素盡量飽滿一些會比較精致，我們看原作的元素，我們還是老辦法，加個矩形框：

圖片

每一個元素都是滿的，可以撐的起來，但是練習(xí)的元素有一個就稍顯單?。?/section>

圖片

如果單體不夠飽滿，當夜也會影響整體的精致度，所以大家一定要多注意。

 

總結(jié)

以上就是這個小案例的分析，總結(jié)一下就是：
畫面主體要突出，不輪是大小還是顏色；
要考慮好畫面的深度、也就是元素、顏色的前后關(guān)系；
再有就是元素的精致度要做好。
希望今天的小分析可以給大家一點啟發(fā)，么么扔！

 

原文地址：菜心設(shè)計鋪（公眾號）
作者：菜心設(shè)計鋪

轉(zhuǎn)載請注明：學(xué)UI網(wǎng)》今天咱就講一個實用小案例，看看能不能講的透徹一點！

藍藍設(shè)計建立了UI設(shè)計分享群，每天會分享國內(nèi)外的一些優(yōu)秀設(shè)計，如果有興趣的話，可以進入一起成長學(xué)習(xí)，請掃碼藍小助，報下信息，藍小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務(wù)合作，也請與我們聯(lián)系。

                                                            微信圖片_20210513163802.png

 

分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責(zé)聲明：藍藍設(shè)計尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問題，請及時與我們?nèi)〉寐?lián)系，我們立即更正或刪除。

 

藍藍設(shè)計( m.yvirxh.cn )是一家專注而深入的界面設(shè)計公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標定制 、 用戶體驗 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)


日歷

鏈接

個人資料

藍藍設(shè)計的小編 http://m.yvirxh.cn

存檔