模块三网页美工技术 单元3：美工基础·常用工具介绍 一、网页美工常用工具总览 Fw 图形制作 图像处理 项目管理 Illustrator Photoshop Fireworks 图0303-1 ·川u©！是一种应用于出版、多螺体和在线图像的工业标准失量插画的软件 Firework网真作图软件，可加速W的设计开发，是一款创建与优化W由图像 和快速构建网站与W中界面原型理想工具 ·Photoshop:主要处理以像素所构成的数字图像. 三个软件的工作界面和操作方法比较类似。我们米分别介绍。 二、llustrator Adobe Illustrator作为全球最著名的矢量图形软件，以其强大的功能Adobe I川lustrator 界面和体贴用户的界而，已经占据了全球矢量编辑软件中的大部分份额。据不完全统计全 球有7%的设计师在使用Adobe Illustrator进行艺术授计。尤其基于Adobe公司专利的 PostScrip技术的运用，川ug己经完全占额专业的印刚出版领域。无论是线稿的设计者 和专业插面家，生产多螺体图像的艺术家，还是互联网页或在线内容的制作者，使用过 ur碱or后军会发现，其强大的功能和荷洁的界面设计风格只有Frechand能相比，目前 Adobe Illustraton己发展到CS6版木。图0303-2为llustrator工作界面
模块三 网页美工技术 单元 3： 美工基础·常用工具介绍 一、网页美工常用工具总览 图 0303-1 • Illustrator：是一种应用于出版、多媒体和在线图像的工业标准矢量插画的软件 • Fireworks：网页作图软件，可加速 Web 设计开发， 是一款创建与优化 Web 图像 和快速构建网站与 Web 界面原型理想工具 • Photoshop：主要处理以像素所构成的数字图像。 三个软件的工作界面和操作方法比较类似，我们来分别介绍。 二、Illustrator Adobe Illustrator 作为全球最著名的矢量图形软件，以其强大的功能 Adobe Illustrator 界面和体贴用户的界面，已经占据了全球矢量编辑 软件中的大部分份额。据不完全统计全 球有 37%的设计师在使用 Adobe Illustrator 进行艺术设计。尤其基于 Adobe 公司专利的 PostScript 技术的运用，Illustrator 已经完全占领专业的印刷出版领域。无论是线稿的设计者 和专业插画家、生产多媒体图像的艺术家、还是互联网页或在线内容的制作者，使用过 Illustrator 后都会发现，其强大的功能和简洁的界面设计风格只有 Freehand 能相比。目前 Adobe Illustraton 己发展到 CS6 版本。图 0303-2 为 Illustrator 工作界面
地# .7 等法目 作8 图0303-2 Irn中设计的网真造型元素可以通过复制粘贴的形式，轻松的放到Pcos小cp中 进行再处理。 操作滴示：利用山usar制作网页背景墙，并将其复制粘贴到Phocoshop中。 三、Fireworks Adobe Fireworks是Adobe推出的一款网页作图软件，软件可以加速Web设计与开发， 是一款创建与优化Wb图像和快速构建网站与Wb界面原型的理想工具.Frew心ks不 仅具备编辑矢量图形与位图图像的灵活性，还提侯了一个预先构建资源的公用库，并可与 Adobe Photoshop,Adobe Illustrator,Adobe Dreamweaver和Adobe Fla小款件首时集成。在 Fireworks中将设计迅速转变为模型，或利月米自llustrator、Photoshop和Flash的其它货 源.然后直接置入Dreamweaver中轻松地进行开发与部著。图0303-3为Fireworks工作界 面
图 0303-2 Illustraton 中设计的网页造型元素可以通过复制粘贴的形式，轻松的放到 Photoshop 中 进行再处理。 操作演示：利用 Illustrator 制作网页背景墙，并将其复制粘贴到 Photoshop 中。 三、Fireworks Adobe Fireworks 是 Adobe 推出的一款网页作图软件，软件可以加速 Web 设计与开发， 是一款创建与优化 Web 图像和快速构建网站与 Web 界面原型的理想工具。Fireworks 不 仅具备编辑矢量图形与位图图像的灵活性， 还提供了一个预先构建资源的公用库， 并可与 Adobe Photoshop、Adobe Illustrator、Adobe Dreamweaver 和 Adobe Flash 软件省时集成。 在 Fireworks 中将设计迅速转变为模型， 或利用来自 Illustrator、Photoshop 和 Flash 的其它资 源。 然后直接置入 Dreamweaver 中轻松地进行开发与部署。图 0303-3 为 Fireworks 工作界 面
FW ■Qm中 展开模式·为 -x 文件E场曰裂店00选)0文车①南。老满四日口解助 0日口分编个A6自66哈路g品：的 米●名1标0gx 师 /回果四：第的至 天说野安配票并不 (快使)票单栏目 且：的￥ ◆工具箱 选择性显质回☑ 平金年时 板区 0.虽 蜂厚伟重 色 室自处为工感 证 不进明度面 可■年一风顶魔 ■7是： 段 0四 文档 ■大■大乙 来鱼名~1 状市1 uu取3 种出教数韩本 号府多氧南白续 大热 图0303-3 下iw©ks的页、状老和图层面板使其具有强大的暖目管理功能，一个料站中可以有若 干个页面，一个页面中可以有若干个状态，每一个状态中可以有若千个图层。如图05034 所示。 面秋热 1状志1 7 0 时状吉 0 候页面1量 #山菜本1 位2克重 三也表大 州 图0303-4 操作滴示，利用案例滴示Fireworks的项目管理功能。 四、Photoshop
图 0303-3 Fireworks 的页、状态和图层面板使其具有强大的项目管理功能。一个网站中可以有若 干个页面，一个页面中可以有若干个状态， 每一个状态中可以有若干个图层。如图 0303-4 所示。 图 0303-4 操作演示：利用案例演示 Fireworks 的项目管理功能。 四、Photoshop
Adobe Photoshop,简称Ps”,是一个由Adobe Systems开发和发行的图像处理软件， 件0©p主要处理以像素所构成的数字图像。使用其众多的编修与绘图工具，可以更有效 的进行图片编辑工作，20O3年，Adobe将Adobe Phocoshop8更名为Adobe Photoshop CS. 因此，最新版本Adabe Photoshop CS6是Adobe Photoshop中的第13个主要版本.工作界面 如图0303-5所示， 色 满对中C计。 .a 日●口 t.T. 工作区 图0303-5 菜单栏，菜单栏为整个环境下所有窗口提供菜单控制。包括：文件、编辑、图像、图层， 选择、滤镜、视图、窗口和帮助等。可通过两种方式执行所有命令，一是菜单，二是快徒键。 工具箱，工具箱中的工具可用米选择、绘香，编辑以及查看图像，指动工具箱的标思 栏，可移动工具箱。单击可遗中工具，属性栏会最示该工具的属性，有些工具的右下角有一 个小三角形符号，这表示在工具位置上存在一个工具组，其中包括若干个相关工具。 控制面板：共有14个面板，可通过“官口显示”来显示面板。按Tb键。白动隐藏命令 面板，属性栏和工具箱，再次按键。显示以上组件。按Sn+Tb,局藏控制面版，保留工 具箱
Adobe Photoshop，简称“PS”，是一个由 Adobe Systems 开发和发行的图像处理软件。 Photoshop 主要处理以像素所构成的数字图像。使用其众多的编修与绘图工具，可以更有效 的进行图片编辑工作。2003 年，Adobe 将 Adobe Photoshop 8 更名为 Adobe Photoshop CS。 因此，最新版本 Adobe Photoshop CS6 是 Adobe Photoshop 中的第 13 个主要版本。工作界面 如图 0303-5 所示。 图 0303-5 菜单栏：菜单栏为整个环境下所有窗口提供菜单控制，包括:文件、编辑、图像、图层、 选择、滤镜、视图、窗口和帮助等。可通过两种方式执行所有命令，一是菜单，二是快捷键。 工具箱：工具箱中的工具可用来选择、绘画、编辑以及查看图像。拖动工具箱的标题 栏，可移动工具箱。单击可选中工具，属性栏会显示该工具的属性。有些工具的右下角有一 个小三角形符号，这表示在工具位置上存在一个工具组，其中包括若干个相关工具。 控制面板：共有 14 个面板，可通过“窗口/显示”来显示面板。按 Tab 键，自动隐藏命令 面板，属性栏和工具箱，再次按键，显示以上组件。按 Shift+Tab，隐藏控制面板，保留工 具箱
工作区：中间窗口是图像窗口，它是hco小op的主要工作区。用于显示图像文作，图 像窗口带有自己的标题栏，提供了打开文件的基本信息，如文件名、缩放比例，颜色模式等。 如同时打开两刷图像，可通过单击图像窗口进行切换。图像窗口切换可使用C+Th。 状老栏，主窗口底忽是状态栏。由三部分组成()最右边的是文本行2)左边是缩改栏) 操作滴示：案例演示Photoshop基本使用方法. 【课后小结】 本将主要介绍了各工具款件的功能特点。通过操作演示，介绍了各工具软件的工作界 面和基本使用方法。通过案例演示了三软件间的无醋结合
工作区：中间窗口是图像窗口，它是 Photoshop 的主要工作区，用于显示图像文件。图 像窗口带有自己的标题栏，提供了打开文件的基本信息，如文件名、缩放比例、颜色模式等。 如同时打开两副图像，可通过单击图像窗口进行切换。 图像窗口切换可使用 Ctrl+Tab。 状态栏：主窗口底部是状态栏，由三部分组成:(1)最右边的是文本行(2)左边是缩放栏(3) 操作演示：案例演示 Photoshop 基本使用方法。 【课后小结】 本将主要介绍了各工具软件的功能特点。通过操作演示，介绍了各工具软件的工作界 面和基本使用方法。通过案例演示了三软件间的无缝结合