人机交互课程设计

1、人机交互综合设计报告设计名称： 人机交互综合设计 选题名称：基于FrontPage的web界面社交网页姓 名： 李志祥 学 号： 4 专业班级： 09级计算机科学与技术应用班 系 （院）： 计算机科学与信息工程学院 设计时间： 2012年5月26日 成绩：指导教师评语： 签名： 年 月 日 目录一、概述41.1 系统设计目的41.2 系统设计意义4二、需求分析42.1 功能需求42.1.1 登陆功能42.1.2 密码提醒功能42.1.3注册功能 42.1.4上传下载功能 42.2 界面需求4三、总体框架53.1 功能框架53.2 系统实现框架5四、对象建模分析64.1 用户登陆及身份验证64.

2、2用户注册功能：74.3意见反馈功能74.3视频功能84.3图片功能84.3社区板块功能9五、界面概要设计95.1 主界面设计95.2 登陆界面设计105.3视频社区界面设计105.2图片社区界面设计105.2社交社区界面设计11六、视图的关联设计11七、详细设计127.1登陆注册界面设计127.2视频社区界面设计127.2.1观看视频127.2.2上传视频137.2.3下载视频137.2.3 评论留言137.3图片社区界面设计137.3.1上传图片137.3.2下载图片137.3.3评论留言137.3.4建立和浏览相册137.4社交社区界面设计137.4.1检索热帖137.4.1发帖147.

3、4.1下载资源147.4.1评论留言147.4.1建立社区14八、总结148.1 学习体会148.2 存在的不足14一、概述1.1 系统设计目的我校学员众多，但是大家的了解机会不是很多，大家很希望有一个展示自己，和他人交流的平台，所以我建立此网站的目的是提供一个平台，促进交友，让大家互相了解。 1.2 系统设计意义此系统的出现可以给广大学员提供方便快捷个人信息介绍，可以提供想交友的圈子，可以在线共享视频，互动留言。二、需求分析2.1 功能需求2.1.1 登陆功能由于系统已经对每名用户登记在系统之内，根据数据库中的存储数据验证用户，看是否是合法用户，如果合法进入系统，不合法时进行错误提示。2.1

4、.2 密码提醒功能由于用户对密码记忆保持时间不是很长，有可能忘记密码，界面提供提示功能，方便用户联想自己的密码。2.1.3注册功能 当用户不是合法用户，用户需要加入系统中并成为合法用户，所以界面提供注册功能。2.1.4上传下载功能 由于用户在界面操作时想将一些资源放在网页中，也想下载一些功能想让用户下载，所以界面提供上传下载功能。2.2 界面需求(1) 符合Windows的一贯风格，具有易学易用的特征(2) 界面颜色比较深沉(3) 界面的风格以交互式为主，并加入一些介绍内容(4) 界面中内容积极健康向上，杜绝不合法内容三、总体框架3.1 功能框架 3.2 系统实现框架四、对象建模分析4.1 用

5、户登陆及身份验证4.2 用户注册功能：当用户不是系统中的用户时可以申请注册，在进行登录，用户需要填写用户名、密码、邮箱等进行注册4.3 意见反馈功能 用户在体验过网页后可以将自己的意见进行填写发表，系统将收集意见进行汇总，报告给管理员。4.4 视频功能4.5 图片功能 4.6 社区板块功能 五、界面概要设计5.1 主界面设计5.2 登陆界面设计5.3 视频社区界面设计5.4 图片社区界面设计5.5 社交社区界面设计六、视图的关联设计七、详细设计7.1 登陆注册界面设计 当用户进入网页后可以实现浏览功能，但要进行网页中的功能操作时需要进行登录，用户输入账号和密码开始登陆，系统进行身份验证，如果成

6、功授予用户界面中的功能，如果不成功，提示错误，请再次登陆或者退出。当用户不是合法用户时可以进行注册，输入用户名和密码后点击注册，当通过系统的检测，用户名和密码均合法后注册成功。7.2视频社区界面设计用户可以在登陆后进入到视频板块，该板块中用户可以观看、浏览视频，也可将自己的视频进行上传或者下载板块中的视频资源。7.2.1观看视频 当用户进入到视频板块中后可以观看网站中的视频，但需要安装播放插件才可以观看。视频播放的界面采用嵌入式界面，无需打开新的界面。7.2.2上传视频 本功能是用户登录成功后才能拥有的权利。该界面同样采用的是嵌入式界面。当用户上传视频时，系统会检测和提示该网页支持的视频格式，

7、当与该格式匹配时，进行上传。7.2.3下载视频本功能是用户登录成功后才能拥有的权利。用户可以任意下载网页中的共享视频资源。7.2.4评论留言 本功能是用户登录成功后才能拥有的权利。该界面同样采用的是嵌入式界面，用户可以对视频资源发表自己的意见。7.3图片社区界面设计用户在登录后可以进行网站内部的图片操作，例如更改自己的头像，组建自己的相册，浏览别人图片，下载图片资源。7.3.1上传图片本功能是用户登录成功后才能拥有的权利。该界面同样采用的是嵌入式界面。当用户上传图片时，系统会检测和提示该网页支持的图片格式，当与该格式匹配时，进行上传。7.3.2下载图片本功能是用户登录成功后才能拥有的权利。用户

8、可以任意下载网页中的共享图片资源。7.3.3评论留言 本功能是用户登录成功后才能拥有的权利。该界面同样采用的是嵌入式界面，用户可以对图片资源发表自己的意见。7.3.4建立和浏览相册 本功能是用户登录成功后才能拥有的权利。用户可以根据自己的喜好和信息建立自己的相册，也可以去浏览查看其他共享相册。7.4社交社区界面设计用户登陆后可以根据自己的喜好建立板块，可以在板块中发表日志，帖子。其他人可以进行浏览，同时也可以留言，评论。也可以下载板块中的共享资源。7.4.1检索热帖 用户登陆后可以在社交板块启用功能，用户可以根据需要输入关键字，搜索出包含关键字的帖子，在进行浏览。7.4.2发帖 用户登陆后可以

9、在社交板块启用功能，用户在自己的社区可以输入文字内容，例如日志文章等帖子。7.4.3下载资源本功能是用户登录成功后才能拥有的权利。用户可以任意下载网页中的共享资源。7.4.4评论留言 本功能是用户登录成功后才能拥有的权利。该界面同样采用的是嵌入式界面，用户可以对帖子发表自己的意见。7.4.5建立社区本功能是用户登录成功后才能拥有的权利，用户可以根据需要和喜好建立自己的个人社区或者公共社区。八、总结8.1 学习体会通过对人机交互的设计，发现在设计过程中建立模型，构建视图还是比较繁琐的，因为要考虑到界面中的各方面功能。在设计过程中，将在课堂中的一些知识也得到了实践，深刻的体会到在网页设计中。例如合理的布局，合理的色彩搭配都是很重要的。在深入实验的过程中发现人机交互界面的在现实应用中很重要。在这过程中我深刻的学习和掌