UI作品集的5个高分展示思路，看了就想约你面试！

上一篇简单分享了作品集项目包装中首页应该怎么优化的思路，而这篇就要更进一步，来分享项目首页应该如何在作品集中进行展示。

上期：

因为时间有限，所以使用的案例演示从简，大家能正确理解要表达的内容即可。

首页展示的主要思路

虽然经常强调现在的UI作品集输出，可以以视觉展示为主，尽量减少无用的分析和解释。但不代表在任何任何情况下这么实践都是合理的，因为首页通常是项目最重要且最开始展示的页面，如果排版能力欠佳，就很容易导致这个展示的起点不高。

所以首页的展示不能就只放一张图，对它进行一定的包装、解释、说明是必要的。只不过很多同学对应该怎么实现这个目标毫无头绪，所以下面我就要解释几种不同的做法，帮助大家解决这个问题。

主要的首页包装方式可以总结成下面几种：

1. 关联页面展示
2. 组件状态说明
3. 页面细节展示
4. 页面框架说明
5. 优化前后对比

类型1：关联页面展示

第一种做法，就是结合首页外的其它次要页面进行混合展示，通过更多页面的结合来丰富页面的视觉效果。

这里要考虑的第一个问题，就是首页要关联哪些页面，下面是常用的关联对象：

这些都是首页的前置页面或是下级页面（通常只从首页进入），和首页的关联性极高且不适合单独展示，所以和首页搭伙是符合逻辑的。

类型2：组件状态说明

第二种模式就是虽然只展示首页，但会在旁边对首页的不同组件进行介绍，以及展示组件的不同状态和设计样式。

比如有些餐饮品牌的应用，首页上方有会员卡片，那么该卡片就有未登录、普通用户、尊享用户多种状态，每个状态都有较大的视觉差异，就适合单独围绕组件做展示，而不是做三个首页出来。

或是一些包含了不同交互状态差异的组件，也可以把不同的交互结果作为展示对象。

类型3：页面细节展示

第三种是对页面细节进行不同程度的展示，也就是说不是把首页一张长图直接贴出来，而是先展示单屏或部分页面，然后通过一些其它模块布局展示重要细节或隐藏部分。

这类展示方式需要页面本身有优质的细节内容可以选择，比如组件、LOGO、图标、形象等，如果设计本身很中规中矩，再去凸显细节会起到反效果。

类型4：页面框架说明

第四种是对页面框架层进行说明，解释页面结构的布局、排序、占比背后的逻辑。这类解释通常是基于体验或是数据的导向发现，用于实现更高层次的目标或解决原有的问题。

框架展示必须要有着力点，即你这么制定布局有什么优势，解决了什么问题。而不是作为流水账的一部分，依次解释不同模块是什么。

再者就是如果布局和主流的同类产品几乎一致，那就不适合这类展示，因为布局看起来就像照着别人的抄一遍，那么你不管给出什么解释都缺乏说服力。

类型5：优化前后对比

最后一种，就是对于改版项目做改前改后的对比，突出改版带来的变化和优势。

这属于最好理解但最难做好展示的类型，因为改版涉及到很多的纬度，想要放进原图又要说清楚改版思路需要优秀的语言组织能力。并且很多改版原图可能视觉做的太差，只要放进去就会直接拉低项目的展示效果。

所以，想要使用这种展示模式，最好是体验设计上的小改，有清晰直观的依据易于理解，视觉也不会差异过大造成展示效果不佳。

以上就是首页展示可以应用的五种方法，哪种效果最好就需要大家自己考虑并做出选择。还要强调一点的是，想要让展示效果最大化，就不是只按着原首页设计做包装，而是会根据“包装需要”去变更原来的设计，或是设计新的内容。

比如关联页面中原来没做搜索页给做上，要做组件展示，原本组件很简单，做个新的方案让状态有得展示等等。

结尾

在作品集投递中，适当的优化互补是有必要的，一定要以结果为导向去完成作品集的输出，才能真正在这个领域进行深入的思考和进步。

同理，最好在准备作品之前就从项目包装的需求出发，有更强的目的性才能确保整个输出流程的效率，得到让我们更满意的结果。

想要高效的积累这种职业思考方式和实践技巧，建议你们参加我们下期的系统培训课程，少走点弯路，轻松你我他 ➡️

我们下篇再贱~

欢迎关注作者的微信公众号：「超人的电话亭」