莫b

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

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

图片

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

图片

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

 

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

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

图片

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

图片

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

 

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

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

图片

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

图片

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

 

3.辅助颜色的前后关系

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

图片

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

图片

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

图片

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

图片

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

 

4. 元素精致度

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

图片

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

图片

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

 

总结

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

 

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

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

登录收藏
 
你可能喜欢的:
这些手势交互你关注到了吗?这些手势交互你关注到了吗?
业务想大多全,用户要精准简,首页设计该如何破局?业务想大多全,用户要精准简,首页设计该如何破局?
案例锦囊|交互设计中「情感化」设计优秀案例(二)案例锦囊|交互设计中「情感化」设计优秀案例(二)
这个练习虽然已经不错了,但我觉得还可以有以下几点能优化!这个练习虽然已经不错了,但我觉得还可以有以下几点能优化!
iOS 规范与 Material Design 哪里不同?官网总结了这几点iOS 规范与 Material Design 哪里不同?官网总结了这几点
百度这一局改版,内容导向设计做得真行!百度这一局改版,内容导向设计做得真行!
微信生态中的设计(上) | 设计师如何通过生态视角找到设计优化点?微信生态中的设计(上) | 设计师如何通过生态视角找到设计优化点?
酷家乐优秀设计频道改版酷家乐优秀设计频道改版
如何用新风格引爆业务增长如何用新风格引爆业务增长
一局APP首页 改版设计分析一局APP首页 改版设计分析