前些时候做了一个调查系统的小项目，正好可以拿出来和大家分享。为了本文行文方便，略去了一些较复杂的功能需求。

概述
话说某资讯站点编辑常有开展在线调查问卷的需求，而当时用的是开源的 PhpQuestionnaire，他常向我抱怨，说是太复杂了，又难用。好多功能用不到，核心功能又因为有那么多干扰，用起来非常难受。我能体会，所以我拍拍他肩膀道：来，我给你优化一下…

我简单收集和分析了下需求，他作为资讯站点编辑，所要的无非就是创建调查、查看统计（两个目标），调查问卷的问题可分为：单选、多选、开放式三种。调查创建完后，可以使用 JS 在其他页面引用，所以前台界面本文暂不探讨。

当然除了这位编辑，他会将调查系统的使用传授给他的手下，和一些新来的小编。这下我基本把使用者（后台）锁定在两个角色上：王少斌（熟练的编辑）和小杰（新手）。

设计
一开始，需求分析的时候，我先定义和解释了一些名词：调查、问题、问题类型（单选、多选、开放式）、问题选项、关闭（即撤下统计并从当前进行中除去）。这对后期开发、使用是有巨大帮助的。

然后我便设计了一些基本情景（涵盖典型使用情况）：

·小杰登录进管理后台，尝试着添加少斌安排下来的新调查“你为什么而工作？”，填写完调查信息和问题（边填写边设计问题和选项）后，浏览了一遍确认无误后保存，并将该项调查的 JS 代码拷贝（然后添加到特定页面）；
·少斌登录进管理后台，看看现在进行中的有哪些调查，各有多少人参与了，有一些放了超过一个月参与人数超过一定数量的就把它关闭，然后再看看自己关心“你为什么而工作？”这个调查的统计情况；
·少斌发现“你为什么而工作？”这个调查少了一个问题，幸好调查才进行了半天，于是吩咐小杰把问题加上，并提醒加在第三个问题后面；
·小杰有点郁闷，不早说…于是便进入后台编辑了调查的问题，新添加了一个单选问题：“你觉得自己的薪水怎么样？”，选项是：“过低”、“一般”、“挺高”、“相当高”四个，并调整一下顺序。
根据以上情景，可以归纳总结出任务（每个任务都有针对特定角色）。然后我列出了以下任务表：

那么，这些任务列出来后怎么办呢？针对每一项任务设计流程。我这里举01、02、03号任务说明，如下图：

待所有任务流程设计完毕后，即可制作可交互的原型了。

原文链接：http://ucdchina.com/blog/?p=119

更多UI博客精选