教务处办公教学子系统—学科竞赛管理系统—UI设计

教务处办公教学子系统
——学科竞赛管理系统UI设计设计方案
院系
班级
小组成员宇航学院
131516班
马凌海刘帅李慧强
目录
教务处办公教学子系统 (1)
——学科竞赛管理系统UI设计设计方案 (1)
1.设计原则 (3)
1.1.方案概述 (3)
1.2.整体说明 (3)
1.2.1 一致性原则 (3)
1.2.2 准确性原则 (3)
1.2.3 布局合理化原则 (4)
1.2.4 系统操作合理性原则 (4)
1.2.5 系统响应时间原则 (5)
2.设计细节 (5)
2.1.设计概述 (5)
2.2.设计细节 (5)
2.2.1 登录界面 (5)
2.2.2 操作首页 (7)
2.2.3 功能1首页 (7)
2.2.4 功能1二级页面 (8)
2.2.5 功能2首页 (9)
2.2.6 功能2二级页面 (10)
3.其它说明 (12)
1.设计原则
1.1.方案概述
本设计方案依照用户需求说明书的各种要求和用户需求，以用户体验和满足用户需求为中心和设计原则，设计界面坚持直观、简洁，力求操作简便快捷，使用户对界面上对应的功能一目了然，使用户能够直接登录界面并完成相应的浏览并满足用户的需求。

1.2.整体说明
1.2.1一致性原则
字体
-保持字体及颜色一致，避免一套主题出现多个字体；
-不可修改的字段，统一用灰色文字显示。

对齐-保持页面内元素对齐方式的一致，如无特殊情况应避免同一页面出现多种对齐方式。

统一提示
-在包含必须与选填项的页面中，须在必填选项旁边给出统一的标识（*）；
-不同类型的数据输入限制文本类型，并在用户输入有误时给出提示。

1.2.2准确性原则
-使用一致的标记、标准缩写和颜色，显示信息的含义应该非常明确；
-使用用户语言词汇，保持语言的一致性。

1.2.3布局合理化原则
本UI设计方案遵循用户从上而下、自左向右的浏览习惯，使常用业务功能按键排列紧密，避免用户鼠标移动距离过长。

同时，将不常用的功能区边缘化或者隐藏，保持界面的简洁。

用户可专注于主要业务操作流程，有利于提高软件的实用性和舒适感。

菜单
-保持菜单简洁性及功能分类的准确性，菜单深度为2层；
-菜单中功能需要在二级页面中完成，避免一级页面太过拥挤。

按钮
-“确认”操作按钮放置左边，“取消”或“关闭”按钮放置于右边。

排版
-所有文字内容保持10-20像素的间距并居中对齐；各控件元素至少保持10像素以上的间距，并确保控件元素不紧贴于页面边缘。

表格数据列表
-字符型数据保持左对齐，数值型数据右对齐，统一显示小数位位数。

滚动条
-页面布局设计时根据需要设置滚动条。

页面导航
-让用户知道当前所在页面的位置，并明确导航结构。

信息提示窗口
-本窗口位于当前页面的居中位置，并适当弱化背景以减少信息干扰，使用户注意力集中于当前的提示窗口。

1.2.4系统操作合理性原则
-保证用户在仅使用键盘的情况下也可流畅地完成常用的业务操作，个控件间可以通过Tab键进行切换；
-在进行不可逆或者删除操作时有信息提示用户，并让用户确认是否继续操作，把操作造成的后果也告知用户。

1.2.5系统响应时间原则
-考虑到参赛人员的数量，本方案中系统响应时间为2-5秒；
-5秒以上系统未响应时会显示处理窗口，或显示进度条。

2.设计细节
2.1.设计概述
本次UI设计中，主要分为登录界面、操作首页和二级页面三部分，登录界面是用户进入该系统的入口，需要正确填写用户名和密码才有权利进入功能首页。

用户进入功能首页后，可根据自己需要选择功能1或功能2。

功能首页是对该功能的简单概述，用户可点击相应导航条进入二级页面具体了解相应信息。

2.2.设计细节
2.2.1登录界面
本系统在正常情况下通过统一认证系统登录，本校学生和教师在指定位置输入一卡通号或工作证号、密码及验证码后，可登录进系统。

非本校人员则可以通过新教务系统内的教务管理系统的教务系统入口三和入口四，使用教务处为其指定的通行证号码及密码登录进系统。

