恭喜你成为UI中国推荐设计师 (详情)
//百度统计 20220402 uicn

您的意见是我们 UI 中国进步的动力!
点击立即反馈按钮,发表您的意见!
立即反馈
QQ群反馈
您也可以加入UI中国官方反馈群进行反馈!
群号:302892100
备注:反馈问题后@管理员能让我们及时了解您的意见

提交需求

赛事与广告咨询合作,请填写需求表单,我们会在第一时间与您联系!

0/20
0/200

设计大赛

  • 设计大赛
  • 发布广告
  • 发布招聘
  • 其它需求

提交完成
感谢您对UI中国的支持和信赖!
产品设计走查表
0.0°
2017-06-07 原创文章 经验/观点 举报 10735 14 8 0

对于最近一直改改改的问题,做了一些自我检讨和反思。最近有些小伙伴向我吐槽为什么辛辛苦苦做了一天的设计稿,也是按照产品需求修改的,认认真真标准一整天的成果发给开发的时候,他们并不鸟你有多辛苦呦多认真,并不多看你的标准一眼。他们会有一堆的自适应啊,工期紧张啊等等各种你意料之中的理由来搪塞你。那结果自然也是意料之中的。

在公司的培训学院讲课的时候,有这么一个活动,小伙伴A对B描述一个物件,B再告诉C,到G的时候,让G去执行,然后A去验收。从多次的活动中来看,G能完全按照当初A的想法执行的基本没有。放到我们设计师平时的工作中也经常出现类似的场景。产品到交互、视觉、开发都是需要一个完整的沟通交流过程,产品把领导或者客户的需求传到给设计师时候,就是希望能够做出初步的产品呈现,而当他们确认的时候,就是设计师完成的第一步工作。在接下来和开发对接的过程,确实很多设计师忽略的过程。但是这个过程也是设计师最重要的工作过程,这也是今天想和大家分享的内容——走查设计工作

那到底改怎么开始走查我们的设计工作呢,其实没有什么一个完整的设计流程,或者唯一正确的设计流程,每个人的方式方法都略有不同,那在这里和大家分享一下自己平时的经验和流程:

第一步,确保方案的可用性/可行性
不管是在移动端还是PC端,在设计稿输出过程中,都要考虑到方案的可用性。这需要从两个方面来看:
1、对于移动端来说,设计的应用是建立在手指点击操作的基础上进行使用。每个人手指的粗细不太一样,这就要考虑到需要手指触发的地方是否精确定位和响应,所以需要我们在设计的过程中确保可点击的区域能够较为明显的识别。
另一点呢,移动端的交互效果颇多,这需要和开发人员有充分的沟通是否能够按照设计稿的想法去实现。
2、对于PC端来说,设计的页面是否能够清晰的有层次的传递信息,对于一些凸显的地方,是否能够抓住用户的眼球,鼠标触发的地方是否给出相应的反馈,在各个功能场景之间是否可以跳转流畅;如果是面对产品升级或者产品新版本的迭代研发,新的设计方案是否能够和老版本很好的融合,组件上是否能做到视觉和交互统一呢?
同样,在把设计稿交付给开发之前也需要有充分的沟通,对于一些酷炫的效果,开发是否能实现,在面对市场上那么多玲琅满目的浏览器的时候,能做到兼容适配吗?这都是我们要了解到的地方。

第二步,页面架构和导航
页面的整体布局是否用户熟悉或容易理解的结构?各个功能场景之间是否能够清晰有层次的表达彼此之间的结构?是否有一些晦涩隐藏到不容易理解或者注意的地方,这都是在开始动手设计之前要全局考虑的问题

第三步,检查页面同类信息的一致性:
全局综合来看,规范界面,再次确认一遍自己的设计稿在界面上的大小尺寸等细节是否有问题,可以在ps play或者skala preview查看。这个过程包括头部、尾部等位置是否完整统一,按钮样式、反馈状态、报错等样式是否统一;是否缺少功能点和对应的多种状态,根据任务流程或者功能点对场景和状态进行一一匹配排查,保证设计的完整性。

