课程设计报告
课程名称 应用软件实践
设计题目 用PS设计网站首页的效果图
专业、班级
学 号
姓 名
指导教师
设计时间 .9.2—— .9.27
年 9 月 27 日
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，最佳品质；浏览器显示效果结论通过这次应用软件课程设计，不仅仅是对三年来计算机科学与技术专业本科阶段学习后的一次应用和实践，也是对自己独立运用应用软件解决实际问题的一次检验。我更进一步地认识到熟练使用常见的应用软件，能很好的应对信息化时代所遇到的问题。通过这次课程设计的制作，使我体会到熟练掌握常见应用软件的使用操作，是对自身发展有利的一把利刃，在当今激烈地竞争环境当中可以显著体现出自身的核心竞争力。
针对本次课程设计所选题目——用ＰＳ设计网站首页的效果图（教育类），在之前自己对Photoshop软件的学习和使用的经验基础上，进一步学习的过程中既又有收获，又发现不足之处。学习任何技术只有理论是不行的，最重要的是要多实践，看十本书还不如亲自实践一次，做不好也不要气馁，因为从失败中得到了宝贵的经验，有了经验就会继续尝试做下去，试图掌握里面的每一个功能、熟悉每一个操作。
在这次课程设计制作过程中，我得到了老师的许多指导，老师细心的讲解，认真的指导我修改作品，给我提了很多宝贵的意见和建议，让我们的专业知识在运用中得到了丰富和提高，在此向他们表示感谢。
四、参考文献
[1] 张怒涛．Photoshop 7.0平面设计图像处理技法[M]．北京：清华大学出版社，2003.
[2] 杨桦，孙利娟．网页设计与制作实用教程（Dreamweaver+Flash+Photoshop）[M]．北京：清华大学出版社，2011.
[3] http://www.68ps.com/
指导教师评语签名：
年 月 日
课程设计成绩（五级分制）
