《人机交互》综合设计报告
设计名称：人机交互综合设计
选题名称：基于FrontPage的web界面——社交网页
姓名：李志祥学号：200903010044
专业班级：09级计算机科学与技术应用班
系（院）：计算机科学与信息工程学院
设计时间：2012年5月26日
目录
一、概述 (4)
1.1 系统设计目的 (4)
1.2 系统设计意义 (4)
二、需求分析 (4)
2.1 功能需求 (4)
2.1.1 登陆功能 (4)
2.1.2 密码提醒功能 (4)
2.1.3注册功能 (4)
2.1.4上传下载功能 (4)
2.2 界面需求 (4)
三、总体框架 (5)
3.1 功能框架 (5)
3.2 系统实现框架 (5)
四、对象建模分析 (6)
4.1 用户登陆及身份验证 (6)
4.2用户注册功能： (7)
4.3意见反馈功能 (7)
4.3视频功能...... . (8)
4.3图片功能...... . (8)
4.3社区板块功能 (9)
五、界面概要设计 (9)
5.1 主界面设计 (9)
5.2 登陆界面设计 (10)
5.3视频社区界面设计 (10)
5.2图片社区界面设计 (10)
5.2社交社区界面设计 (11)
六、视图的关联设计 (11)
七、详细设计 (12)
7.1登陆注册界面设计 (12)
7.2视频社区界面设计 (12)
7.2.1观看视频 (12)
7.2.2上传视频 (13)
7.2.3下载视频 (13)
7.2.3 评论留言 (13)
7.3图片社区界面设计 (13)
7.3.1上传图片 (13)
7.3.2下载图片 (13)
7.3.3评论留言 (13)
7.3.4建立和浏览相册 (13)
7.4社交社区界面设计 (13)
7.4.1检索热帖 (13)
7.4.1发帖 (14)
7.4.1下载资源 (14)
7.4.1评论留言 (14)
7.4.1建立社区 (14)
八、总结 (14)
8.1 学习体会 (14)
8.2 存在的不足 (14)
一、概述
1.1 系统设计目的
我校学员众多，但是大家的了解机会不是很多，大家很希望有一个展示自己，和他人交流的平台，所以我建立此网站的目的是提供一个平台，促进交友，让大家互相了解。
1.2 系统设计意义
此系统的出现可以给广大学员提供方便快捷个人信息介绍，可以提供想交友的圈子，可以在线共享视频，互动留言。
二、需求分析
2.1 功能需求
2.1.1 登陆功能
由于系统已经对每名用户登记在系统之内，根据数据库中的存储数据验证用户，看是否是合法用户，如果合法进入系统，不合法时进行错误提示。
2.1.2 密码提醒功能
由于用户对密码记忆保持时间不是很长，有可能忘记密码，界面提供提示功能，方便用户联想自己的密码。
2.1.3注册功能
当用户不是合法用户，用户需要加入系统中并成为合法用户，所以界面提供注册功能。
2.1.4上传下载功能
由于用户在界面操作时想将一些资源放在网页中，也想下载一些功能想让用户下载，所以界面提供上传下载功能。
2.2 界面需求
(1)符合Windows的一贯风格，具有易学易用的特征
(2)界面颜色比较深沉
(3)界面的风格以交互式为主，并加入一些介绍内容
(4)界面中内容积极健康向上，杜绝不合法内容
三、总体框架
3.1 功能框架
3.2 系统实现框架
四、对象建模分析
4.1 用户登陆及身份验证
4.2 用户注册功能：
当用户不是系统中的用户时可以申请注册，在进行登录，用户需要填写用户名、密码、邮箱等进行注册
4.3 意见反馈功能
用户管理员
用户在体验过网页后可以将自己的意见进行填写发表，系统将收集意见进行汇总，报告给管理员。
4.4 视频功能
4.5 图片功能
4.6 社区板块功能
五、界面概要设计
5.1 主界面设计
5.2 登陆界面设计
5.3 视频社区界面设计
5.4 图片社区界面设计5.5 社交社区界面设计
六、视图的关联设计
首页
登录注册
视频社区意见反馈
图片社区社交社区
七、详细设计
7.1 登陆注册界面设计
当用户进入网页后可以实现浏览功能，但要进行网页中的功能操作时需要进行登录，用户输入账号和密码开始登陆，系统进行身份验证，如果成功授予用户界面中的功能，如果不成功，
提示错误，请再次登陆或者退出。
当用户不是合法用户时可以进行注册，输入用户名和密码后点击注册，当通过系统的检测，用户名和密码均合法后注册成功。
7.2视频社区界面设计
用户可以在登陆后进入到视频板块，该板块中用户可以观看、浏览视频，也可将自己的视频进行上传或者下载板块中的视频资源。
7.2.1观看视频
当用户进入到视频板块中后可以观看网站中的视频，但需要安装播放插件才可以观看。
视频播放的界面采用嵌入式界面，无需打开新的界面。
7.2.2上传视频
本功能是用户登录成功后才能拥有的权利。
该界面同样采用的是嵌入式界面。
当用户上传视频时，系统会检测和提示该网页支持的视频格式，当与该格式匹配时，进行上传。
7.2.3下载视频
本功能是用户登录成功后才能拥有的权利。
用户可以任意下载网页中的共享视频资源。
7.2.4评论留言
本功能是用户登录成功后才能拥有的权利。
该界面同样采用的是嵌入式界面，用户可以对视频资源发表自己的意见。
7.3图片社区界面设计
用户在登录后可以进行网站内部的图片操作，例如更改自己的头像，组建自己的相册，浏览别人图片，下载图片资源。
7.3.1上传图片
本功能是用户登录成功后才能拥有的权利。
该界面同样采用的是嵌入式界面。
当用户上传图片时，系统会检测和提示该网页支持的图片格式，当与该格式匹配时，进行上传。
7.3.2下载图片
本功能是用户登录成功后才能拥有的权利。
用户可以任意下载网页中的共享图片资源。
7.3.3评论留言
本功能是用户登录成功后才能拥有的权利。
该界面同样采用的是嵌入式界面，用户可以对图片资源发表自己的意见。
7.3.4建立和浏览相册
本功能是用户登录成功后才能拥有的权利。
用户可以根据自己的喜好和信息建立自己的相册，也可以去浏览查看其他共享相册。
7.4社交社区界面设计
用户登陆后可以根据自己的喜好建立板块，可以在板块中发表日志，帖子。
其他人可以进行浏览，同时也可以留言，评论。
也可以下载板块中的共享资源。
7.4.1检索热帖
用户登陆后可以在社交板块启用功能，用户可以根据需要输入关键字，搜索出包含关键字的帖子，在进行浏览。
7.4.2发帖
用户登陆后可以在社交板块启用功能，用户在自己的社区可以输入文字内容，例如日志文章等帖子。
7.4.3下载资源
本功能是用户登录成功后才能拥有的权利。
用户可以任意下载网页中的共享资源。
7.4.4评论留言
本功能是用户登录成功后才能拥有的权利。
该界面同样采用的是嵌入式界面，用户可以对帖子发表自己的意见。
7.4.5建立社区
本功能是用户登录成功后才能拥有的权利，用户可以根据需要和喜好建立自己的个人社区或者公共社区。
八、总结
8.1 学习体会
通过对人机交互的设计，发现在设计过程中建立模型，构建视图还是比较繁琐的，因为要考虑到界面中的各方面功能。
在设计过程中，将在课堂中的一些知识也得到了实践，深刻的体会到在网页设计中。
例如合理的布局，合理的色彩搭配都是很重要的。
在深入实验的过程中发现人机交互界面的在现实应用中很重要。
在这过程中我深刻的学习和掌握了frontpage这个网页制作软件，对网页制作有了较深的体会。
8.2 存在的不足
通过自己的实践，发现对人机界面的把握还很浅薄，对人机交互界面设计的原则把握还是了解不够，对知识的应用还不是很连贯。
在使用frontpage这个软件时还不是很熟练，有一些解决不了的问题以后要加强这方面的学习。