在互联网敏捷开发迭代的过程中,设计自查可以提供全面的检测,为上下游更高效的合作提供一个完整的设计方案。
设计方案的完整,指的是在自查阶段,考虑设计文件是否符合业务流程,页面的层级关系、信息区分及设计的扩展性。保证设计方案的完整是设计师的职业素养,对自己的产出进行查漏补缺,设计出符合需求的页面并保障产品顺利进行。
而一个好的习惯也可以避免不好的影响,提高工作效率,让我们有更多的时间精力进行更有价值的事情。
△ 设计走查流程
在很多互联网企业中,设计师有可能会遇到如下问题:
在目标导向设计中,设计师应该先站在一个高的角度了解产品行为的整个架构然后再进行精细化的设计,这样才能够保证设计完成后与产品目标保持一致。
在部分小型创业团队,团队成员有时不愿按照流程进行,这时候需要我们在加强自身专业能力的同时,与团队成员积极沟通,在团队内达成设计流程的共识并制定相关的措施。比如说,制定设计流程,让团队成员对设计有所认知;预留设计走查的时间,包括自查时间、开发后的走查时间,这些都需要放到整个项目的排期内。
设计是为了更好地解决问题,这是我加入设计行业之后一直坚信的原则,也是在团队内保持和各个部门合作的原则。虽然有时候会有所误解,但相信我们的努力一定会得到回馈的。
接下来我们将从以下四个大的维度进行设计自查说明:
视觉设计包含了视觉标准、视觉信息架构、以及已有视觉风格的应用,设计师走查的原则就是传达品牌风格的同时保持标准化、一致性、最小化视觉传达高效的信息。
平台设计标准
不同的平台设计标准是不一样的,要按照所在平台的规范来选择尺寸。标准化带来的一致性给用户带来了易学易用的便利。设计师需要考虑不同的平台是否单独出设计稿,以安卓和 iOS 平台的图标为例:
△ icon-Android
△ icon-iOS
信息结构
当我们对于产品定位没有清晰认知的情况下,对于类似的需求可能会对页面上的信息传达过于均衡,每个信息都需要放大,每个信息都需要加强,每个信息都需要让用户获取到,在工作场景中,我们就会经常遇到:
诸如此类的情况,我们需要一个判断信息重要与否的标准来更好地权衡信息重要程度,使页面信息更有逻辑更加清晰。在众多设计原理中,格式塔原理一直被广泛应用,它可以很好的梳理界面信息结构、层级关系,从而提升设计的可读性。在自查过程中,我们可以通过格式塔原理检验页面中的元素是否符合标准。
△ 信息层级-格式塔
以相似性在 MONO、开眼、ONE 中的应用为例,我们可以发现,产品中相似的内容在页面中形成一个小的整体,向用户传递他们之间的相关联性,在视觉上营造视觉层次,可以很好的指导走查视觉元素的信息架构。
△ 信息层级-格式塔原理
自查信息结构时需要考虑的点:
文字
文字是产品的重要组成部分,是产品传达给用户的主要内容,对产品有非常大的影响,自查中需要把关文字是否符合平台规范。通常一款产品在设计之前会制定 Guideline,对文字的类型、字号及颜色进行规范。
△ guideline
文字的类型、字号、颜色、行距、对齐方式都是走查需要注意的细节,因为很多时候开发和我们的视角不一样,有些细微之处是看不出来的。可参考以下四点对页面进行自查:
图标
在界面中,图标不是单独的个体,每个应用内的图标都应该具有相同风格的图标,包括形状、圆角、线条粗细、品牌元素等。
图标在界面中通常是成群结队的出现,所以风格的一致性很容易对比出来。
△ DailyIcon
通过以上图片我们可以得出:统一的尺寸、统一的色彩、统一的圆角处理、统一的线条、统一的辅助形状,保持了每套图标的整体性。
系统图标还有一点需要注意,那就是尺寸,比如说 tab 栏、导航栏,常用尺寸为 48x48px、64x64px。
△ 信息层级-图片比例
控件
控件或模块交互样式较多时,需要设计确保设计稿件的可用性,避免遗漏。可以在以下几点进行自测走查:
△ 信息层级-控件多态
在交互设计精髓 4 中,作者曾提到大多数交互设计与视觉设计原则是跨平台的,对于普通的设计原则和交互细节,不同层面之间的界限不是很分明,这一部分和视觉设计的目标一致,都是将实际需求转化为界面。
反馈机制
当用户和产品需要交互时,会使用不同的模式反馈信息或结果,为用户在各个阶段提供必要、积极、及时的反馈,避免过度反馈,以免带来不必要的打扰。
常见的三种反馈信息如下,大家可以在此基础上自查是否有反馈、反馈是否传达清晰,是否对用户有即时的响应等细节,:
操作规范
操作规范主要包括两点:
在这两点中,设计师需要检查用户在层级操作中是否达到了最短触达路径?不同的页面同一个功能交互是否一致?对于危险操作是否给予了二次确认?操作后是否可以撤销?以及对操作手势的认知。
△ 手势
用户引导
顾名思义,就是对于产品新功能以及对新用户的引导,可以让用户在短时间内快速了解产品,轻松上手体验产品,最终完成自己的使用目标。
针对不同的场景,设计需要设计出不同的引导方案,同时要考虑用户引导是否对不同权限的用户展示同样的引导?新功能提示是否对用户的使用造成了打扰?用户引导的取消机制是什么?
△ 引导层
特殊场景在设计过程中常常会被忽略,等到在现实中碰到才会意识到缺失异常状态会非常尴尬,所以大家在完成主流程设计后,一定也要考虑到特殊场景。大家可以参照以下几种场景对设计进行自查优化调整。
网络异常
考虑到网络异常情况时,通常产品会通过异常状态页面或者交互反馈来告知用户当前的异常状态和如何解决问题(解决方案引导、刷新、toast)。
△ 网易严选
服务器异常
服务器异常状况较少出现,时间也较短,通常不提示具体原因,设计处理方式为在新页面展示缺省页,文案+插画的形式给予用户提示及重试引导。
空状态
空状态指的是页面中无内容,主要的几个情况,设计师需要根据不同的场景给出文案+插画的表现形式引导用户:
△ 设计走查清单
以上是自己在工作中总结的一些经验,希望可以对大家有所帮助,做好设计自查工作,减少协作的工作成本,更高效的与团队成员合作!
学须静,才须学。做一名优秀的设计师还需要继续努力啊,第一次写对外的文章,大家多多指教。
文章来源: https://www.uisdc.com/design-self-inspection 作者:木子的小千世界
声明:转载目的在于传递更多信息,并不代表赞同其观点和对其真实性负责。文字、图片版权均属权利人,如涉及作品内容、版权和其它问题,请及时与我们联系。本网站对此声明具有最终解释权。
点赞