专科毕业设计说明书王鹏.docx
《专科毕业设计说明书王鹏.docx》由会员分享,可在线阅读,更多相关《专科毕业设计说明书王鹏.docx(36页珍藏版)》请在冰豆网上搜索。
专科毕业设计说明书王鹏
阳泉学院
毕业设计说明书
毕业生姓名
:
王鹏
专业
:
广告设计与制作
学号
:
090122012
指导教师
:
苏颖
所属系(部)
:
社会科学系
二〇一二年五月
阳泉学院
毕业设计评阅书
题目:
您的王先生工作室
社会科学 系 广告设计与制作专业姓名 王鹏
设计时间:
2012年2月16日~2012年5月18日
评阅意见:
成绩:
指导教师:
(签字)
职 务:
201年 月 日
阳泉学院
毕业设计答辩记录卡
社会科学系 广告设计与制作 专业姓名 王鹏
答辩内容
问题摘要
评议情况
记录员:
(签名)
成绩评定
指导教师评定成绩
答辩组评定成绩
综合成绩
注:
评定成绩为100分制,指导教师为30%,答辩组为70%。
专业答辩组组长:
(签名)
201年 月 日
摘要
本网页是用DreamweaverFlash及Fireworks制作的一个带有理想性的您的王先生工作室网页。
本网页以建立一个多内容,多题材的个人网站为目的,此应用系统尽力达到界面直观,操作方便。
Dreamweaver是集网页制作和管理网站于一身的所见即所得网页编辑器,它是第一套针对专业网页设计师特别发展的视觉化网页开发工具,利用它可以轻而易举地制作出跨越平台限制和跨越浏览器限制的充满动感的网页。
因此本网站有效利用了Dreamweaver的直观性,使用方便,容易上手,更换方便的特点制作了一个使登录用户能方便,快捷浏览的页面,同时能让人们更加了解您的王先生工作室。
更关键的是这个网页体现了Dreamweaver的实际应用,Fireworks对其进行切片及采用Flash技术增加了页面的动态效果和页面的美观。
本网站还运用层和样式表单CSS结合来对页面元素进行布置。
所以这个网站将全面地说明一个网站的应用系统的结构。
更快捷地查找所需内容。
关键词:
您的王先生DreamweaverFlashFireworks网页艺术
第一章前言
第一节选题的背景
在Internet飞速发展的今天,互联网成为人们快速获取、发布和传递信息的重要渠道,它在人们政治、经济、生活等各个方面发挥着重要的作用。
Internet上发布信息主要是通过网站来实现的,获取信息也是要在Internet“海洋”中按照一定的检索方式将所需要的信息从网站上下载下来。
因此网站建设在Internet应用上的地位显而易见,它已成为政府、企事业单位信息化建设中的重要组成部分,从而倍受人们的重视。
为了更好网站,提高网站知名度,所以我们精心策划了本网站。
您的王先生工作室是根据09广告王鹏在校3年所发生真实事件组成,借由淘宝网拍拍网个人博客以及盛博广告网站种形式来组成您的王先生工作室。
第二节选题的意义
通过网站,全面宣传,展示自己个人的独特魅力重新认识自我在Internet上实现完成部分介绍及宣传您的王先生。
提高自己的各方面才能及介绍一些生活小知识。
第三节选题的主要内容
网站共由二十部分组成
一、您的王先生工作室简介:
介绍您的王先生工作室情况撒。
二、您的王先生工作室团队:
介绍团队成员发展情况哦。
三、您的王先生工作室加盟:
希望您也可以和我们共同努力哦。
四、您的王先生工作室联系:
介绍您的王先生的各种联系方式哦。
五、淘宝网店铺实物介绍:
了解淘宝网衣服的厂家撒。
六、淘宝网店信誉评价:
535的二钻信誉。
诚信商家之本!
七、淘宝网店装修技巧:
总结您的王先生在淘宝网摸索2年的一些简单的装修技巧。
八、淘宝网店店铺推广:
提高流量就相当于提高了成交率哦。
九、淘宝网店招商加盟:
告诉您怎样代理或加盟哦。
十、拍拍网店铺虚拟介绍:
做虚拟的优势哦。
十一、拍拍网新手付款帮助:
新手在拍拍网第一次应该怎样付款。
十二、拍拍网购物保证:
在拍拍网做虚拟1000元的诚信保证金哦。
十三、个人博客介绍:
介绍您的王先生。
十四、个人博客日志:
有您的王先生的日志。
十五、个人博客相册:
有您的王先生的生活照哦。
十六、个人博客说说:
提供一些您的王现身雷人雷语哦。
十七、盛博广告公司简介:
介绍盛博广告。
十八、盛博广告产品展示:
盛博广告的主要产品业务。
十九、盛博广告团队精英:
盛博广告现在的团队精英。
二十、请联系盛博广告:
如果您需要做联系哦。
第二章开发工具的选用及介绍
第一节工具的选择
1、AdobePhotoshop:
图像元老,最受欢迎的强大图像处理软件之一。
Photoshop是Adobe公司旗下最为出名的图像处理软件之一。
多数人对于PHOTOSHOP的了解仅限于“一个很好的图像编辑软件”,并不知道它的诸多应用方面,实际上,Photoshop的应用领域很广泛的,在图像、图形、文字、视频、出版等各方面都有涉及。
网络的普及是促使更多人需要掌握PHOTOSHOP的一个重要原因。
因为在制作网页时PHOTOSHOP是必不可少的网页图像处理软件。
二、AdobeFireworks
是Adobe推出的一款网页作图软件,软件可以加速Web设计与开发,是一款创建与优化Web图像和快速构建网站与Web界面原型的理想工具。
Fireworks不仅具备编辑矢量图形与位图图像的灵活性,还提供了一个预先构建资源的公用库,并可与AdobePhotoshop、AdobeIllustrator、AdobeDreamweaver和AdobeFlash软件省时集成。
在Fireworks中将设计迅速转变为模型,或利用来自Illustrator、Photoshop和Flash的其它资源。
然后直接置入Dreamweaver中轻松地进行开发与部署。
这里我们主要用Fireworks的切片功能以及优化图片的功能!
三、Dreamweaver
是制作主页的好工具.Dreamweaver是可视化的网页制作工具,很容易上手,可以让你轻松地制作出自己的网页。
Dreamweaver在多媒体方面颇有建树的Macromedia公司推出的可视化网页制作工具,它与Flash、Fireworks合在一起被称为网页制作三剑客,这三个软件相辅相承,是制作网页的最佳选择。
其中,Dreamweaver主要用来制作网页文件,制作出来的网页兼容性比较好,制作效率也很高,Flash用来制作精美的网页动画。
四、HTML语言
HypertextMarkupLanguage,中文也就是超文本链接标示语言。
HTML(HyperTextMark-upLanguage)即超文本标记语言,是WWW的描述语言。
设计HTML语言的目的是为了能把存放在一台电脑中的文本或图形与另一台电脑中的文本或图形方便地联系在一起,形成有机的整体,人们不用考虑具体信息是在当前电脑上还是在网络的其它电脑上。
我们只需使用鼠标在某一文档中点取一个图标,Internet就会马上转到与此图标相关的内容上去,而这些信息可能存放在网络的另一台电脑中。
HTML文本是由HTML命令组成的描述性文本,HTML命令可以说明文字、图形、动画、声音、表格、链接等。
HTML的结构包括头部(Head)、主体(Body)两大部分,其中头部描述浏览器所需的信息,而主体则包含所要说明的具体内容。
五、选择Dreamweave的原因
Dreamweaver是制作主页的好工具.Dreamweaver是可视化的网页制作工具,很容易上手,可以让你轻松地制作出自己的网页。
Dreamweaver在多媒体方面颇有建树的Macromedia公司推出的可视化网页制作工具,它与Flash、Fireworks合在一起被称为网页制作三剑客,这三个软件相辅相承,是制作网页的最佳选择。
其中,Dreamweaver主要用来制作网页文件,制作出来的网页兼容性比较好,制作效率也很高,Flash用来制作精美的网页动画,而Fireworks用来处理网页中的图形。
复杂的说:
Dreamweaver是美国MACROMEDIA公司开发的集网页制作和管理网站于一身的所见即所得网页编辑器,它是第一套针对专业网页设计师特别发展的视觉化网页开发工具,利用它可以轻而易举地制作出跨越平台限制和跨越浏览器限制的充满动感的网页。
DREAMWEAVER特点:
(1)最佳的制作效率
Dreamweaver可以用最快速的方式将Fireworks,FreeHand,或Photoshop等档案移至网页上。
使用检色吸管工具选择荧幕上的颜色可设定最接近的网页安全色。
对于选单,快捷键与格式控制,都只要一个简单步骤便可完成。
Dremweaver能与您喜爱的设计工具,如Playback,Flash,Shockwave和外挂模组等搭配,不需离开Dremweaver便可完成,整体运用流程自然顺畅。
除此之外,只要单击便可使Dreamweaver自动开启Firework或Photoshop来进行编辑与设定图档的最佳化。
(2)网站管理
使用网站地图可以快速制作网站雏形、设计、更新和重组网页。
改变网页位置或档案名称,Dreamweaver会自动更新所有连结。
使用支援文字、HTML码、HTML属性标签和一般语法的搜寻及置换功能使得复杂的网站更新变得迅速又简单。
(3)无可比拟的控制能力
Dreamweaver是唯一提供Roundtrip,HTML、视觉化编辑与原始码编辑同步的设计工具。
它包含HomeSite和BBEdit等主流文字编辑器。
帧(frames)和表格的制作速度快的令您无法想像。
进阶表格编辑功能使您简单的选择单格、行、栏或作未连续之选取。
甚至可以排序或格式化表格群组,Dreamweaver支援精准定位,利用可轻易转换成表格的图层以拖拉置放的方式进行版面配置。
所见即所得Dreamweaver成功整合动态式出版视觉编辑及电子商务功能,提供超强的支援能力给Third-party厂商,包含ASP,Apache,BroadVision,ColdFusion,iCAT,Tango与自行发展的应用软体。
当您正使用Dreamweaver在设计动态网页时,所见即所得的功能,让您不需要透过浏览器就能预览网页。
梦幻样版和XML。
Dreamweaver将内容与设计分开,应用于快速网页更新和团队合作网页编辑。
建立网页外观的样版,指定可编辑或不可编辑的部份,内容提供者可直接编辑以样式为主的内容却不会不小心改变既定之样式。
您也可以使用样版正确地输入或输出XML内容。
全方位的呈现利用Dreamweaver设计的网页,可以全方位的呈现在任何平台的热门浏览器上。
对于cascadingstyleheets的动态HTML支援和鼠标换图效果,声音和动画的DHTML效果资料库可在Netscape和Microsoft浏览器上执行。
使用不同浏览器检示功能,Dreamweaver可以告知您在不同浏览器上执行的成效如何。
当有新的浏览器上市时,只要从Dreamweaver的网站在下载它的描述档,便可得知详尽的成效报告。
第二节Dreamweave的简介
一、发展简史
(1)1997年首次推出Dreamweaver
(2)2000年推出DreamweaverUltraDev
运用其核心的RoundtripHTML技術,可确保在切换程式设计检时的程式码品质,Dreamweaver成专业网站外观设计的先驱。
Macromedia针对多种日益受到网页发展人员用的伺服器技术,而推出了DreamweaverUltraDev。
本产品除了提供Dreamweaver的功能外,还提供以ASP、JSP和ColdFusion建立网页应用程式的工具。
(3)2002年5月推出DreamweaverMX
目的是支援现代网页肩负的多重角色。
DreamweaverMX将UltraDev最佳的开发功能以及HomeSite的主要程式编辑功能整合为一个核心的Dreamweaver环境,为建立单一开发环境的第一步,以期让使用者能在此环境中,依其偏好的方式以手动来建立不同的网站和应用程式。
(4)2003年9月推出DreamweaverMX2004
新增了以CSS为基础的设计性开发提供支援的革命性功能,将网页设计提升到新的位置。
透过将CSS结合在所有使用者的工作流程中,促进了网页专业人员对CSS的普遍采用。
(5)推出Dreamweaver8.0
以之前版本为基础,扩充了主要范围的功能,例如XML和CSS,并简化了工作流程,以帮助使用者事半功倍。
由支援最新的专业设计方式,Dreamweaver8为使用者提供以开放标准基础的强大开发方式,增强了专业性的基本工具。
另外,Dreamweaver也支援所有主要的伺服器技术,包括ColdFusion、PHP、ASP、ASP.NET和JSP,让各种能力程度的开发人员,无论是新手或老手,都能实现其设计。
二、Dreamweave的优势
Dreamweaver是制作主页的好工具.Dreamweaver是可视化的网页制作工具,很容易上手,可以让你轻松地制作出自己的网页。
Dreamweaver在多媒体方面颇有建树的Macromedia公司推出的可视化网页制作工具,它与Flash、Fireworks合在一起被称为网页制作三剑客,这三个软件相辅相承,是制作网页的最佳选择。
其中,Dreamweaver主要用来制作网页文件,制作出来的网页兼容性比较好,制作效率也很高,Flash用来制作精美的网页动画,而Fireworks用来处理网页中的图形。
三、Div以及CSS样式表的使用
(1)Div以及CSS简介
DIV在编程中又叫做整除,即只得商的整数。
DIV元素是用来为HTML文档内大块(block-level)的内容提供结构和背景的元素。
DIV的起始标签和结束标签之间的所有内容都是用来构成这个块的,其中所包含元素的特性由DIV标签的属性来控制,或者是通过使用样式表格式化这个块来进行控制。
层叠样式表(CSS)是一系列格式设置规则,它们控制Web页面内容的外观。
使用CSS设置页面格式时,请将内容与表现形式分开。
页面内容(即HTML代码)驻留在HTML文件自身中,而用于定义代码表现形式的CSS规则驻留在另一个文件(外部样式表)或HTML文档的另一部分(通常为文件头部分)中。
使用CSS可以非常灵活并更好地控制具体的页面外观,从精确的布局定位到特定的字体和样式。
CSS允许控制HTML无法独自控制的许多属性。
除设置文本格式外,还可以使用CSS控制Web页面中块级别元素的格式和定位。
(2)CSS的主要优点:
它提供了便利的更新功能;更新一处的CSS规则时,使用该已定义样式的所有文档的格式都会自动更新为新样式。
外部CSS样式表是一系列存储在一个单独的外部CSS(.css)文件(并非HTML文件)中的CSS规则。
利用文档文件头部分中的链接,该文件被链接到Web站点中的一个或多个页面。
内部(或嵌入式)CSS样式表是一系列包含在HTML文档文件头部分的style标签内的CSS规则
代码详见附录!
第三章网站的形式美
第一节网页中的艺术
一、原则
网页作为传播信息的一种载体,同其他出版物如报纸、杂志等在设计上有许多共同之处,也要遵循一些设计的基本原则。
但是,由于表现形式、运行方式和社会功能的不同,网页设计又有其自身的特殊规律。
网页的艺术设计,是技术与艺术的结合,内容与形式的统一。
它要求设计者必须掌握以下三个主要原则:
(1)主题鲜明
视觉设计表达的是一定的意图和要求,有明确的主题,并按照视觉心理规律和形式将主题主动地传达给观赏者。
诉求的目的,是使主题在适当的环境里被人们即时地理解和接受,以满足人们的实用和需求,这就要求视觉设计不但要单纯、简练、清晰和精确,而且在强调艺术性的同时,更应该注重通过独特的风格和强烈的视觉冲击力,来鲜明地突出设计主题。
根据认知心理学的理论,大多数人在短期记忆中只能同时把握4到7条分立的信息,而对多于7条的分立信息或者不分立的信息容易产生记忆上的模糊或遗忘,概括起来就是:
较小而分立的信息要比较长而不分立的信息更为有效和容易浏览。
这个规律蕴含在人们寻找信息和使用信息的实践活动中,它要求视觉设计者的设计活动必须自觉地掌握和遵从。
作为视觉设计范畴一种的网页艺术设计,其最终目的是达到最佳的主题诉求效果。
这种效果的取得,一方面通过对网页主题思想运用逻辑规律进行条理性处理,使之符合浏览者获取信息的心理需求和逻辑方式,让浏览者快速地理解和吸收;另一方面通过对网页构成元素运用艺术的形式美法则进行条理性处理,更好地营造符合设计目的的视觉环境,突出主题,增强浏览者对网页的注意力,增进对网页内容的理解。
只有两个方面有机地统一,才能实现最佳的主题诉求效果。
优秀的网页设计必然服务于网站的主题,就是说,什么样的网站,应该有什么样的设计。
例如,设计类的个人站点与商业站点性质不同,目的也不同,所以评论的标准也不同。
网页艺术设计与网站主题的关系应该是这样:
首先,设计是为主题服务的;其次,设计是艺术和技术结合的产物,就是说,即要“美”,又要实现“功能”;最后,“美”和“功能”都是为了更好地表达主题。
当然,有些情况下,“功能”即是“主题”,还有些情况下,“美”即是主题。
例如,雅虎作为一个搜索引擎,首先要实现“搜索”的“功能”。
它的主题即是它的“功能”。
而一个个人网站,可以只体现作者的设计思想,或者仅仅以设计出“美”的网页为目的。
它的主题只有一个,就是——美。
只注重主题思想的条理性而忽视网页构成元素空间关系的形式美组合,或者只重视网页形式上的条理而淡化主题思想的逻辑,都将削弱网页主题的最佳诉求效果,难以吸引浏览者的注意力,出现平庸的网页设计或使网页设计以失败而告终。
要使网页从形式上获得良好的诱导力,鲜明地突出诉求主题,具体可以通过对网页的空间层次、主从关系、视觉秩序及彼此间的逻辑性的把握运用来达到。
(2)形式与内容统一
任何设计都有一定的内容和形式。
内容是构成设计的一切内在要素的总和,是设计存在的基础,被称为“设计的灵魂”;形式是构成内容诸要素的内部结构或内容的外部表现方式。
设计的内容就是指它的主题、形象、题材等要素的总和,形式就是它的结构、风格或设计语言等表现方式。
内容决定形式,形式反作用于内容。
一个优秀的设计必定是形式对内容的完美表现。
正如黑格尔所说:
“工艺的美就不在于要求实用品的外部造型、色彩、纹样去摹拟事物,再现现实,而在于使其外部形式传达和表现出一定的情绪、气氛、格调、风尚、趣味,使物质经由象征变成相似于精神生活的有关环境。
”(黑格尔《美学》第三卷)
一方面,网页设计所追求的形式美,必须适合主题的需要,这是网页设计的前提。
只讲花哨的表现形式以及过于强调“独特的设计风格”而脱离内容,或者只求内容而缺乏艺术的表现,网页设计都会变的空洞而无力。
设计者只有将二者有机地统一起来,深入领会主题的精髓,再融合自己的思想感情,找到一个完美的表现形式,才能体现出网页设计独具的分量和特有的价值。
另一方面,要确保网页上的每一个元素都有存在的必要性,不要为了炫耀而使用冗余的技术。
那样得到的效果可能会适得其反。
只有通过认真设计和充分的考虑来实现全面的功能并体现美感才能实现形式与内容的统一。
据有关资料所做的保守估计,目前在WWW上网页数据传输平均以每秒1.5k的速度到达客户端。
假设某个网页为了丰富其艺术性而追赶时髦地大量使用图像或其它多媒体元素等,虽然达到了其静态形式美的效果,却造成多达几十K甚至更大的网页数据,使浏览者必须等待很长时间才能看到“庐山真面目”,这样的网页就不是一个优秀的网页,因为它不符合网页传播信息的突出特性之一——快捷性,使网页内容不能很快地到达访问者,影响了访问效果和质量,损害了访问者的情趣和积极性,这种技术要素影响了传达信息的效果,因而不是形式与内容的完美统一。
网页具有多屏、分页、嵌套等特性,设计者可以对其进行形式上的适当变化以达到多变性处理效果,丰富整个网页的形式美。
这就要求设计者在注意单个页面形式与内容统一的同时,更不能忽视同一主题下多个分页面组成的整体网页的形式与整体内容的统一。
因此,在网页设计中必须注意形式与内容的高度统一。
(3)强调整体
网页的整体性包括内容和形式上的整体性,这里主要讨论设计形式上的整体性。
网页是传播信息的载体,它要表达的是一定的内容、主题和意念,在适当的时间和空间环境里为人们所理解和接受,它以满足人们的实用和需求为目标。
设计时强调其整体性,可以使浏览者更快捷、更准确、更全面地认识它、掌握它,并给人一种内部有机联系、外部和谐完整的美感。
整体性也是体现一个站点独特风格的重要手段之一。
在网站建设中网页的结构形式是由各种视听要素组成的。
在设计网页时,强调页面各组成部分的共性因素或者使诸部分共同含有某种形式特征,是求得整体的常用方法。
这主要从版式、色彩、风格等方面入手。
例如:
在版式上,将页面中各视觉要素作通盘考虑,以周密的组织和精确的定位来获得页面的秩序感,即使运用“散”的结构,也是经过深思熟虑之后的决定;一个站点通常只使用两到三种标准色,并注意色彩搭配的和谐;对于分屏的长页面,不可设计完第一屏再考虑下一屏。
同样,整个网页内部的页面,都应统一规划,统一风格,让浏览者体会到设计者完整的设计思想。
从某种意义上讲,强调网页结构形式的视觉整体性必然会牺牲灵活的多变性,“物极必反”就是这个道理。
因此,在强调网页整体性设计的同时必须注意:
过于强调整体性可能会使网页呆板、沉闷,以致影响访问者的情趣和继续浏览的欲望。
“整体”是“多变”基础上的整体。
二、特点
(1)交互性与持续性
网页不同于传统媒体之处,就在于信息的动态更新和即时交互性。
即时的交互性是Web成为热点的主要原因,也是网页设计时必须考虑的问题。
传统媒体(如广播、电视节目、报刊杂志等)都以线性方式提供信息,即按照信息提供者的感觉、体验和事先确定的格式来传播。
而在Web环境下,人们不再是一个传统媒体方式的被动接受者,而是以一个主动参与者的身份加入到信息的加工处理和发布之中。
这种持续的交互,使网页艺术设计不像印刷品设计那样,发表之后就意味着设计的结束。
网页设计人员必须根据网站各个阶段的经营目标,配合网站不同时期的经营策略,以及用户的反馈信息,经常地对网页进行调整和修改。
例如,为了保持浏览者对网站的新鲜感,很多大型网站总是定期或不定期的进行改版,这就需要设计者在保持网站视觉形象一贯性的基础上,不断创作出新的网页设计作品。
(2)多维性
多维性源于超级链接,主要体现在网页设计中对导航的设计上。
由于超级链接的出现,网页的组织结构更加丰富,浏览者可以在各种主题之间自由跳转,从而打破了以前人们接收信息的线性方式。
例如,可将页面的组织结构分为序列结构、层次结构、网状结构、复合结构等。
但页面之间的关系过于复杂,不仅使浏览者检索和查找信息增加了难度,也给设计者带来了更大的困难。
为了让浏览者在网页上迅速找到所需的信息,设计者必须考虑快捷而完善的导航设计。
印刷品中导航问题不是那么突出,如果一个句子在页尾突然终止,读者会很自然地翻到下一页查找剩余部分,为了帮助读者找到他们要找的信息,出版者提供了目录、索引或脚注。
如果文章从期刊中的一页