1.本校人员登录界面设计
教务处办公教学系统学科竞赛管理子系统作为教务处的一个分支系统，面向全校参与到竞赛活动中的学生及教职员工开放。

本校参加竞赛的学生及指导教师和竞赛组织工作人员均可通过北京航空航天大学校园网内部通用的统一认证系统登录。

本系统中的统一认证登录界面采用浅蓝色作为背景色，象征蓝天，符合北航的特色，最上方设置一条深蓝色的页眉，并插入北京航空航天大学的校徽于左上角作为标志图案，接着书写“北京航空航天大学”字样。

页眉下方正中央书写“统一认证中心”和“学科竞赛管理系统登录界面”字样，下方依次插入三个表单，分别是“职工号
/学号”表单、“密码”表单和“验证码”表单，其中“验证码”表单后给出所要填写的数值，在所有表单的下方插入“登录”按钮元件，正确填写所需内容后单击“登录”按钮即可登录进学科竞赛管理系统了。

2.外校人员登录界面设计
对于需要登录进教务处网站中的学科竞赛管理子系统中查询有关竞赛信息的外校学生和管理竞赛信息的外校指导老师及其他人来说，通过统一认证系统登录进本系统显然是无法实现的，因此，以上人员需要由教务处为其指定相应的临时通行证号码及其密码，通过新教务系统内的教务系统的外网入口进入。

2.2.2操作首页
按照需求说明书中的功能划分，可将该学科竞赛子系统的功能划分为两部分。

因此，可设计一个选择页面，当用户通过登录界面时，进入选择页面，根据自身需求可选择功能1或功能2，即可进入相应页面。

2.2.3功能1首页
功能1包括学科竞赛管理设置、准考证打印和成绩的登入、公布。

用户选择功能1可以及时了解竞赛的最新消息，完成竞赛报名、准考证打印以及成绩获取等。

用户可以在本页面总体了解竞赛过程及注意事项，具体了解某一信息需进入二级页面。

2.2.4功能1二级页面
功能1的二级页面具体提供给用户其需要的信息，包括报名地点、参赛人员报名流程图、参赛人员报名流程文字说明、报名时需准备的材料、参赛报名表格下载、竞赛政策及规则说明、参赛人员及其指导老师参赛时的注意事项、参赛时遇到的常见问题及解决办法等。

用户可以从中获取自己需要的具体信息，以帮助用户准备竞赛，为用户提供必要的信息支持。

2.2.5功能2首页
功能2是竞赛学生获奖和教师指导竞赛情况录入和查询，包括录入相应赛事的报名、培训、参赛和获奖情况、实现竞赛获奖情况的查询。

其中，赛事信息包括：赛事名称、竞赛时间、竞赛地点、参加人员（包括姓名、学号、班级）；教师指导信息包括：相应参赛指导教师信息（姓名、工作证号、学院）、各教师指导竞赛工作量、指导获奖数量；获奖信息包括：获奖等级、奖项、获奖学生名单（姓名、学号、奖项）。

本页面只提供基本信息，具体获奖情况可登入二级页面查询。

（用户只能查询自己的成绩和获奖情况，总体情况将由各学院或教务处整理后发布）
2.2.6功能2二级页面
用户登入二级页面后，可查到自己的竞赛成绩和获奖情况，包括参赛考生的奖项、获奖等级、获奖金额和指导教师的指导情况及获奖数量。

3.其它说明
本系统开发周期较短，具备良好的经济效益和实用性。

本系统适合北京航空航天大学及其他高等教育机构进行不同类型和规模的学科竞赛的组织和管理，也可以用于实现各种社会上的比赛和竞赛的组织和管理，具有良好的兼容性。

在这一系统的开发过程中，由于本组人员初次接触系统需求说明和系统UI设计，在知识和经验等方面都存在着不足。

另外，在该系统的开发过程中，由于时间较为仓促，该系统必然会存在一些缺陷和不足。

由于对竞赛流程和管理过程不够熟悉，在需求分析中也未能完全满足使用者的需求。

尽管本系统存在诸多不足，但其功能全面、效率高、操作方便、安全性好、信息化程度高等优点是学科竞赛管理系统所必需的，可以满足高校学科竞赛及其他竞赛活动的组织和管理需要，确保竞赛的顺利进行。