莫b

今天我们就讲一个星友的案例,好好讲讲这里面的原理,让大家吸收一波!本文案例强调重点画面主体突出,包括大小和颜色、考虑画面的深度、元素和背景颜色前后关系;仔细把元素的精致度做好。这样就能大大提升画面质感。

下面这个是星友参考的原作:

图片

然后下面这个是他练习的一个作品:

图片

我们来分析下二者差在那里。
我认为有以下4点:
1. 主体物与背景的色系反差
2. 主体物与辅助元素的大小对比
3. 辅助颜色的前后关系
4. 元素的精致度

 

1. 主体物与背景的色系反差

从色系来看,我们看原作:

图片

背景是冷色,周围元素也是冷色,只有最突出的主体物是暖色,这样的好处就是让主体十分突出。
我们做设计都知道,画面里尽量保证只有一个主要物体突出,如果所有元素都很抢,那整体看起来就会有点乱,就像下面这个练习:

图片

背景是暖色,元素的颜色有蓝色、绿色,都属于冷色,而且元素的色相都是和背景差异比较大的色相,这样就会导致整体有点凌乱。

 

2. 主体元素与辅助元素的大小对比

这点很容易理解,我们看原作的主体物是不是要比辅助元素大很多:

图片

而练习的这个主体就不够大,没有拉开对比:

图片

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

 

3.辅助颜色的前后关系

我们在观察画面的时候一定要注意,不要只关注二维平面的关系,还要看三维的前后关系,什么意思呢?
我们看原作的颜色:

图片

他是有很明显的前后关系的,辅助元素有蓝色:

图片

蓝色和背景的蓝比较相近,颜色就会比较靠后。
除此之外,还有灰白色,和卡片的颜色相近:

图片

颜色也会比较靠后,这样就形成了颜色的前后关系。
在使用多色时,一定要想办法融入一些无彩色,黑白灰,这样会让湖面没那么腻。
我们再来看下练习的作品,四个元素的颜色和背景都是剥离开的,没有一个是靠向背景的:

图片

这就会让画面的深度不够,没有前后关系。

 

4. 元素精致度

这个点以前经常说,元素尽量饱满一些会比较精致,我们看原作的元素,我们还是老办法,加个矩形框:

图片

每一个元素都是满的,可以撑的起来,但是练习的元素有一个就稍显单薄:

图片

如果单体不够饱满,当夜也会影响整体的精致度,所以大家一定要多注意。

 

总结

以上就是这个小案例的分析,总结一下就是:
画面主体要突出,不轮是大小还是颜色;
要考虑好画面的深度、也就是元素、颜色的前后关系;
再有就是元素的精致度要做好。
希望今天的小分析可以给大家一点启发,么么扔!

 

原文地址:菜心设计铺(公众号)
作者:菜心设计铺
图片

转载请注明:学UI网 » 今天咱就讲一个实用小案例,看看能不能讲的透彻一点!

登录收藏
 
你可能喜欢的:
产品细节剖析,提升用户体验就差这一点!产品细节剖析,提升用户体验就差这一点!
如何建立完善的设计验收机制如何建立完善的设计验收机制
QQ群 | 社交体验设计思路QQ群 | 社交体验设计思路
天猫首页改版引发的3点思考天猫首页改版引发的3点思考
产品细节剖析,让你看看大厂是如何做设计的10产品细节剖析,让你看看大厂是如何做设计的10
启动页/闪屏/引导页-你还傻傻分不清?启动页/闪屏/引导页-你还傻傻分不清?
项目总结|临感VR中的「易撕线」项目总结|临感VR中的「易撕线」
设计万花筒|做UI,文案也需要设计?不信你来瞧瞧设计万花筒|做UI,文案也需要设计?不信你来瞧瞧
总监说:你做的啥设计?方向全错了!!!总监说:你做的啥设计?方向全错了!!!
总监说我作品丑,调了调确实好多了!!总监说我作品丑,调了调确实好多了!!