动手画原型时你都在想想什么,面对需求,你是不是全部的堆积到原型上还是无从下手,亦或是现找网站截图,然后copy。Oh.no!来本盟主告诉你打开原型设计的正确姿势。

那些年,不,时间也不久;做产品刚满一年,恰好0岁。刚开始什么也不懂,就学习了几天Axure就出来闯江湖了(大三一直到毕业),到现在懂得了许多,也能够发表自己的高见了(泪奔啊),产品路上遇到过许多坑,一个一个爬上来吧。以下是个人设计原型路上遇到的坑,希望能帮助正在入门的产品们。

原型的四个错误根源

6月底接到一个项目,设计一个跟交易平台,至今,原型还是需要改,接近200多个页面,改的好痛苦。盟主总结错误来源在于:

错误根源一:

需求没整明白就开始设计。需求是另外一个同事梳理的,稀里糊涂看了2天,大概明白做一件什么事,就开始设计。2周内原型设计完毕,将近200页啊。交付老大一看,大家都懵逼了。老大硬着头皮一点一点看,觉得不合理一个字“改”,流程不对,一个字“改”。于是默默的改了快2周。

So,不要认为懂了需求,就开始设计。请事先想想3w问题:

  • what’s the aim?明确产品主要是做什么。一句话概括产品是个什么样的产品,例如:*网站,是一个产品爱好者学习、交流的平台。
  • Who’s the users?产品的使用者?即用户是谁?考虑这个产品的使用者是哪些用户?是否有群体特征。这是为下步做铺垫。
  • what’s the function?产品的核心功能是什么。在了解用户后,考虑用户会有哪些操作,这些操作的流程是什么?明确产品的主要核心功能操作有哪些。列举所有功能点,找出核心。

错误根源二:

创造新设计。说实在我常常喜欢创造。这给设计和开发带来很大痛苦。(请开发看到不要骂死我)一般开始设计原型时,我们都是找竞品开始研究分析。即便这样,还是有许多不同之处。在这个将近200页的原型中,自我创造许多东西,竞品太复杂,干脆不看了。UI设计时很痛苦问我,这里,那里到底要放些什么,到底要不要?这样设计不符合用户常规操作啊。

So,不要自找麻烦。在设计时问问自己3h问题:

  • How to divide?将产品照模块划,考虑每一个模块包含的主要内容。
  • How to design?模块划分好后,考虑该如何设计。
  • How to combine?每一个模块设计是否能够组合到一起,如果能如何更好的展示呢。

错误根源三:

自我设限。业务流程绘制后,开始设计原型了。按照流程,哦可能他需要这个操作,哦他可能不需要这个操作。于是这里多添加了一个选择按钮,那里少了一个开关按钮,更有甚者,算了交付给用户自己选择吧。

So,不要自我设限(挖坑)。牵一发而动全身,不要觉得一个按钮不重要,一个词不重要。优先的产品定的原型是绝对不允许被改动被改来改去。

要记住用户都是懒的,不要把太多工作交给用户。设计时尽量做减法,减去不必要的功能。好好想一想,这个功能去掉会不会有影响,这个词这样说,会不会给用户带来疑惑。

错误根源四:

业务逻辑没梳理清楚。

设计过程中设计师不断的跟你沟通,此处指的是什么,这个逻辑有点不对吧,于是你说想一下(其实内心是崩溃的,一万个草泥马从内心奔过,骂自己怎么这个笨,心里承认设计师说的很对,却不愿承认自己很low)。好吧,设计师看的很头大,勉为其难的将它设计完毕(优秀的设计师会调整布局和取舍元素,而不是原型设计成什么样,设计成什么样)。到了开发阶段,开发看不懂,于是又会问你。如果你没想明白整个业务流程,接下来你又会陷入沉默…于是设计、开发都会在心里默默的骂你,整个项目都在不断的沟通中进行,预期的开发时间又要延期了…

So,业务逻辑没搞明白是最让人头疼的事。到开发期间发现错误,技术要改跟多,因此将业务梳理清楚至关重要。多设想几个用户使用场景,在不同的场景下,用户会有怎么样的操作,根据这些优化整个业务逻辑。

因此我们在设计原型时,以上错误根源够吗?No!不够。

动手画之前请拿起你的2b铅笔

Happy work在于思考,思考到位,思考方向正确,这样会减少后面与设计、开发的不断沟通、不断的开会确认。那么动手前该思考些什么呢?

从0到1产品设计第一步:CEO定好产品的方向和模式。

方向决定产品的战略。方向定位不准,会造成又一层的理解,那么做出来的产品容易跑偏。模式决定产品的生命力。对于模式,在一个昝新的领域,行业首创,要考虑用户会不会买单,接受度有多高,对于有市场的该如何吸引用户。对于已经有行业的,该如何建立自己的模式而不同于其他产品,获取用户的关注。

产品设计第二步:框架和业务逻辑。

产品负责人整理出需求的整个框架和业务逻辑。

框架帮助梳理产品包含哪些模块,每个模块里会有哪些功能。

业务逻辑:上面也讲述到要从多方面考虑业务逻辑。如果一个产品有多个用户群体,要考虑每个用户群体的特征和功能操作。

产品第三步:请拿起你的2b铅笔。

不管你是产品助理,亦或是产品经理,如果你想变得优秀,一定要学会独立思考。以上思考点也是每个产品经理必做的,因此,在设计前先思考以上,做下设计方案。

动用你的2b铅笔,画下你的思考框架和页面、业务流程图。整体的框架可以帮你和团队建立起对产品的认识。页面可以帮助你取舍网页元素布局、说明。业务流程图帮你和开发梳理产品的核心流程。Ok。在你最好方案后,大家无异议的情况下,就可以着手设计原型了。不要以为方案就是万全的,接下来设计时你也需要去思考:

设计原型前,请避免这4个错误,再拿起你的2B铅笔

页面设计流程3步骤:

第一步:分析每个页面包含的内容,将其整理成模块。

模块划分这个没有一个标准,至今也在不断的思考中。个人是认为按照展示信息来划分,然后根据展示信息的优先级来进行排版,凸出核心,隐藏有关但不紧要的内容。

分析信息结构:核心信息、信息模块、信息类型。如何分析:分析页面包含哪些模块,每个模块内的信息元素有哪些?例如:*的首页。模块分为:导航、推荐文章、搜索、注册登录、专栏作家、推广模块、推荐书栏、底部的合作伙伴、底部导航等。

对于推荐文章:元素包括图片、文章标题、文章内容推荐。站在用户的角度去考虑,重要点在于:文章标题,文章推荐语。因此这个模块的设计应该凸出文章标题、简介字体要比标题小,提取文章的图片、吸引用户。

对每一个模块,我们要分析其包含的信息类型。例如:推荐文章模块包含信息类型:图片、标题、文章推荐语。数据类型是动态的,时时更新,后台管理员审核推荐,写推荐语。级别非常重要,让用户看到优秀的文章。

用户操作。分析完模块的信息内容后,就该思考用户会有哪些操作。哪些功能是明显操作的,哪些应该被隐藏起来。这些功能的前置条件是什么?后置条件是什么?这些功能目前很重要吗?

接着上面推荐文章分析。这个模块用户操作是点击,查看文章详情。那么如何告诉用户这个可以点击呢?鼠标移入、移出文章、图片有效果显示。跳转到文章详情,在文章详情页面可进行的操作是:用户可以评论、收藏、查看