面试官说我作品包装不行，我回来做了5种排版，明天去复试！

最近收到有同学提问关于作品集包装的问题，感觉自己的作品集排版都差不多，看起来很平淡，没有记忆点。辛辛苦苦完成的界面，结果卡在了作品集包装上，非常可惜！

更多干货：

今天挑战用1张界面完成5种排版！几个简单的小技巧，让你的作品集告别规矩普通，瞬间有亮点！

先看下排版效果：

第一步先要保证把界面做精致，否则即使排版ok了也要减分嗷！

给界面加个边框或手机样机，方面后面把界面和背景区分开，准备好了就马上开始吧！

技巧一：元素破形法

选择界面中想要突出的内容（可能是卡片、Banner、徽章等），破出界面，增加排版层次。

在这张界面中，我们想更多的展示徽章，可以先把界面上半部分放大：

接着把界面中隐藏的徽章放出来：

做了破形处理之后，是不是噶一下就不一样了？

下一步，给背景拉个蓝色渐变，微微加一点格子和字母底纹：

背景底纹主要是为了丰富下背景层次，注意不要用力过猛，底纹太强可能会导致画面主次不分，本来想要突出界面和徽章，注意力也被抢走了：

接着加上一点小文字排版，第一张作品集排版搞定：

技巧二：局部展示法

把界面中的设计亮点单独放大，局部展示。

换个深色背景，拉开颜色对比度，让界面更突出：

接着把徽章单独提出来，这里采用了左右排版的方式，左边展示局部细节，右边展示整体界面。

只有图的展示还是比较单调，添加一些文字描述，让内容看起来内容更饱满一些：

完成！

技巧三：套用样机法

套用样机也是既简单又实用的技巧之一。

样机尽量保持和界面风格匹配一些。看一组对比图：

通过对比可以看到，由于我们的界面风格是比较可爱的，偏3d的，所以3d小手会更合适一些，真实风格的样机多少有点违和。

样机选好之后，尝试用个浅色背景：

再来点文字排版，ok了：

技巧四：背景排版法

前面几种方法都是围绕界面展开，我们也可以在背景的排版上下功夫。

先给背景拉一个大卡片，做出一个大面积色块：

加个投影交待一下手机和背景的前后关系：

投影的模糊度一定要往大了调，这样看起来才显高级：

接着就可以往卡片里加内容了，把界面相关的标题、文字描述放进来。

因为卡片的面积比较大，文字部分如果太小，画面会有一种撑不起来的感觉，所以这里的文字会做放大处理，这样画面会比较饱满，没这么空。

文字的排版没什么问题了，在颜色的维度上也可以看看，目前右边的文字全部都是重色，缺少和界面中蓝色的呼应，可以加一点蓝色：

下一个！技巧五、警戒线装饰在排版中添加警戒线也是我比较常用的包装方式，比较容易出效果。彩色、深色、浅色的背景都试过了，这次来个灰色背景。

两条警戒线咔咔一拉，这小感觉一下就上来了。

警戒线上的设计可以花点小心思，比如加点箭头、小图案，或者做点文字的变形处理，瞬间变得更有设计感：

还是把文字排版加上，第5种排版大功告成！

总结

没有复杂操作，5个排版小技巧，让你掌握排版窍门：

技巧一：元素破形法

选择界面中想要突出的内容（可能是卡片、Banner、徽章等），破出界面，增加排版层次。

技巧二：局部展示法

把界面中的设计亮点单独放大，局部展示。

技巧三：套用样机法

使用样机，简单又高效。

技巧四：背景排版法

背景大色块搭配文字排版。

技巧五：警戒线装饰

添加警戒线，设计感满满。快试试吧！迫不及待看到大家的作品集啦！

欢迎关注作者的微信公众号：「菜心设计铺」