如果PM画原型图的话，那么UI该注意些什么？

理想状况下，原型图是UED来负责，各部门leader在确认过页面布局交互之后（原型阶段），再进入（视觉阶段）。实际上，很多职能不完善的公司都是PM来画原型的。

你期望中的原型可能是这样的

或者这样的

实际上，却很可能是这样的

领导们肯定看不懂这种原型了，所以PM会要求UI赶紧出视觉稿，然后各部门leader再通过视觉效果来决定方案是否通过。这种工作模式的利弊我们就不分析了，因为就算是规划好各种职能范围，公司的职能体系也不会在旦夕之间得到完善。所以不必惊慌失措，活儿还是要干的。

开始干活前：

一、明确需求

以电商为例，产品需求大多来自业务方（销售、供应链等）。业务方传达需求的时候，PM会把开发、UI拉去听一下，这样大家就知道要做些什么。UI可以大致记录一下注意事项，例如需求方的喜好等。

请注意！不要听完就开始动手做。PM应当写邮件传达确定的需求，包括功能范围、实现方式等，发送给需求方、UI、前后端开发。这样大家才能明确按照一个方案做事情，避免资源浪费。

实际情况会复杂一些，要留意以下几个坑：

1.不要在聊天工具上传达需求。

有些PM会在qq上跟你撒娇套近乎，类似这种“帮我简单修改一下呗”。几分钟可以搞定的就算了，如果是需求很含糊又很花时间的那种，例如web页面的视觉优化，那么你就要当心了，很有可能你辛辛苦苦做了很多稿，对方也不能满意。

原因是什么呢？就是需求不明确。

qq上的三言两语很难系统地进行明确的需求传达。就视觉优化来说，今天给出关键词“简洁／安全／效率”，明天很可能又给出关键词“丰富／年轻／热闹“。往往PM在看到每一版最新稿的时候，压根就忘记之前的初衷是什么。因此，通过邮件来传达需求正是一种促使对方来认真提需求的有效方式。

如果PM并没有决定权，而只是传递需求，那么请忽略这条吧～

2.不要仅口头上传达需求。

3.不要答应“先快速做一下看看效果”。

二、确定优先级

请注意！不要接到需求就开始动手做。公司不只一个业务，UI手头上也不只一件事情。UI在接到新任务后，要问一下大概的开发排期，从而确定设计任务的先后次序。如果都很紧急，就需要提醒PM内部协商一下。

如果每个PM都觉得自己的需求优先级是最高的，如果每个需求都要在当天完成，那么，UI就只能天天加班了。

在项目上线阶段，大家加班几天辛苦一阵子是应该的，平时最好不要把加班时间也算进去。天天加班脑子容易僵化，也做不好设计。

此外，评估时间时，不要忘记方案确认和方案调整时间，稍微充裕一些，交出至少自己满意的方案。

即使需求方说“要求不高，随便做一下”之类，也不要匆忙答应，因为你的任何一次方案，都会影响他人对你设计水平的判断。

三、发现问题

PM负责原型，要求也不能太高。先过一遍原型，及时发现问题，如果不能解决，最好提前问清楚。

实际情况会复杂一些，要留意以下几个坑：

1.原型没头没尾，只描述了页面的局部功能。

做过原型图的应该都知道，只画局部功能，很容易忽略页面其他状态。为了以防万一，还是确认一下页面，避免做错。

2.原型文案不确定。

文案的长度会影响页面文字的展现形式，经过确认的线框图最好不要做太多文案的调整，否则视觉样式也要重新调整。UI也会稍微检查下文案中是否有错别字，但一般不会关注文案内容。

如果在视觉review阶段，大家考察的不是视觉效果而是文案是否合适，那么这个工作流程就需要改进了。遇到过最坑的一次，需求方和PM同时站在UI的电脑前，为了一个措辞纠结了10来分钟。其实这个问题在线框图review阶段就应该被解决的，越是到后面的流程，涉及到改动的范围就越大。

3.逻辑状态不全。

以电商网站的订单列表页为例，不同的订单状态（待付款／待发货／待收货／待评价…）会涉及到不同的用户操作（立即付款／确认收货／申请售后／退货…），也会涉及到不同的视觉样式。

PM不用把全部状态都画出来，但是需要标明所有可能出现的状况，方便UI对页面设计有一个全局的把握，不至于遗漏任何一种情况。

四、UI需要想到的

很多交互的细节就甭指望PM能画出来了，要知道，整个电商网站对他们来说也只有搜索／商品／购物车／结算／个人中心等几个模块，很多页面在他们眼里都是一个页面。所以，UI在这些具体的交互细节上要考虑全面。

1.页面的各种状态

以列表页为例，主要包括：

－无数据时－空白页（blank state）

－页面刷新时－加载页（loading state）

－数据展示－正常页

－页面发生错误－异常页

2.控件的各种状态

以button为例，主要包括：

－鼠标悬浮状态－focused／hover

－点击状态－pressed

－正常状态－normal

－不可点击状态－disabled

－不可点击时鼠标悬浮－disabled & focused

未完待续～

先写这么多吧，感觉已经把所有PM都得罪了一遍…

所有配图均来自网络，已经忘记出处，抱歉…