写作初心：梳理学习流程，方便日后查看

预计时间：3PT

实际：7+（信息梳理需要进行大量发散，查找很多概念，同时需要有目标的舍弃）

学习目标：把自己做好的内容提交给老师，接受老师点评，顺便得瑟一下

结果：失败（低估了做好原型图设计的时间；别的同学做的更认真）

设计要求

汽车罚单原型图设计要求

原型图设计步骤

1.功能理解和思考

2.梳理功能流程

3.梳理页面流程

4.设计页面线框图

原型图设计步骤

1. 功能理解和思考

在这次功能描述中，我没有按照老师的方法，进行简单的头脑风暴，把功能描述出来；而是利用5W2H的方法对内容进行详细的拆分，因为我认为这样会描述的更加具体。

这种描述的缺点是过于详细，可能对流程梳理的帮助不大。比如，使用频次那里，是线框图设计时候应该考虑的问题，提前思考会造成思维局限在局部，后边详谈。

功能拆分

这张图的优点

用5W2H能够更精确的定位用户使用场景，使用频率和使用地点这里可以粗略推断用户情绪，对于会员服务的定位比较有效。比如添加罚单提醒功能，就不用每天都去查看，将会省心很多。

在进行会员服务范围定位上，我下载了几个app来看，同时浏览了多个评测网页的设计，在会员服务范围上花了比较多的时间。

这张图的缺点

刚开始，就把会员服务扩展的太深，不利于流程梳理。

做功能流程图可以有两种方法：

1、把琐碎的功能全部想全，然后开始做流程图

2、先做粗线条，然后在线框图部分从后往前反馈

第1种方法是不恰当的，因为会在局部用力过多，导致最终任务失败。

用思维的弹球模型举例子，第1种方法对应第1张图，在小片区域反复循环，但没有看到森林；第2种方法就是把整体框架先做理解，后期再完成局部优化。

集中和发散状态下的思路弹球

老师讲解后的改进流程

1.用句子描述功能

2.把句子里的概念进行切分和梳理，找到更多流程

3.把大的流程梳理完毕

对应这次作业，就是先把流程梳理清楚，再来查找申诉流程、罚单信息、查找罚单流程。下边是根据老师的讲解，做的内容梳理。

页面流程梳理 粗略页面流程

以上的内容均在XMind中完成。

2.梳理功能流程

这部分主要任务是把流程进行细化，在细化过程中可能会遇到新的灵感或者问题，建立的粗略流程会被打乱重来。

3.页面流程梳理

把相关的内容放到同一页中，技术含量比较低。

前三步的内容进行图示化表示如下

注：下边的内容只是表示大致步骤，具体内容并不能很好的显示

功能流程图

页面流程图

4.原型图设计

原型图设计步骤

1.充分理解页面职能——5W2H

这时候用5W2H是比较合适的，能够建立用户场景，考虑用户在场景中的行为，然后制定相应目标。

2.确定和筛选页面所需要的内容信息

这个过程是发散——>收敛的过程，不断寻获新的信息，然后对信息进行分类，分为三类：必要、次要、无用。

3.放置页面元素并布局

这个过程要对三类信息进行分组，并确定优先级顺序。

4.调整元素视觉顺序并设计交互方式

这个过程是需要持续学习的，在作图过程中，我的脑海里没有足够的模型，都是借鉴现有的成熟页面设计完成的。

前三步

初始三要素

1.页面标题是什么？

2.页面需要导航栏么？

3.页面有没有返回箭头？

这三个问题也可以作为最后的检查清单，我在设计的时候忘记了加上“页面标题”。

一些线框图设计细节

1.元素的呈现效果跟最终呈现效果要一致

2.不允许出现边框，会对页面产生较强的切割感

3.要考虑到最差的结果

对应图中的就是——万一有30张优惠券，该如何显示，所以将卡片的设计改为列表。

4.可以利用图片吸引顾客，但列表达不到这样的效果

---

思维习惯

1.个人学习态度的转变—时间

我大概用了9个番茄来完成这次作业，觉得自己很用功了；而前边的同学在下班回来后就思考作业的问题，所以我的努力还是远远不够的，只是自以为很用功而已。

2.问题拆分方法的深入

除了5W2H拆分，在功能流程图的设计中“概念拆分”可以收到比较好的效果

3.反复试错及调整的重要性

在整个作图过程中，老师在收到大家建议后修改了很多次，更别说在实际的应用场景中，所以要做好失败的准备。

每次修改都要从前往后改，功能流程图-页面流程图-原型图，如果只改了后边没有改前边在后期查看的时候就会造成很大的困扰。

4.我们不一样

老师点评了奖金10份作业，几乎没有一致的，对思维模式差异有了更深刻的体会。

所以，在以后的工作中一定要注意沟通，并且尝试理解别人的思维模式。