课程设计报告

课程名称 运用软件实践

怎么下载建筑设计讲授集 知识问答

设计题目 用PS设计网站首页的效果图

专业、班级

学 号

姓 名

辅导西席

设计韶光 .9.2—— .9.27

年 9 月 27 日

弁言设计目的和意义提升对常见的运用软件操作技能;对常见运用软件有进一步认识和理解;培养提高综合利用运用软件办理实际问题的能力;进一步提升对Adobe Photoshop软件的操作水平; 闇练对Adobe Photoshop各种菜单、命令工具的操作,进一步节制图层、蒙版、通道、路径的运用以及各种分外效果的合成技巧。
设计内容问题描述:用PS设计网站首页的效果图——教诲类,比如为我校门户网站首页来设计效果图。
把稳色彩搭配和布局分配,用PS设计好原图后,并用PS自带的裁切工具将图片裁切成HTML文档格式;实现提示:要对Photoshop软件的熟习运用,对各种菜单、命令工具熟习,节制图层、蒙版、通道、路径的运用以及各种分外效果的合成技巧;基本哀求:用PS完备设计制作界面,哀求包含网站Logo设计、网站广告设计制作、网站导航设计制作、网站页面设计。
紧张任务全面理解Photoshop设计网页的全过程,节制基本的网页设计的方法;节制网页设计的布局、色彩搭配的知识;节制各种图形、图像的绘制、处理的方法;设计主题思想突出,布局合理,原创作品。
正文Adobe Photoshop软件概述

Adobe Photoshop,以其功能强大、集成度高、适用面广和操作大略而著称,紧张运用于平面设计、广告拍照、建筑装潢、网页制作、动画制作等领域它不仅供应强大的绘图工具,可以绘制艺术图形,还能从扫描仪、数码相机等设备采集图像,对他们进行修正、修复,调度图像的色彩、亮度,改变图像的大小,还可以对多幅图像进行合并增加分外效果。

Photoshop被称为“思想的摄影机”,是目前最盛行的图像设计和制作工具,它不仅能够真实地反应现实天下,而且能够创造出虚幻的景物。
Photoshop最拿手的特色便是可以创建成百上千种殊效笔墨,可以根据自己的思维能力创建几十种笔墨效果,Photoshop是可以与艺术家的创作灵感相匹配的最精良的创尴尬刁难象。
Photoshop具有超强的图像处理功能,它可以使平面的物体产生透视效果,能让静止的汽车产生飞驰的动感,能让水平的平面涌现荡漾,它无所不能的选择工具、图层工具、滤镜工具能利用户得到各种手工处理或其他软件无法得到的美妙图像效果。

Adobe Photoshop紧张功能图像格式:Photoshop支持多种高质量的图像格式,包括PSD、TIF、JPG、BMP、EPS、PCX、FLM、PDF、RAW和SCT等多种;图像尺寸和分辨率:可以按哀求任意调度图像的尺寸,在不影响分辨率的情形下改变图像尺寸。
还可以在不影响尺寸的同时增减分辨率,以适应图像的哀求,其剪裁功能可以方便地选择图像某部分内容;图层功能:支持多图层事情办法,可以对图层进行合并、合成、翻转、复制和移动等操作,绝技效果可以用在部分或者全部的图层上面。
调度图层可以在不影响图像的同时,掌握图像中像素的色相、渐变和透明度等属性。
其拖拽功能可以轻易地把图像中的层从一个图像复制到另一个图像中;选取功能:矩形选取工具和椭圆选取工具可以选择一个或多个不同大小或形状的范围。
套索工具可以选取不规则形状的图形,利用磁性套索工具还可以仿照选择边缘像素的反差,自动定位选择区域,使范围选取变得大略易行。
魔棒工具可以根据颜色范围自动选取所需部分;色调和色彩功能:可以有选择地调度色相、饱和度和明暗度,根据输入的相对值和绝对值,选择改动功能可以利用户分别调度每个色板或色层的油墨量,取代颜色功能可以帮助选取某一种颜色,然后改变其色调、饱和度和明暗度,可以分别调度暗部色调、中间色调和亮部色调;图像的旋转和变形:可以将图像按固定方向翻转和旋转,也可以按不同角度进行旋转,还可以将图像进行拉伸、倾斜和自由变形等处理。
设计概述

鉴于我校今年成功转设,学校门户网站首页须要重新设计,结合我校原有网站布局,参考国内外有名高档院校门户网站设计风格,领悟当下数字平面设计盛行趋势——扁平风格化,基于以上构思,按照《运用软件课程设计哀求》的辅导,我设计出了学校门户网站首页效果图。

依据当下图形展示窗口主流趋势(宽屏16∶9),网站首页分辨率采取1024×576,以高清校园风景图片作为网站背景代替以往的展示窗展示,首页各个版块半透明悬浮在首页高下及两侧,空出中间部分清晰展示校园风景。

软件版本:

设计流程素材准备:从http://www.yit.edu.cn/截图获取欧阳中石师长西席题写的校名,利用背景橡皮擦抠取书法字,备用;

