UI如何做视觉走查

作者: 小腰果 | 来源:发表于2017-03-13 15:26 被阅读1018次

刚入行的时候,一般原型图拿到以后就开始撸图了,撸完切图标注好了就扔给开发不理了。开发做完之后,就开始抱怨开发哥哥能力不行巴拉巴拉的。有时候辛辛苦苦改好了设计稿后,认认真真标注一整天的结局却是你们前端或其他程序员并没有照着你的标注来做,因为他们说自适应不能这样调整,或者各种理由来搪塞你。这个时候,一般会有两种心理,一种是面对大家的质疑,我对自己的设计稿没有自信,另外一种是懒。结局可想而知,开发做不到还原不说,领导还会觉得是你的锅。所以视觉走查是必不可少的。

一、视觉走查是什么

简单的说,就是开发按照你的设计图,我们可以在测试环境下的产品demo进行检查,是否和你的设计图一致。

二、怎么做视觉走查

那么我们应该怎么做一些检查呢?

1.检查页面的一致性。这里主要看看是否符合你的视觉规范,包括topbar、navbar、按钮、反馈等等,再看看有没有缺少页面(不要以为开发哥哥怎么会丢掉这种东西,事实告诉你,真的有这种情况,特别是一些场景状态);

2.检查交互动作,操作的合理性。一些小的交互动作,操作及其反馈,交互控件的各种状态,极端、极限和出错的情况,默认值是否正确,第一屏的高度,悬停状态、文案等等。这些小细节开发都是容易疏忽的。这个时候UI妹妹就要提醒一下开发哥哥了。

3.检查是否有色差、尺寸间距、图片质量,是否符合栅格等等。所谓设计师的像素眼这个时候就是你最好表现的时候了。不同的手机会有不同的尺寸,这个时候,我们设计的时候也要注意一下怎么样做才能够完美适配?而且Android手机分辨率的不同,色差真的是非常的大,做设计的时候,一定要适中。我一般用sketch撸图做完了设计稿,最后调整颜色的时候,都会看着手机调的,所以我确保iOS上没有问题,安卓我会截图到手机,然后看看会不会相差很大。

4.自我检查。看看有文本的地方,阅读性是否合理,是否易于阅读;看看icon的合理性,是否能表达出你想要表达的文字,会不会有识别障碍。

三、遇到问题怎么办

我巴拉巴拉列了一堆问题,整理了一个文档交给开发。开发哥哥一定是想吐血了。然后很有可能就开始了撕逼。这个时候退一步海阔天空,有的时候开发真的已经尽力了,那我们就在他能实现的范围内,改改稿子,尽量做的最好,程序员猝死已经不是罕见的事了。

开发哥哥和UI就是酱紫的相爱相杀。

希望大家都能做出满意的产品。

END。

相关文章

  • UI如何做视觉走查

    刚入行的时候,一般原型图拿到以后就开始撸图了,撸完切图标注好了就扔给开发不理了。开发做完之后,就开始抱怨开发哥哥能...

  • UI设计课堂重梳理笔记

    重新梳理UI流程: 研究——概念Demo——产品立项——交互设计——视觉设计——前端开发——测试走查——上线——再...

  • UI走查

  • UI设计规范V0.1.0

    执行阶段高保真视觉设计阶段 执行人 UI设计师 规范内容 下一阶段通过开发的测试包进行UI走查,由UI设计师及交互...

  • 新生代UI设计

    互联网产品上线步骤 研究》概念 Demo》产品立项PM》交互设计UE》视觉设计UI》前端后台开发RD》测试走查QA...

  • 设计师要懂这些代码知识(字体篇)!

    作为一个有追求的Ui视觉设计师,我们常常在走查时面对程序员实现的设计页面欲哭无泪!不知道哪里不对,但是哪里都很别扭...

  • 交互走查表

    架构走查 用户是否知晓自己的位置,并且能够顺利回到首页 信息层级是否合理,是否易于理解 信息视觉是否流畅 流程走查...

  • 设计走查

    架构走查 用户是否知晓自己的位置,并且能够顺利回到首页 信息层级是否合理,是否易于理解 信息视觉是否流畅 流程走查...

  • 开发页面如何把设计稿100%还原

    视觉设计师作为展示产品最终形态的执行层,产品上线前走查视觉与交互还原是必经环节,而留给设计师走查修改的时间其实非常...

  • 1

    UI设计:视觉,体验,交互。

网友评论

  • ed811fc9ee54:配点图示说明效果会更好,举几个反面教材就棒呆了。毕竟本篇主要还是针对刚入门的UI或研发、产品的朋友。
    小腰果:@小星啊哈 嗯嗯 下篇更精彩:blush:
  • 347a407ef4a0:哟,厉害厉害厉害
  • Milcah_Z:哈哈哈哈杨老师牛!

本文标题:UI如何做视觉走查

本文链接:https://www.haomeiwen.com/subject/binfnttx.html