原型地址：http://72iten.axshare.com/#c=2
首页：根据用户类型分别进入教师界面，学生界面。
首页
账号或密码错误，显示错误提示，并且清空输入框，方便用户重新输入。
错误提示
学生界面：分为选题，选题结果两个子页面。
选题：
使用选项卡一来是节省屏幕空间，二来因为平时使用一些浏览器时，它们采用这种方式打开多个网页，体验很流畅，所以想实现试试。
学生界面
对于学生选志愿，并且将志愿排出第一，第二，第三志愿功能，我最开始的考虑是先将学生选中的志愿列到一张表格中，然后通过拖动表项，排出志愿顺序。后来，我觉得这种方式不是很友好。首先，用鼠标拖动”表项“这一微小的屏幕元素，是一件不容易的事，用户容易错点，操作不易。其次，用户选志愿这件事被分成了两步，先选志愿，再排志愿，增加了用户的心理负担。怎么让用户知道这种拖动志愿的排志愿方式？用户选完志愿以为大功告成，退出了，怎么办？思考良久，最终我用下图方式实现了该功能：
志愿级别
用户勾选志愿后，志愿排序按钮会占据屏幕，”逼迫“用户选出级别。而且在选择了一个等级后，该等级会被删除，避免用户下个志愿设置重复级别，避免增加抢占式对话框提示用户志愿级别重复。
下一次选择
选择的结果，实时更新到表格中：
选择结果
提交提示：让用户确认自己的选择
提交提示
选题结果：
公布最终的选题结果
选题结果
教师界面：分为出题，题目列表，定题，选题结果
出题：
对于控制教师出5—8道题目，并且要求教师必须填写题目名称，题目描述功能，我最开始是想用表格来实现，如果用表格实现，教师在没有输够5道题时，要弹出抢占式对话框，"逼迫“用户输够题目数，而且题目描述一项与其他项目比有较多文字，实现出来的表格不够美观。最终，我选择了用竖式的选项卡来实现，当题目不够5道时，提交按钮不可点击，当输够5道题目的时候，提交按钮提供视觉提示。
出题
题目列表：
可供查看其他教师出的题目
选题列表
定题
为自己出的题目选定最多一个学生，如果未选择由系统自动分配
选中结果实时更新到表格中，方便查看
定题
选题结果
公布最终的选题结果
选题结果
网友评论