photoshop教学网站的设计与开发毕业论文.doc

目 录photoshop教学网站的设计与开发毕业论文目 录摘 要IAbstractI1 绪论11.1 国内外发展现况11.1.1 国外发展概况11.1.2 国内的现状和发展趋势11.2 研究意义22 开发技术及环境22.1 ASP.NET简介22.2 VB.NET简介32.3 Access数据库33 需求分析43.1 系统的性能要求43.2 系统的功能需求分析43.2.1 功能划分及描述43.2.2 数据流图54 系统的概要设计64.1 系统的总体设计结构64.2 系统数据库概念结构设计75 详细设计与系统实现95.1 数据库表详细说明95.2 系统功能模块的详细设计与实现105.2.1 首页的设计与实现105.2.2 教学模块的设计与实现115.2.3 资料模块的设计与实现145.2.4 互动模块的设计与实现175.2.5 课业模块的设计与实现215.3 网站后台管理模块的详细设计23结论27参考文献27致谢28III河北科技师范学院2012届本科毕业设计1 绪论 1.1 国内外发展现况1.1.1 国外发展概况国外网络教育的发展已经有过相当长的一段时间，相对于我国的网络来说，国外网络教育应用广泛，效果显著。在美国，越来越多的人选择半工半读或在职学习的方式，他们中的许多人工作不定时，经常外出。而网络教学突破了时间、地点的限制，满足了这些人的学习要求1。现有三百五十多所大学和学院提供函授和因特网教育的远程学习学位，基本覆盖了美国高校的所有专业和学科。目前美国通过网络教学获得高等教育学位的学生大约占全国高等学校在校生人数的8% 2。而据有关机构统计到2002 年美国接受网络高等教育的人数将达到223 万人。1.1.2 国内的现状和发展趋势我国国内的网络教学，相对于国外的网络教学来说，发展起点晚，经验也不足。但是我国政府十分重视网络教育。国务院转发教育部制订的“面向21 世纪教育振兴行动计划”中，明确提出了实施现代远程教育工程，并在第三次全国教育工作会议上，提出在2010 年初步实现高等教育大众化的目标，建立现代远程教育网络，构建终身教育体系。为此，国家对教育信息基础设施投入很大的人力物力，建成中国教育科研网(CER-NET) ，并开展地区性区域教育信息网络建设和校园网络建设3。随着清华大学等38 所试点大学网络教育的快速发展，远程教育也逐步成为一个倍受人们关注的领域。目前我国各试点学校初步摸索出一套网上办学的模式，开发出一批网上课程和教学资源，初步形成了校内基于校园网的多媒体教学与校外远程教学同时进行并相互融合的开放式办学格局。在高等教育方面，国家教育部于1998年正式批准了清华、北邮、浙大、湖大为首批开发远程教学的试点学校；1999年初，国务院发布面向二十一世纪振兴行动计划，其中明确提出：实施“现代远程教育工程”，形成开放式教育网络，构建终身学习体系；2000年，国家教育部连续批准了人民大学等26所高校开展现代远程教育试点。这一系列举措，表明国家对INTERNET远程教育事业的重视，INTERNET远程教育的发展必将成为未来教育的焦点。随着网络教学的发展，国家现在特别重视网络教学的建设问题4。虽然我国现在大力的支持网络教学的建设，但是客观的说我国的网络教学建设还是处于起始阶段，还缺乏一些理论指导，以及统一的调配问题，形成现在的全而不精的局面。我国的网络教学建设与国外相比还是有很大差距的5。1.2 研究意义Photoshop是迄今为止世界上最畅销的图象编辑软件。它已成为许多涉及图像处理的行业的标准。界面设计是一个新兴的领域，已经受到越来越多的软件企业及开发者的重视，虽然暂时还未成为一种全新的职业，但相信不久一定会出现专业的界面设计师职业6。在当前还没有用于做界面设计的专业软件，因此绝大多数设计者使用的都是Photoshop。但是在实际教学过程中，这门课程的教学效果往往不是很理想，教师觉得这门课程教起来比较困难，大部分学生感觉枯燥无味，所学知识没什么实际用处，很难达到较好的教学效果或获得较强的实践能力7。随着万维网的不断提速与扩容，为基于Web开展网上教学和远程教育提供了物理基础。如何有效地设计、开发和利用网络资源构建photoshop教学网站，可以提高学生的学习兴趣、扩大知识面、辅助课堂教学以及提高自身的实践能力和应用能力，成为一个令人关注的话题8。2 开发技术及环境 2.1 ASP.NET简介ASP.NET的前身ASP技术，是在IIS 2.0上首次推出(Windows NT 3.51)，当时与 ADO 1.0 一起推出，在IIS 3.0 (Windows NT 4.0)发扬光大，成为服务器端应用程序的热门开发工具，微软还特别为它量身打造了Visual InterDev开发工具，在1994年到2000年之间，ASP技术已经成为微软推展Windows NT 4.0平台的关键技术之一，数以万计的ASP网站也是这个时候开始如雨后春笋般的出现在网络上。它的简单以及高度可定制化的能力，也是它能迅速崛起的原因之一9。（1）强大性和适应性因为ASP.net是基于通用语言的编译运行的程序，所以它的强大性和适应性，可以使它运行在Web应用软件开发者的几乎全部的平台上（笔者到现在为止只知道它只能用在Windows 2000/2003 Server，VISTA/WIN7/XP上）。通用语言的基本库，消息机制，数据接口的处理都能无缝的整合到ASP.net的Web应用中。ASP.net同时也是language-independent（语言独立化）的，所以，你可以选择一种最适合你的语言来编写你的程序，或者把你的程序用很多种语言来写，现在已经支持的有C#（C+和Java的结合体），VB，Jscript , C+、F+。将来，这样的多种程序语言协同工作的能力保护您现在的基于COM+开发的程序，能够完整的移植向ASP.net。（2）简单性和易学性ASP.net使运行一些很平常的任务如表单的提交客户端的身份验证、分布系统和网站配置变得非常简单。例如ASP.net页面构架允许你建立你自己的用户分界面，使其不同于常见的VB-Like界面10。（3）自定义性和可扩展性用户可以使用自己编写的自定义组件或扩展替换ASP.NET运行库的任何子组件。ASP.NET基于通用语言，开发者可以使用任何.NET支持的语言（比如C#，VB.NET，等）来开发.NET的程序11。（4）多种性能优良的功能ASP.NET与其前身ASP最大的区别在于其不再是解释性的脚本了，而是运行于服务器端经过编译的代码，这使早期绑定、本地优化、缓存服务等技术成为可能，无疑这将大大的提高ASP.NET程序的执行效率。（5）高效可管理性ASP.NET程序的所有配置都存储于基于XML的文件中。这将大大的简化对服务器环境和网络程序的配置过程12。ASP.NET框架应用程序的部署时只需将必要的文件复制到服务器，即可将 ASP.NET框架应用程序部署到服务器。2.2 VB.NET简介VB.NET的前身是Visual Basic,并对其进行的彻底的变革，对底层进行了重建，使其成为了面向对象的程序设计语言。VB.NET简单易学，同时因为得到了.NET框架的支持，功能更加强大13。2.3 Access数据库Access能够存取 Access/Jet、Microsoft SQL Server、Oracle，或者任何 ODBC兼容数据库内的资料。Microsoft Access在很多地方得到广泛使用，例如小型企业，大公司的部门，和喜爱编程的开发人员专门利用它来制作处理数据的桌面系统14。它也常被用来开发简单的WEB应用程序。这些应用程序都利用ASP技术在InternetInformation Services运行。其主要特点如下：（1）界面友好、易操作Access是一个可视化工具，其风格与Windows完全一样，用户想要生成对象并应用，只要使用鼠标进行拖放即可，非常直观方便15。系统还提供了表生成器、查询生成器、报表设计器以及数据库向导、表向导、查询向导、窗体向导、报表向导等工具，使得操作简便，容易使用和掌握16。（2）面向对象Access是一个面向对象的开发工具，利用面向对象的方式将数据库系统中的各种功能对象化，将数据库管理的各种功能封装在各类对象中。它将一个应用系统当作是由一系列对象组成的，对每个对象它都定义一组方法和属性，以定义该对象的行为和外国，用户还可以按需要给对象扩展方法和属性。通过对象的方法、属性完成数据库的操作和管理，极大地简化了用户的开发工作17。同时，这种基于面向对象的开发方式，使得开发应用程序更为简便。（3）集成环境、处理多种数据信息Access基于Windows操作系统下的集成开发环境，该环境集成了各种向导和生成器工具，极大地提高了开发人员的工作效率，使得建立数据库、创建表、设计用户界面、设计数据查询、报表打印等可以方便有序地进行18。（4）Access支持ODBC（开发数据库互连，Open Data Base Connectivity）利用Access强大的DDE（动态数据交换）和OLE（对象的联接和嵌入）特性，可以在一个数据表中嵌入位图、声音、Excel表格、Word文档，还可以建立动态的数据库报表和窗体等。Access还可以将程序应用于网络，并与网络上的动态数据相联接。利用数据库访问页对象生成HTML文件，轻松构建Internet/Intranet的应用19 20。 3 需求分析3.1 系统的性能要求（1）运行环境要求运行环境需要一台服务器，安装windows2000以上操作系统，支持Access数据库。客户端只需要安装Windows98以上的版本及浏览器即可浏览该网站。（2）安全性要求本系统有着权限设置，对于非法用户，不能够根据用户的相对网址来访问网站和对网站进行任何操作。必须进行登陆才可以访问操作。3.2 系统的功能需求分析3.2.1 功能划分及描述“photoshop”教学网站分为五大功能模块：教学天地、资料殿堂、互动时间、课程作业、后台管理， 根据系统的功能划分，每个模块的需求描述如下：（1）教学教学模块分为：理论教学、案例教学、实践教学。（2）资料该功能模块主要分为课件、例题、相关网站和业界动态四个子功能模块。（3）互动该功能模块主要包括留言板和公告两个功能模块。（4）课业该功能模块主要包括优秀作品、作业信息和作业提交三个功能模块。（5）后台管理该模块用于管理员管理网站，管理通过主页链接进入管理界面，通过登录认证后可以对网站进行管理。3.2.2 数据流图以下是系统一级数据流图和二级数据流图，如图1、图2所示。1用户管理管理员学生3管理员操作4留言管理2学生操作D1 管理用户信息D2 学生用户信息D3 留言信息 D10 作业信息D9 公告信息D8 业界动态信息D7 相关网站信息D6 例题信息D5 课件信息D4 教学信息管理员学生用户名 密码权限用户名 密码权限图1 系统一级数据流图3.1管理 D10 作业信息D1 管理用户信息D2 学生用户信息 D3 留言信息 D4 教学信息 D5 课件信息 D6 例题信息D7 相关网站信息D8 业界动态信息 D9 公告信息3.2管理3.3 答疑管理3.4更新动态3.5更新公告3.6更新作业信息2.1注册登录2.2提问交流2.3浏览学习2.4下载学习2.5参考学习2.6网站浏览2.7动态浏览2.8获取公告内容2.9查看图2系统二级数据流图4 系统的概要设计 4.1 系统的总体设计结构本系统利用ASP.net技术和Access 2007数据库构建基于Web的开放的、资源共享的、交互式的教学网站，该网站可以在基于Windows 2000/XP/2003系统构建的局域网或Internet上使用。本系统面向学生、管理员两种身份的用户，不过在系统中，把管理员的权限，下放给教师，所以老师同时担任了管理员的角色。整个系统的功能框架图如下图3所示。教学理论教学案例教学实践教学资料课件例题相关网站业界动态课业作业信息优秀作品作业提交后台管理互动Photoshop教学网站留言板公告作业信息管理优秀作品管理学生信息管理业界动态管理公告管理图3 总体功能结构图4.2 系统数据库概念结构设计通过以上的分析可以知道，系统主要涉及的实体有：学生、教师、留言、公告等，实体之间联系复杂，现分析如下：（1）留言管理涉及的实体有：学生、教师、留言内容。学生属性有编号、用户名、密码、e_mail。教师属性有编号、用户名、密码、e_mail。留言内容属性有编号、留言者、留言内容、留言时间。这些实体之间的联系如下：学生主要通过留言提问，教师主要是回答留言。实体联系图如图4所示。教师学生邮箱用户名编号邮箱密码用户名编号留言时间留言内容留言者编号密码回答提问留言内容图4 留言板E-R图（2）公告信息管理涉及的实体有：学生、教师、教学信息。学生属性有编号、用户名、密码、e_mail。教师属性有编号、用户名、密码、e_mail。教学信息属性有编号、标题、内容。这些实体之间的联系如下：一位老师可以更新多条公告信息，一条公告信息只能由一名老师来进行更新，因此教师和公告信息之间是一对多的联系。一位学生可以浏览多条公告信息，一条公告信息可以让多个学生浏览，因此学生与公告信息之间是多对多的联系。实体联系图如图5所示。公告教师学生更新浏览公告内容标题编号图5 公告信息管理E-R图（3）业界动态信息管理涉及的实体有：学生、教师、动态内容。学生属性有编号、用户名、密码、e_mail。教师属性有编号、用户名、密码、e_mail。业界动态信息属性有编号、标题、内容。这些实体之间的联系如下：教师更新动态，学生浏览动态。实体联系图如图6所示。动态内容教师学生更新浏览动态内容标题编号图6 业界动态信息管理E-R图5 详细设计与系统实现5.1 数据库表详细说明表1 学生信息/管理员信息表字段名 描述类型长度是否空是否主键ID用户ID号Bigint4否是UserName用户名Varchar10否否Pwem密码邮箱VarcharVarchar2020否否否否表2 案例教学/理论教学资料表字段名 描述类型长度是否空是否主键ID资料ID号Bigint4否是tm资料名称Varchar10否否nr资料内容备注否否表3 留言信息表字段名 描述类型长度是否空是否主键ID信息ID号Bigint4否是author用户名Varchar10否否Liuyan留言内容Varchar255否否posttime留言时间datetime否否表4 业界动态表字段名 描述类型长度是否空是否主键ID动态ID号Bigint4否是tm动态名称Varchar10否否nr动态内容备注否否表5 公告表字段名 描述类型长度是否空是否主键ID公告ID号Bigint4否是tm公告名称Varchar10否否nr公告内容备注否否5.2 系统功能模块的详细设计与实现5.2.1 首页的设计与实现首页包括了教学、资料、互动、课业、后台管理五个大板块，点击各个相应的超链接，就会进入相应的功能页面。首页的页面效果，如图7所示。图7 首页的页面实现效果 5.2.2 教学模块的设计与实现点击首页中的“教学”超链接，即可进入教学模块。教学模块主要分为理论教学模块、案例教学模块、实践教学模块三个子功能模块。这三个子模块分别向学生提供理论知识、教学案例和课上教学视频。教学模块页面实现效果如图8所示。图8 教学模块的页面实现效果该模块包揽了三个教学模块的内容，上面两个模块是理论教学和案例教学的一部分模块，中间嵌入的是实践教学中的视频文件，按播放按钮可以播放，最底下是一些优秀的PS图片，其中视频文件的主要实现代码是：（1）理论教学模块如图9所示。图9 理论教学模块该模块记录了photoshop理论知识，点击链接可进入相关知识内容页面，其实现主要代码如下：Sub Page_Load(Sender As Object, E As EventArgs)建立Connection对象Dim conn As NewOleDbConnection(Provider=Microsoft.Jet.OLEDB.4.0;DataSource=&Server.Mappath(./ps.mdb) 建立Connection对象Dim adp As New OleDbDataAdapter(select * from aljx, conn)建立DataAdapter对象Dim ds As New DataSet() 建立DataSet对象adp.Fill(ds, tm) 填充DataSet对象MyDataGrid.DataSource=DS.Tables(tm).DefaultView 指定数据源MyDataGrid.DataBind() 执行绑定conn.close()End Sub（2）案例教学如图10所示。图10 案例教学模块 该模块实现方法同理论教学，当点击该界面链接可以打开案例界面，案例界面包括Photoshop案例的具体实现步骤，由于该界面实现主要代码同理论教学界面在此不作赘述。（3）实践教学模块主要是Photoshop教学视频，其中在教学模块已有体现，再次不做赘述。 5.2.3 资料模块的设计与实现资料模块意在拓展学生的知识，开阔学生的视野。资料模块主要有课件、例题、相关网站、业界动态四个子功能模块。其中点击课件链接可进入课件界面，在该界面可以对课件进行下载；点击例题链接可以进入例题界面，在该界面可以对例题进行下载；点击相关网站链接，可以进入相关网站界面，在该界面主要是一些其他Photoshop教学网站的网址，点击可以浏览其他Photoshop教学网站；点击业界动态链接可以进入业界动态界面，在该界面主要是和Photoshop有关的新闻动态。资料模块页面实现效果如图11所示。图11 资料模块资料模块设计思路同教学模块，从主页点击“资料”链接后进入后资料模块，点击该模块导航的课件、例题、相关网站、业界动态四个链接可以分别进入对应的四个子功能模块。其中课件子模块主要提供教师教课课件的下载，例题子模块主要提供，课本以及老师上课讲解的例题的下载，相关网站主要是一些其他Photoshop教学网站的链接，供学生参考学习，业界动态主要是给学生提供和Photoshop有关的新闻动态，拓展学生知识面。（1）课件模块如图12所示。图12 课件模块如图所示点击课件进入可见模块，点击章节可进行课件下载，下载的主要实现代码如下：第1章初识Photoshop（2）例题模块，其实现方法同课件模块再次不做赘述。（3）相关网站如图13所示。图13 相关网站模块（4）业界动态如图14，图15所示。图14 业界动态模块一图15 业界动态模块二点击相应动态则打开相应网页从数据库中读取数据，其实现代码如下：Sub Page_Load(Sender As Object, E As EventArgs)建立Connection对象Dim conn As New OleDbConnection(Provider=Microsoft.Jet.OLEDB.4.0;Data Source=&Server.Mappath(./ps.mdb) Dim adp As New OleDbDataAdapter(select * from yjdt, conn)Dim ds As New DataSet() 建立DataSet对象adp.Fill(ds, tm) 填充DataSet对象MyDataGrid.DataSource=DS.Tables(tm).DefaultView 指定数据源MyDataGrid.DataBind() 执行绑定 conn.close()End Sub 5.2.4 互动模块的设计与实现互动模块可以让学生与学生之间老师与学生之间进行交流，可以提高学生的学习兴趣与积极性，要使用该模块功能则要登录，也可以在该界面进行注册，登录成功后则可以进入留言板模块，其实现如图16所示。图16 互动模块该模块实现主要代码如下：Sub enter_click(Sender As Object, E As EventArgs)建立Connection对象,注意从web.Config中获取数据库连接字符串Dim conn As New OleDbConnection(ConfigurationSettings.AppSettings(strConn)建立Command对象，注意要根据用户输入的用户名和密码进行查找Dim conn As New OleDbConnection(Provider=Microsoft.Jet.OLEDB.4.0;Data Source= & Server.Mappath(./ps.mdb) 建立Connection对象Dim strSql As StringstrSql=Select * From muser Where username= & username.Text & And pw= & password.Text & Dim cmd As New OleDbCommand(strSql, conn)conn.Open() Dim dr As OleDbDataReader = cmd.ExecuteReader() dr.Read()=True表示有1条记录，说明有该用户。否则表示没有该用户If dr.Read()=True Then conn.Close() Response.Redirect(liuyan.aspx)message.Text=登录成功，欢迎您！Elseconn.Close() message.Text=您必须输入有效的用户名和密码End IfEnd Sub用户登录用户名：密码：  （1）留言板模块如图17所示。图17 留言模块学生和教师可以在此发表留言，同时教师和学生都可以对过期的留言进行删除，减少老师管理工作量，其实现主要代码如下：Dim conn As New OleDbConnection(Provider=Microsoft.Jet.OLEDB.4.0;Data Source= & Server.MapPath(./ps.mdb)Dim strSql As StringDim cmd As New OleDbCommandPrivate Sub Page_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load 显示留言If Request.QueryString(action) = del And Not Request.QueryString(id) = ThenstrSql = delete from info where id= + Request.QueryString(id)conn.Open()cmd = New OleDbCommand(strSql, conn)cmd.ExecuteNonQuery()conn.Close()End IfstrSql = select * from infoconn.Open()cmd = New OleDbCommand(strSql, conn)Dim dr As OleDbDataReader = cmd.ExecuteReader()TryDo While dr.Read()liuyan.Text += 留言者： + dr.Item(author) + 留言内容： + dr.Item(liuyan) + ( + dr.Item(posttime).ToString + ) + 删除留言LoopIf liuyan.Text = Thenliuyan.Text = 暂时没有留言！End IfCatch ex As Exceptionliuyan.Text = 程序出错 + ex.MessageEnd Tryconn.Close()End SubSub add(ByVal sender As Object, ByVal e As System.EventArgs) 添加留言Dim _author, _liuyan As String_author = author.Text.ToString_liuyan = addliuyan.Text.ToStringIf Not _author = And Not _liuyan = Then)conn.Open()cmd = New OleDbCommand(strSql, conn)cmd.ExecuteNonQuery()conn.Close()End If End Sub 留言显示：留言者：内容（2）公告模块的实现如同业界动态在此不做赘述。5.2.5 课业模块的设计与实现点击首页中的“课业”超链接，即可进入课业模块。课业模块主要分为优秀作品、作业信息、作业提交三个子功能模块。（1）优秀作品模块如图18所示。图18 优秀作品模块的页面实现效果点击该模块相关链接则可以对优秀学生作品进行下载。（2）作业信息模块如图19所示。图19 作业信息模块该模块代码原理同“公告”模块，在此不作赘述。（3）作业提交模块如图20所示。图20 作业提交模块该模块主要代码如下：sub upload(src as object, e as eventargs)if uploadfile.postedfile.contentlength=0 thenshowuploadfile.innertext=上传失败或文件不存在！elsedim temp() as string=split(uploadfile.postedfile.filename,)dim filename as string=temp(temp.length-1)uploadfile.postedfile.saveas(server.mappath(.) & files & filename)showuploadfile.innerhtml=文件上传成功！上传文件名： & filenameend if end sub 作业提交请同学们注意提交作业文件命名方式：请以学号加姓名为文件名字，如0913080104张三5.3 网站后台管理模块的详细设计用户点击首页后台管理链接可进入管理员登录界面，其实现代码同学生登录。登录成功则可进入管理界面，后台管理主要利用detailsview控件实现对数据库信息的编辑，删除，增加，查询等的基本操作，现以学生信息管理模块为例说明后台管理的基本功能。其页面实现效果如图21、图22、图23所示。图21 学生信息管理界面一图22 学生信息管理界面二图23 学生信息管理界面三在该界面用户可实现对数据库信息的增加、编辑、删除查询等。实现这些功能的关键代码如下所示： 结论本网站主要模块包括教学、资料、互动、课业、后台管理，该网站一方面增加学生理论知识，另一方面还可以提高学生实践能力，使学生从被动的教学模式解放出来。本设计基本上实现了上述功能模块的实现，但技术运用上有待提