当前位置:首页 >> 探索

用2个设计案例,让你的排版更上一层楼 !

  • 探索
  • 2026-09-05 14:11:34
  • 3585

用2个设计案例,设计让你的案例排版更上一层楼!

今天就来分享给大家 ,排版看看我们是更上怎么把排版做好的 ,又有哪些需要注意的层楼细节 。

第一张:

是设计我们瑰花同学的 :

用2个设计案例,让你的案例排版更上一层楼
!

做的排版其实还不错 ,那还能不能更好呢 ?更上

那当然是可以的 ,我们先来看下修改后的层楼效果 :

用2个设计案例�,让你的设计排版更上一层楼
!

是案例不是精致高级了很多?

我们来一起走下修改流程解说一下知识点!

先把文字去掉 :

用2个设计案例,排版让你的更上排版更上一层楼!

画面比较空 ,层楼只有背景和企鹅。这种就算做排版做再好也会显得很单一。

我们要在企鹅和背景之间增加一个层次。企鹅的主体应该是在乘地铁 ,那我们就可以在背景上画几个窗户 ,简单地营造出地铁的环境:

用2个设计案例,让你的排版更上一层楼!

把企鹅放上去:

用2个设计案例,让你的排版更上一层楼!

就可以看到我们的画面多了一个层次 ,丰富了起来。

接着就是排版 ,同学的排版分为上下两个部分:

用2个设计案例,让你的排版更上一层楼!

但是都不够好 ,这是为什么呢。

我们来对一下修改后的:

用2个设计案例
,让你的排版更上一层楼!

其实这里主要是由两个深层原因导致的 。

1. 间距:

原图的主标题字体选的比较纤细 ,字体与字体之间间隔也很大 。 整个给人 感觉就是很空洞,漏风的感觉。

用2个设计案例
,让你的排版更上一层楼!

所以我再修改的时候可以选择一些比较饱满的字体 。

它的间距比较小 ,整个就会给人更饱满的感觉 :

用2个设计案例,让你的排版更上一层楼!

2. 视觉重心:

原图由于上面的字体间距比较大  ,对比下面黑色的副标题来说就会感觉很轻  。

因此视觉注意力就跑到副标题上面去了,这样就不对了。

用2个设计案例,让你的排版更上一层楼
!

因此我们调整标题字的时候 ,还要注意主标题和副标题的视觉平衡,不能“喧宾夺主” :

用2个设计案例	,让你的排版更上一层楼�!

接着来看下半部分:

用2个设计案例
,让你的排版更上一层楼
!

原图给人的感觉就是不知道该看哪里 ,有一种混乱的感觉。

而修改后的就会比较清晰明了 :

用2个设计案例,让你的排版更上一层楼
�!

这里有一个知识点,那就是信息的分组 。

每一个组之间要有明显的距离,不能紧靠在一起 ,会影响到阅读的体验 :

用2个设计案例,让你的排版更上一层楼!

这里我们分为两组  ,一组靠左,一组靠右 。

中间留出足够的距离,就会产生分组的效果了,才能更方便阅读:

用2个设计案例,让你的排版更上一层楼�!

排版做好了 ,接着要调整的是颜色呼应的关系。

现在我们的排版是做好了 ,但是没有颜色:

用2个设计案例
,让你的排版更上一层楼
!

颜色呼应 ,简而言之就是把主体的颜色扩散到全图。

这里的主体就是我么你的企鹅:

用2个设计案例,让你的排版更上一层楼
!

它的颜色其实也就 :白色 、黑色 、黄色,绿色为刻意的点缀色我们刻意忽略。

黑色我们已经有了 。 那只需要把白色和黄色扩散出去就好了  !

第一步加白色 ,我们可以挑一些局部的字体变成白色:

用2个设计案例,让你的排版更上一层楼	
!

第二步 :再白色里再挑出一两个字变成黄色 :

用2个设计案例
,让你的排版更上一层楼!

我们这个大感觉是不是就已经很不错了。 你以为完了吗?

并没有 !我们还可以加入一些点缀元素,以让我们画面增加一些趣味性 。

比如「早安」我们可以加一个荷包蛋在这里会更生动一些:

用2个设计案例,让你的排版更上一层楼!

还可以再字体之间加入一些线条或者箭头:

用2个设计案例,让你的排版更上一层楼	!

这样是不是就有趣多了 。最后我们来看下整体画面:

用2个设计案例,让你的排版更上一层楼!

这个案例学到了吗?

没学够的话 ,我们再来看一个案列,这是泽灵同学修改前后的对比 :

用2个设计案例
,让你的排版更上一层楼!

1. 划分画面要讲究比列

这个画面采用了划分画面的方法 ,通过撕纸的效果把画面分割成了上中下三部分 :

用2个设计案例,让你的排版更上一层楼
!

想法挺好的,但是要注意比列。因为中间的区域过大。导致主体放在这里显得有些空旷 。

我们需要适当把这个区域缩小,两边留白增多 :

用2个设计案例,让你的排版更上一层楼
!

这样我们的主体在放在这里的时候画面就饱满多了,以方便我们后续排版。

2. 颜色呼应

原图还不够好的一点就是画面和主体缺乏颜色呼应 。

让我们的主体在画面当中显得有些独立。

用2个设计案例�	,让你的排版更上一层楼!

主体由白色,灰蓝色  ,粉色组成 ,我们可以把两侧的浅蓝色更改为主体的白色,从而让画面的上半部分和下半部分都和主体有相同的颜色 :

用2个设计案例,让你的排版更上一层楼!

把字体排在两端,采用主体的黑色  :

用2个设计案例
,让你的排版更上一层楼!

还缺一些粉色对吧 。我们可以采用和主体相关的元素 ,比如粉色音符 ,点缀在画面中,从而产生完整的颜色呼应:

用2个设计案例
,让你的排版更上一层楼
!

元素清晰 :

原图在这里加了一个播放按钮的图形创意,但是由于背景太花哨,导致这个图形有些糊在背景里 ,不够清晰 ,模模糊糊的 :

用2个设计案例,让你的排版更上一层楼	!

我们做这些的时候可以明确一些 ,1 是 1 ,2 是 2 ,不要一堆东西混在一起看不清!

那我们可以把这块播放组件提取出来,做突出显示 ,还能让画面多一个层次 :

用2个设计案例�
,让你的排版更上一层楼
!

这感觉是不是好多了呢?

最后我们可以再增加一些纹理的小细节 ,整个画面就完成了  !

用2个设计案例,让你的排版更上一层楼	!

是不是干净清爽 、清晰明了很多?

整体回顾下今天给大家分享的案列 :

用2个设计案例,让你的排版更上一层楼
!

用2个设计案例,让你的排版更上一层楼!

不知道同学们发现没有 ?

虽然案列不同,但是我们修改的知识逻辑点都是一样的!

只要理解了底层的设计逻辑,任何风格都可以作出好作品。

作者 :菜心

  • 关注微信

猜你喜欢

热门阅读

  • 柚赚联盟正轨吗?柚赚是甚么知乎
  • 珠海交通控股集团有限公司原党委书记	、董事长蒋模平接受纪律审查和监察调查
  • 广东海事局联合多部门发布台风预警提示:客运船舶需落实交通管制措施
  • 前山街道和晟社区开展文化反诈主题公益活动	,笔墨课堂筑起“钱袋子”安全防线
  • 集英社百年献礼!"MANGA MILLION"免费上线 400部漫画增援逾百种言语
  • 建功“十五五” 青春勇担当!2026年度中国青年五四奖章暨新时代青年先锋奖主题宣讲活动举办

关注我们

微信公众号