photoshop第一讲了解软件

网页制作流程
构成网页的基本要素 制作及美化的基本工具 网页制作的基本步骤 界面设计及交互研究探讨
网页制作流程
构成网页的基本要素
1、文字（标题、字号、字型...） 2、图形（网页上经常使用的图片格式：jpg、jpeg、
Gif、Swf...）
3、交互功能（菜单按钮、链接、表单、数据交换...）
Photoshop的应用范围
平面设计
包装设计、VI设计、商店广告牌、书的封面设计、服装设计（衣服 的花纹）、广告设计、插画创作和照片处理（艺术照、婚纱照）。
网页设计
个人网站、企业网站、门户网站等
视频编辑
游戏、动画中的人物、场景，制作文字效果和其它软件合成， 照片影集（视频）。
建筑效果
室内室外效果图后期处理。
2．背景和前文的对比尽量要大(绝对不要用 花纹繁复的图案作背景)，以便突出主要文字 内容。
回顾
理解颜色三要素和常用的色彩模式 掌握PS软件的应用范围 掌握网页制作流程
第一讲
了解Photoshop软件
－薛丽娅
本讲要点
了解Photoshop的应用范围 色彩理论基础 色彩模式 了解网页制作流程 网站配色技巧
了解Photoshop软件
1、调查对PS使用情况？ 2、PS软件是一个样的软件？ PS软件是平面图像合成软件。 合成是在已有素材基础上进行艺术再加工。
网页制作流程
2、资料收集
收集内容：
a、跟主题相关的文字图片资料 b、一些优秀的页面风格 c、下载一些你喜欢的交互页面 d、开放的源代码
网页制作流程
3、界面设计
根据事先规划的结构，在平面软件里设计你 想要的最终效果，利用平面图片的形式先展示一 次，设计时要注意宜人性、人机、心理等各方面 因素。
网页制作流程
色彩理论基础
颜色三要素：
色相是指色彩的相貌。
H
饱和度是指色彩的强度或纯度。 S
明度是指色彩的明暗程度。 B
色彩理论基础
色彩分类：有彩色、无彩色
色彩模式
对生活的洞察力？ 台标 光色三原色：RGB（红绿蓝）数值范围0~255 颜色三原色：RYB
发光物体： 最大颜色值：
色彩模式
印刷三原色：CMYK（青、洋红、黄、黑） 数值范围0~100%
网页制作流程
界面设计及交互研究探讨
3、交互研究
研究用户浏览网站心理个人认为一个成功的个 人主页，单纯的美观是不够的，重要的是宜人性方 面应该注重，如Google。
网站设计要点：
确定网站的整体风格 网页色彩的搭配
网站配色技巧
网站配色技巧
在网页配色中，还要切记一些误区：
1．不要将所有颜色都用到，尽量控制在三 至五种色彩以内。
网页制作流程
界面设计及交互研究探讨
1、导航栏设计
导航要素设计的好坏决定着用户是否能方便使 用网站导航，要素要设计的直接而明确，并最大限 度为用户的方便考虑。
网页制作流程
界面设计及交互研究探讨
2、网页布局
网页的布局是整个界面的核心，这里体现了一 切以用户为中心、以及制作者如何与欣赏着沟通的 思想在里面，你必须知道自己要传达什么样的信息， 别人使用起来合适不，字体的大小、型号、字间距、 行间距，以及配色所有的一切都在这个阶段完成， 所以如何表现功能以及美感就是你研究的重点。
了解Photoshop软件
图像处理是PhotoShop最为强大的功能，要掌 握与使用一个图像处理软件，不仅要掌握软件的操 作，还要掌握图像与图形方面的知识，如图像类型、 图像格式、图像分辨率、图像颜色模式以及一些色 彩原理知识等。尤其是对于Photoshop这类专业的 图像处理软件，只有掌握这些概念，才能创作出高 品质、高水平的作品。
4、代码转换及交互添加
把平面的界面转化为HTML代码，添加相应的 交互功能Js、按纽、表单，以及一些与数据库相 连接的代码。
网页制作流程
5、测试网页兼容性
你可以不必严格按照W3C标准来制作页面，但 是你必须保证让所有现有的浏览器能比较好的展 示你的作品。
网Hale Waihona Puke Baidu制作流程
6、发布站点
测试完毕，符合要求后，就可以开始发布你 的网站，发布的服务器可以是远程，也可以是本 地，各个语言有各自的相应的服务器，比如ASP， 就应该对应的是ASP服务器，上传可利用远程FTP 工具。
网页制作流程
界面设计及交互研究探讨
PS:布局之前要紧密连接你网站的主题， 要注意把握整体风格，可事先在纸上勾画草图， 利用你习惯的元素来表现你想要的效果。
网页制作流程
界面设计及交互研究探讨
网页布局--主要构成原则
醒目性：指用户把注意力集中到你诱导起浏览的部 分和内容 可读性：指网站的内容让人容易读懂 明快性：指准确、快速转达网站的构成内容 造型性：维持整体外型上的稳定感和均衡性 创造性：有鲜明个性，创意是必不可少的 布局的构成原则上是:统一、协调、流动、强调、 均衡
网页制作流程
制作及美化的基本工具
1、页面设计及美化工具：
Photoshop、FireWorks、Flash
2、超文本标识语言（HTML）编辑工具：
Dreamweaver、记事本、FrontPage
网页制作流程
网页制作的基本步骤
1、整体规划
需要完成的规划：网站主题、风格、页面元素、 逻辑结构等