作为一名交互设计师,为了保持不断精进,经常在分析产品的同时积累一些优秀的交互模式。但我们经常会遇到这样的情况:
看到好的APP设计,截屏、存在相册里,打算未来某天清理,然后就木有然后了
把截图发到电脑上、放在文件夹里,日日放月月放却没有定时梳理,等你想起用它的时候已经杂乱无章、无比庞大了
或者因为资料无法快速调用,你开始怀疑积累的意义,而且最终实际设计用到的,还是脑子里印象深刻的那些……
那这该怎么办呢?
解决方法就是构建你的个人控件资料库。
其中,“积累”这个动作只是第一步,随后应当像收纳整理师,将碎片井井有条地归类,在需要的时候快速、高效地找到他们。
具体怎么做呢?我们先用3W法分析这个问题
1、WHY:为什么要做这件事
痛点:没有系统的资料库、设计全凭经验
痒点:又快又好地完成任务
超预期:与身边的人共享,创造一起成长的氛围
2、WHAT:在什么场景下需要这些控件库
在实际设计中寻找当前最优解,场景包含“解决问题,优化模式,提供创意”
● 解决问题:满足基本型需求,使产品可用
● 优化模式:满足期望型需求,使产品好用
● 提供创意:满足魅力型需求,创造AHA Moment(如微信读书的推荐=微信读书+摇一摇)
其中,根据目标的不同,控件库的分类方式和触点也应当不同
● 解决问题:问题维度分类
● 优化模式:模式维度分类
● 提供创意:创意维度分类;因为创意较发散,在分类基础上可设置标签
3、HOW:怎么做控件库、步骤分别是什么
产品打造思路:最小MVP,即定义问题、明确方案、设计原型、快速迭代。
按照这个思路,我们做一个变体:选择、整理、吸收、应用
创建控件库的步骤
1)选择
首先,我们需要把积累的资料聚合在一起,并把他们分成三类:
● 模式:一般来源于其他APP,可能是一些让你觉得很棒的基础控件或基础控件的变体
● 问题:一般来源于你的实际设计,如你遇到什么问题,然后通过这个设计解决了
● 创意:让你眼前一亮的设计,或许很概念现阶段用不到,但是提供一个创意方向
如果你还没有很多资料可以分类,可以先看看你的项目控件库、收集一些模式。
毕竟,开始的时候,资料不在多,首先要先做起来~
2)整理
现在手里有很多资料了,怎么整理呢?
推荐使用Axure(Sketch)和Adobe Bridge。前者适合积累模式和问题,便于与设计画簿互相引用;后面适合更发散的内容,文件夹+标签使分类更多重
① 模式:按照交互模式对收集的控件进行分类,并收集在Axure中。其中,每个画簿的标题是该控件的名字,如图1.1 ,类似项目控件库,但这里需根据你的掌握情况做删减,毕竟是自用~
② 问题:同上,只是每个画簿的标题修改为问题名称,所以这里是对你已解决问题的收录,如图1.2
③ 创意:将所有图片放在电脑中的一个文件夹里,建议先按照功能进行归类,因为功能是一个少有交叉的分类,然后用Adobe Bridge对图片设置标签,便于日后多维度查找。图1.3为微信读书摇一摇,该功能=推荐功能+微信摇一摇,我很喜欢这种设计和专注的推荐,因此把它放在“推荐”文件夹里,标签有#微信读书 #摇一摇 #沉浸式 #转场动效
3)吸收
只有收集是不够的,我们还需要定期对资料进行内化,使其为我所用。
对于新接触的控件,我们用初级设计师学习控件的方法,比如分析控件的优劣、找案例和变种、分析实际产品的使用合理性等,如图1.4-图1.5
对于解决问题的收录,我们可以定期回顾,看之前的解决方式是否在当时是最优,如果不是、如何改进;聚合同一类问题的解决方式,也帮助我们发现共通的底层解决思路,从而建立方法论。
有时候我会“没眼看”自己几个月前的设计,虽然当时可接受,但放在现在一定有更好的设计。这种回顾方式,一方面帮助成长,另一方面也能获取成长的成就感~
为了避免陷入收集整理却没时间吸收的困境,可以在周/月计划增加“整理控件资料库”、“回顾资料库问题解决方式”,为这一行为增加除法点,让它更加可行。
4)应用
因为我们的收集本来就是按场景分类的,因此在应用时会比较得心应手
在遇到问题时,看之前是否遇到过相同的问题,是否可以参考解决
在优化模块时,看看资料库里是否有更好的控件承载自己的设计
在出概念方案时,查看相关功能的文件夹、搜索标签,能否应用一些眼前一亮的设计点
这样日积月累,我们就多了一个实际设计中的可靠工具,将过去的经验应用至现在,也不用在陷入困境时去临时翻竞品了。因此,这样也提升了设计效率~
-【End】-