设计稿就是你的考卷

     最近一段时间一直在整理我们产品的关键页面,有幸的看到了我们产品从1.0到现在4.3的不断变迁,也找到了许多未曾上线的飞机稿,有的停留在了交互阶段,有的停在了视觉阶段,除了感慨K歌在三年间产品风格的变迁外,也看到了不同设计师在设计稿件输出物上鲜明的个人特色——有的前辈关注页面跳转逻辑是否最简,有的前辈在意产品界面细节是否符合品牌调性,也有的前辈希望通过交互稿件的呈现去影响视觉设计师的表达,不同角度的方案呈现让我可以更加全面的去思考一个相同问题。

   然而,不同设计师的稿件表达方式的确增加了像我这样初次阅读者的认知门槛

   就这个问题和组长以及组内的前辈们也深有同感,除了组内阅读的成本较高,给产品以及开发同学的阅读上也会造成一定的难度,所以,对交互输出物进行规范的制定的需求也就应运而生,是的,这又成了我的工作。

   其实有些同学会很诧异为什么设计类的输出物需要进行统一化设计,特别是在不同项目以及不同设计师的情况下,这种统一性的输出物规范是否会限制创意的发挥或者说增加设计师的工作负担?

   说到这一点,就要聊一聊交互设计师的工作性质,我经常开玩笑说交互设计师其实可以叫做“需求接口人”,我们对接产品,了解需求,分析需求,修改和完善需求,然后在通过图形化的方式表达需求,并对接视觉设计师阐述清楚需求。这一系列的过程都需要高效地表达,除了语言上的沟通,设计稿成为了交互设计师最重要的对接工具,所以高效、易读、通用成为了交互输出物最核心的价值。交互输出物规范正是为了这个目标而产生的,通过一致的表达方式,将创意更加突出的阐述出来,而不会让产品或开发因为在稿件的阅读上消耗太多的精力而降低了对于设计创意的感知度。所以,设计输出物规范是十分有必要的。

   交互设计师的工作核心内容就是有效地提高产品的用户体验,通过合理的设计将信息更好地传达给用户并指导和引领用户进行相关的操作。有趣的是,此次设计输出物规范的设计也是出于这样的一个目的,所以我就按照了交互设计的流程先对设计输出物模板的元素进行了脑暴(下图左),然后对现有的内容进行了结构上重构(下图右)

   然后就是不断地和组长、导师以及有经验的前辈不断的沟通我们产品在设计输出的过程中更加关注的信息点有哪些,那些信息的呈现会对设计方案的输出和表达有正面的作用,再然后就是不断地删减删减删减,最后剩下了以下内容:(其实,不同的产品由于受众和产品特性不同,输出物稿件上包含的元素也有所不同,不能一概而论)

  当输出物的内容确定之后,就要考虑到信息的阅读问题以及页面信息的呈现方法了,尝试了很多视觉效果以及参考了国内外众多大厂的设计输出物之后,我尝试了几个版本,在这个个过程总有些细节的考虑可以跟大家分享一下。相较于一般的交互稿,输出物规范及模板需要有较强的通用性,要让所有的设计师在拿到这份文件之后可以快速上手。所以,在文件的设计上有以下细节需要注意:

1、关键元素组件化:

2、固定元素需要定位

3、交互输出与视觉输出差异化表达

4、其他:热区的呈现、关键元素解释、文字类型尽量减少

其中的一个版本,最终稿因为考虑到信息问题就不在此展示

   看似简单的模板输出,却前前后后修改了十几个版本,虽说是利用下班时间,却也持续了将近个把月的时间。反思从无到有,再不断删减的过程,真的是感慨很多。刚入门交互的同学在校期间的设计项目动辄就是一个几十页的pdf,包含了从设计背景、用户调研到用户行为、persona、设计过程、设计方案、可用性测试等等等内容,但是在互联网企业,特别是腾讯这种节奏极快的企业,我每周要完成两到三个需求,在这种高速的工作中,展示核心内容不仅是对于设计师工作量的平衡,也是对于产品和开发同学理解过程的减负。将更多的思考展现在设计方案中,将信息关键点高亮的单独列出来,言简意赅的呈现关键要素将是每一个设计师进阶的重要能力。

  希望此文呢能达到以下几个目的:1、初级:知道交互输出物应该包含什么;2、中级:设计规范制定过程的思考过程及一些方法;3、最重要的是学着取用设计思维解决问题。

  好久不见,了解的朋友应该知道要疯兄刚到一个新的城市,有太多新的东西要去学习和适应。半年了,终于能静下心来写点什么,希望以后能常常见面。

推荐阅读更多精彩内容