新建宽1000像素、高400像素、透明背景画布,用矩形工具绘制logo,备用;

从网上获取新浪微博、大家网、微信图标,新建宽500像素、高100像素、透明背景画布,利用背景橡皮擦结合抽取工具抠取图标,拖放图标的得当的位置,备用;

新建宽1024像素、高576像素、透明背景画布,定义为主画布约束网页尺寸。

背景设计从http://www.yit.edu.cn/选取下载校园风景图片一张,添加到主画布;

拖动选取适当的位置为背景,进入快速蒙版模式虚化减淡顶部70像素高图像。

设置图层组:新建三个组分别存放顶部、主体、底部图层信息。

顶部设计用矩形工具添加高72像素的背景图层,添补颜色#A61C4B、不透明度80%、基本投影稠浊图形效果;

将准备好的logo和书法校名素材添加到top图层组,图层分别命名为logo和校名。
调度大小,拖放到得当的位置。
添加内阴影、外发光稠浊图形效果;

添加站内搜索框及动作按钮,用矩形工具绘制模拟,添加自由路径限定按钮笔墨范围,搜索框添补颜色#FFFFFF、基本投影稠浊图形效果,按钮添补颜色#A61C4B、基本投影稠浊图形效果,按钮笔墨属性:微软雅黑、13点、平滑、字符间距140。

底部设计用矩形工具添加高80像素的背景图层,添补颜色#000000、不透明度80%;

利用笔墨工具分两行添加网页底部快速链接和联系办法,笔墨属性:微软雅黑、13点、平滑;

将准备好的社交图标以组复制的形式复制到主画布,添加到bottom图层组,调度大小,拖放到得当的位置,利用笔墨工具添加 “联系我们”,笔墨属性:微软雅黑、16点、平滑、字符间距300。

主体设计body图层组下依据布局板块新建四个图层组;

参考学校原有门户网站首页板块设置,依据本次课程设计理念布局板块(如下图),左侧自上而下分别为导航栏、交情连接栏,右侧大板块自上而下分别是学院新闻、校园动态两个新闻展示板块,四个板块利用矩形工具绘制,添补颜色#000000、基本投影稠浊图形效果,左侧两个板块不透明度80%、右侧两个板块不透明度65%;

导航栏添加自由路径约束笔墨显示范围,按照设计思路利用笔墨工具在路径范围内添加导航栏干系信息笔墨属性:微软雅黑、一级导航14点、二级导航12点,调度笔墨位置到得当位置;

交情链接板块,添加下拉列表,利用矩形工具绘制模拟,添加自由路径约束下拉列表默认选择笔墨范围,下拉列表添补颜色#FFFFFF,下拉列表默认选择笔墨属性:微软雅黑、14点、平滑,利用笔墨工具添加“交情链接”,笔墨属性:微软雅黑、字符间距300;

学院新闻版块利用矩形工具模拟板块标签,添补颜色#FFFFFF、不透明度80%、置于板块背景下方,添加自由路径约束标签笔墨显示范围,标签笔墨属性:微软雅黑、14点、字符间距200;

同学院新闻板块,设置校园动态板块。

整体视图,调度各版块、各图层布局,依据参考线对其旁边两侧板块位置;

利用切片工具划分切片,划分依据各版块、各切边图像繁芜程度、载入速率划分;

存储为web所用格式,为担保浏览器显示效果,储存格式为JPEG,最佳品质;

浏览器显示效果

结论

通过这次运用软件课程设计,不仅仅是对三年来打算机科学与技能专业本科阶段学习后的一次运用和实践,也是对自己独立利用运用软件办理实际问题的一次考验。
我更进一步地认识到闇练利用常见的运用软件,能很好的应对信息化时期所碰着的问题。
通过这次课程设计的制作,使我体会到闇练节制常见运用软件的利用操作,是对自身发展有利的一把利刃,在当今激烈地竞争环境当中可以显著表示出自身的核心竞争力。

针对本次课程设计所选题目——用PS设计网站首页的效果图(教诲类),在之前自己对Photoshop软件的学习和利用的履历根本上,进一步学习的过程中既又有收成,又创造不敷之处。
学习任何技能只有理论是弗成的,最主要的是要多实践,看十本书还不如亲自实践一次,做不好也不要气馁,由于从失落败中得到了宝贵的履历,有了履历就会连续考试测验做下去,试图节制里面的每一个功能、熟习每一个操作。

在这次课程设计制作过程中,我得到了老师的许多辅导,老师细心的讲解,负责的辅导我修正作品,给我提了很多宝贵的见地和建议,让我们的专业知识在利用中得到了丰富和提高,在此向他们表示感谢。

四、参考文献

[1] 张怒涛.Photoshop 7.0平面设计图像处理技法[M].北京:清华大学出版社,2003.

[2] 杨桦,孙利娟.网页设计与制作实用教程(Dreamweaver+Flash+Photoshop)[M].北京:清华大学出版社,2011.

[3] http://www.68ps.com/

辅导西席评语

署名:

年 月 日

课程设计成绩(五级分制)