产品经理是否应该画线框图

近来在公司内,被boss强制要求必须要画线框图,而且对线框图提出了诸多要求,包括:不允许添加图片和颜色,必须使用mockplus的形式,不能使用xd (Experience Design)的形式来制作,等。作为产品经理,在试用了多款工具后,更倾向于选择使用xd完成交互设计稿,而同时boss非常坚持,认为产品经理怎么能不画线框图呢?不画线框图你还是产品经理吗?“你这能叫线框图?”并当场百度,结果如下。 度娘给出的线框图: 我画出的交互稿(实际上是省略了线框图): 确实感觉完全不是一个东东。而且知乎上搜索了一下,貌似很多同学对线框图的概念也不是特别清晰。所以,还是决定写篇文章来深入探讨一下到底什么是所谓的线框图。 WHAT? 首先让我们先来搞清楚线框图的概念,其实我们口中说的线框图的概念有点大。下面圈里面的东西都被我们称为线框图。而百度给出的应该是狭义上的线框图,即Wireframes。而线框也分为有链接跳转和交互的线框和流程线框。本文讨论的线框图是指包涵说明和流程跳转的线框图。 当然实际的情况中,可能还存在介于这些概念之间的其它形式。总而言之,无论什么形式,从项目和产品的概念阶段开始,产出的产品文档一定是越来越清晰,图片越来越多,交互越来越完整,功能点越来越详细,视觉呈现越来越逼真,修改起来也越来越麻烦的一个阶段,这个文档的形成过程被称作The Design Funnel。 WHY? 那么,明确了线框的概念,再来看下到底为什么要画线框。(ps: 需要说明的是线框一般都是交互设计师完成的。但创业公司的苦逼产品,交互设计自然都是要一个人负责到底啦)线框图的目的被整理为下面的几个: Wireframes display site architecture visually (直观的展现站点结构 / APP结构) Wireframes allow for clarification of website features  (定义站点功能) Wireframes push usability to the forefront (将产品的可用性问题暴露出来) Wireframes identify ease of updates (便于更新和修改) Wireframes help make the design process iterative (使得设计过程相对独立) Wireframes save time on […]