第四步,文本、表单不枯燥
不管是toC的产品还是to B 的产品,很多时候都会面对文本和表单这两种场景,对于这两个场景的体现看似简单,但是想表现的很好其实需要更多的心思。对于文本内容来说,很多人说中文排版不好看,那是因为你不会用中文排版的方式去排版,所以在页面中确保文字清晰、易阅读是在文字处理上必须要考虑的。对于表单来说,输入框的长宽比例,彼此之间的间隙,不同状态的样式,这是个特别考虑功底的地方,尤其是面对工具型的产品,有些场景会有几十个字段的时候,要怎么处理,让用户能够相对心情愉悦的把信息输入完成,这是我们在设计和再检查阶段反复雕琢的一个过程

第五步,注意颜色对屏幕的影响
移动端上,android不同的屏幕在色彩饱和度上有较大的差异,比如华为的屏幕饱和度比一般机型要偏高。所以在进行设计的时候,选择的颜色一定要适中,不要偏色。
PC端上,MAC OS X系统和windows系统的屏幕分辨率在颜色视觉显示上有很大的区别,windows系统上的颜色饱和度要偏弱一些,所以要尽可能的降低在Mac OS X系统看着很舒服的设计稿,为什么在windows系统下看就打折扣的问题。

第六步,Icon的使用
icon是图形化的一种表现方式,他的价值在于简化文体信息,通过图形更形象的表达功能含义。所以设计的icon如果不能很好的表达,就会给用户造成识别困扰,所以这也是为什么很多专业团队,会有一个专职图标设计师的角色。

第七步,动效的使用
现在很多公司的视觉设计师的招聘岗位职责里面都有一条:会动效设计优先。可见大家对动效的喜爱和重视程度,如果哪个产品中有炫酷的动效设计,这也是圈粉的高规格方式之一。当然也不是所有的动效都是锦上添花的,所以在使用的过程中,一定要根据实际情况来看,不能随意加入多余的动效,给产品带来不必要的麻烦。
说到动效的使用,那怎么实现产品的动效,这也是需要设计师和开发紧密沟通的一个过程。

第八步,校验信息的提示
每个字段的检验规则是不一样的,但是校验的样式却可以统一分类。

最后,检查
在所有设计包括走查都完成后,交付给开发的内容也是我们要走查的地方:设计稿、标注(切图的命名是否规范、图片质量)、设计规范以及交互文档(包含控件的统一、字体大小规范、校验信息的不同场景等)。交付给开发的时候一定要沟通清楚,就算你标准做的很认真很详细,但是开发不见得会去看,这个我是深有体会啊。所以啊,开发完成后,一定要像对待自己孩子一样,认真的check哪些细节和设计稿标准规范等等不同的地方。因为即使是我们平时临摹别人的作品,设计水平相同的两个,临摹出的同一个页面都会有明显的差别,更何况是设计功底很薄弱的开发同学用代码去还原的页面呢?


更新:2017-06-07

收藏

14人已收藏

好设青年

然,知其然,释其所以然

  • 42

    作品

  • 450

    粉丝

  • 14

    关注

  • 商品列表设计如何提升购物体验——泛渠道小程序产品复盘思考
  • 论页面设计中的间距重要性——8大电商移动端间距数据采集和分析
  • B2C和C2C在前端购物流程设计上有哪些不同?
  • 京东、淘宝商品详情页设计背后的思考
相关标签
设计用户体验UDC

    猜你喜欢

      2017-06-07 原创文章 经验/观点 举报 10735 14 8 0

      产品设计走查表

      0.0°

      你确定要举报产品设计走查表

      如果查出恶意举报,十天内禁止提交任何举报申请。

      0/200

      上传证据: 超过10M的附件请使用网盘地址

      点击上传附件

      对谁可见:

      全部设计师
      • 全部设计师
      • 推荐设计师和认证设计师

      您确认要推荐?

      该作品发布时间:2017年06月07日

      评分

      完整度

      启发性

      勤奋性

      排版布局

      推荐心得

      建议20-200字以内

      0/200

      8
      14
      0

      账号或密码错误,请重新输入

      账号或密码错误,请重新输入

      登录

      手机号

      发送验证码 120s 验证码错误

      登录
      第三方账号登录