课堂笔记week0104全解Word格式.docx
《课堂笔记week0104全解Word格式.docx》由会员分享,可在线阅读,更多相关《课堂笔记week0104全解Word格式.docx(27页珍藏版)》请在冰豆网上搜索。
2主视觉区--------banner
公司品牌宣传、活动、新品海报宣传等轮播大图
3主要内容区----------main
新闻中心、主要产品推荐、公司介绍、服务项目等
4底部信息------------footer
网站地图公司联系方式、地址版权信息ICP备案号等
字符面板
1文字的创建
点文本:
导航文字标题字一行文字
段落文本:
大段文字正文内容
2退出文本编辑状态ctrl+回车或者小键盘回车
3字间距(间距为0)
大段文字正文内容标题字
Alt+左右方向键
4字行距(段落文本:
字号1.5到2倍)
Alt+上下方向键
段落面板
1避头尾法则:
严格(避免标点符号在首位出现)
2最后一行左对齐(强制两端对齐)
3段后空格(字号1.5到2倍)
4首行缩进(字号的两倍)
PC平台网页设计规范
1分辨率:
72像素/英寸
2颜色模式:
RGB8位
3网页背景
A纯色平铺(自适应浏览器)
B渐变色或底纹平铺(自适应浏览器)
C通栏大图片宽度1920px
4屏幕分辨率
A标准分辨率1024px/768px主体设计内容的宽度:
1000px(960px980px990px1000px)首屏高约700像素
B常用分辨率1280px/800px主体设计内容的宽度:
1200px(1100px1190px1200px)首屏高约750像素
5设计文档大小
A新建文档宽度大于主体设计内容的宽度(目的为了表现设计意图展现背景效果)建议左右各宽出200像素
B设计到通栏大图片,新建文档宽度1920px
渐变工具(选项栏属性)
1反向:
转换渐变颜色顺序得到反方向渐变
2勾选仿色渐变过渡更平滑
3勾选透明区域支持渐变编辑器里的透明效果
图层样式
1添加方法:
在图层空白处双击添加
2复制:
按alt拖动fx图标
3删除:
在图层上右键清除图层样式
4图层样式会遮挡剪切蒙版
取消将剪切图层混合成组-------勾选将内部效果混合成组
常用属性
1渐变:
可以拖动渐变效果
勾选与图层对齐渐变范围为图层内容大小
不勾选渐变范围为画布大小
2描边:
针对有直角形状为了避免产生虚边,选择内部描边
描边类型:
颜色渐变图案
3投影:
a角度:
控制光源
勾选全局光可保持所有光照方向一致
不勾选可为不同的图层分别设置光照角度
B距离:
投影偏移图层内容的距离
C大小:
投影模糊范围数值越大模糊范围越大
D扩展:
投影扩展范围,受大小的影响
图案的定义和填充
1定义(编辑---定义图案)
找到适合重复的图案,用选区选中图案定义,一般透明底色
2填充---shift+F5选择到图案
网页中字体使用规范
1字体分类
A图形化文字:
banner用字logo
B系统字/像素字:
字体样式设置:
“无”
内容文字新闻导航字标题字等方便更新文字内容
2web安全字
中文(宋体微软雅黑(锐利)黑体)
西文(ArialTimes)
3字号
中文(12px--18px)
正文内容:
12px14px
主导航/栏目标题:
14px16px18px
底部辅助信息文字:
12px
西文(10px----16px)
10px---12px
12px---16px
4中英文混排:
先设置中文再设置英文
智能对象图层
1缩小后再放大不影响图片清晰度
2可以记录滤镜、变形参数方便修改
图层调整层
点击调整层图标
2优点:
A调色参数保留方便随时修改
B针对下方所有可见图层统一调色
C不破坏原图层色彩信息
Banner设计
1提炼文案突出重点文字
2根据文案选择适合的图片注意:
色调统一和谐突出主体
3选择符合画面气质的字体
4确定排版方式:
居左、中、右
5整体细节调整
全屏展示类网站
1应用领域:
汽车、地产、美妆、影视、个人等
2文档尺寸:
宽度:
1920px高度:
1000px主体设计内容宽度:
1200px
3设计特点
一屏显示以图为主画面视觉冲击力布局灵活
4设计必要元素
Loading音乐开关全屏按钮
画笔工具
1画笔面板F5
A画笔预设(选择适合画笔)
B间距大小控制线或点
形状动态------大小抖动随机产生不同大小点
散布------随机分散大小点勾选双轴
传递------不透明度抖动随机产生不透明效果
调整边缘(针对选区边缘调整)
1视图:
选择背景图层(透明底色)
2半径------选区宽度
羽化---选区虚化值
对比度----锐化选区边缘
3用调整半径工具涂抹发丝可去掉背景
4输出带有图层蒙版的图层
画笔描边
1新建图层
2调试画笔
3用钢笔勾选适合路径
4工作路径右键选择描边路径------选择画笔-------勾选模拟压力-----选择有钢笔压力的画笔
线框图
1内容大纲(有什么)
2信息架构(在哪里)
3层级关系(内容主次)
4一般单色(黑白灰)
产品精修
调整透视--------------确定光源------------加强质感
修塑料瓶
A调节形体透视(标尺工具)
B拆分区块:
瓶身、瓶盖、金属环
C修瓶身:
用钢笔工具绘制高光并复制,对两层光源分别做高斯模糊、动感模糊柔化高光,进一步增加混合模式:
柔光
D修瓶盖:
用加深、减淡增强对比度
E进一步拆分金属环,锁定透明像素用涂抹工具去除杂色用加深、减淡增强对比
修戒指
A拼合图片,用钢笔抠出戒指并去色ctrl+shift+U
B按戒指结构拆分不同板块
C对每块锁定透明像素,进行涂抹、加深、减淡调整明暗对比按ALT可切换加深、减淡
涂抹时按区块的走势处理
D为防止产生杂色,时时去色ctrl+shift+U反复涂抹
E借助选区进一步修型
F在转折明显处用描边路径强调快捷键:
在画笔工具下回车
修玻璃瓶
1调节形体透视
2拆分瓶盖、瓶身将不规则logo修掉(shift+f5选内容识别)
3对瓶身进行模糊处理用钢笔画选区用高斯模糊或涂抹进一步处理
4创建两个曲线调整层
A提亮b压暗分别用蒙版对局部做影响
5用钢笔画高光用图层蒙版和描边路径处理
6用可选颜色调整层增加蓝色调
分析psd源文件技巧
1图层内容
A按alt点击图层小眼睛隐藏\显示其他图层
B用ctrl+T查找图层内容
2查看图层混合模式和不透明度
3查看剪切蒙版和图层蒙版
按shift点击图层蒙版缩略图可隐藏显示蒙版
按alt可切换图层蒙版视图查看蒙版内容
4查看是否有图层样式和调整层
5查看路径面板和通道
通道
1通道类型:
原色通道原色合成通道alpha通道(非色彩通道)
2原理:
通过灰阶多少显示此种颜色比重白色100%显示黑色100%隐藏灰色:
透明度
3半透明图像抠图
A选择适合通道
B载入通道选区ctrl点通道缩略图
C选择原色合成通道回到原图层ctrl+J复制图层
4复杂轮廓抠图
A选择边缘反差最大的通道
B复制通道通过色阶、曲线进一步加大反差
C用画笔涂抹图像可用钢笔配合得到黑白剪影
D载入选区反选ctrl+shift+i
E选合成通道回到原图复制图层ctrl+J
镜头光晕(滤镜---渲染---镜头光晕)
新建图层填充黑色------------镜头光晕-----------混合模式:
滤色
历史记录磨皮法
1复制图层----------高斯模糊值约5
2在历史记录面板中使用历史记录画笔选高斯模糊记录
3选择上一步记录用历史记录画笔涂抹
4盖印图层ctrl+shift+alt+E混合模式:
滤色适当调整不透明度
表面模糊磨皮法
1复制图层,用修复画笔修复明显斑点
2执行表面模糊(滤镜----模糊----表面模糊)
3盖印图层混合模式:
4盖印图层执行高反差保留(滤镜---其他---高反差保留)值约1混合模式:
5盖印整体调节(修复画笔)
通道配合曲线磨皮法
1复制图层用修复画笔修复明显斑点
2选择反差最大的通道复制并执行高反差保留值约9--10
3图像------计算(对通道添加混合模式:
强光)--------重复三次
4载入通道选区反选ctrl+shift+i
5选原色合成通道,回到原图在有选区的情况下执行曲线调整层提亮画面用图层蒙版细节处理
6盖印图层并复制一个图层
磨皮层-----表面模糊------用蒙版处理细节调节不透明度
质感层-----高反差保留(值约1)------混合模式:
7新建图层填充中性灰(亮度B50%)混合模式:
柔光用加深、减淡工具给脸部塑形
8新建图层用画笔工具涂抹混合模式:
柔光用蒙版处理细节
专题页规范
店招(header):
高度:
150px(logo导航促销信息)
首屏banner:
通栏大图:
宽1920px最高650px
主体设计内容:
B店(天猫店)宽:
990px
C店(淘宝店)宽:
960px
活动、优惠信息
主打产品(爆款)banner设计
主推产品(4-5款)
产品分类信息
客服信息
所有产品列表展示
底部信息(保障信息二维码)
直通车
1尺寸:
800px/800px
置换(滤镜---扭曲--置换)
1背景图存储为psd文件,选出需要置换的部分复制
2新建图层填充花纹
3置换选择psd文件
4花纹做剪切蒙版,用混合模式:
柔光、叠加进一步调整
详情页
1爆款详情页(销量高)
一般通过推广方式进入页面
内容丰富
2普通详情页(销量适中)
一般通过“关联营销”进入
内容包含基本信息
详情页尺寸:
B店(天猫):
790pxC店(淘宝)宽度:
750px
详情页工作流程
1了解布局形式:
促销说明类:
店内活动、关联营销
商品展示类:
banner海报图
交易说明类:
尺码规格
商品详细展示:
平拍、模特、颜色、细节、卖点
吸引购买类:
banner情感打动
搭配商品优惠方式
发货、验货、退换货
实力展示:
品牌、荣誉、资质
2拆解和分析竞争对手的详情页(一般一款产品找3-5家)
3提炼自家宝贝卖点
4结合自家商品卖点与分析规划详情页架构
5设计详情页
A按架构创建各个板块文件夹(素材、文案、psd源文件、jpg文件)
B可创建公共文件psd文件(公用设计形式)
C每个板块单独输出jpg格式,整合到一个psd文件中,最终导出jpg整体效果图
提高设计方法
1找到“心仪”的优秀作品
比如:
女装:
裂帛、初语、七格格
男装:
花笙记非池中lee
美妆护肤:
阿芙魔法世家御泥坊相宜本草
数码电器:
小狗小米
2拆解和分析:
构图设计思想设计重心留白黄金分割点配色字体字号等等问自己无数个“为什么?
”
3凭记忆临摹
4对比找不足思考“为什么会这样?
5再一次凭记忆临摹直到满意
6周而复始直到成为一种习惯
03WEEK
Flash基本操作
1设置工作区-------传统(重置“传统”)
2新建文档----------actionscript2.0
3保存------------flash源文件:
fla格式(注意保存版本)
-----------flash发布文件:
swf格式(ctrl+回车)
4舞台设置---------属性面板(ctrl+j)-------匹配“内容”
5放大/缩小ctrl+shift+鼠标滚轮
6翻转
修改--------变形--------水平/垂直翻转
7打散(分离)ctrl+B
8复制ctrl+C原位粘贴ctrl+shift+V
9颜料桶:
给形状填充颜色
10、墨水瓶:
给形状填充描边
11渐变变形工具F
调节渐变范围、角度、位置
可以用颜料桶替代
12alpha控制透明度
13铅笔-----绘制的是笔触(描边)
14刷子----绘制的是填充
15编辑多个帧
A首先激活“编辑多个帧”(时间轴面板下第三个图标)
B在时间轴上选择范围
C全选内容(锁定其他图层,选中要挪动位置的图层ctrl+A)拖动
D取消“编辑多个帧”
16psd文件导入
A选择所有文字---------勾选“可编辑文本”
B勾选底部“将舞台大小设置为与ps画布相同”
C为防止透明图层与背景粘连,选择所有透明图层,在右侧勾选“具有可编辑图层样式的位图”
17分散到图层全部选中内容ctrl+shift+D
绘制类工具
1形状
A在同一图层下,形状永远在最低层
B任意变形工具Q调整形状
C选中时为白色网点,用选择工具移动
双击填充全部选中(包括描边)双击描边,仅选中所有描边
D未选中时鼠标放在边缘可改变形状按alt键可拉出尖角
E同色相加异色相减
2多角星形工具
属性面板-----工具设置----选项中可设置边数和形状
注意星形顶点大小值0-1针对星形尖角形状调整
3绘制对象J
A封装的形状,双击进入内部还是形状
B在同一图层下,ctrl+上下方向键调整层级关系
C形状转换为绘制对象
修改---------合并对象----------联合
D绘制对象转换形状ctrl+B
4旋转与变形
A选中要旋转的形状q键改变中心点
B变形面板-----设置角度-----点击右下角“重置选区与变形”
C框选所有形状编组ctrl+G缩放
D取消编组ctrl+shift+G
5矩形工具
在按住鼠标拖动时用上下方向键可调节圆角,松开鼠标时圆角不可改变注意:
重置按钮
6基本矩形工具
在画好之后,可在属性面板调节圆角如果需要改变形状ctrl+B打散
7基本椭圆工具
绘制好后,可在属性面板进一步调节
影片剪辑与图形元件的区别
1影片剪辑可以加图层混合模式和滤镜效果,图形没有
2影片剪辑具有独立播放的时间轴,图形依赖主场景时间轴
3影片剪辑内部动画在主时间轴动画不可见,图形的内部动画可以实时预览
动画制作
1帧频:
24帧/秒(24---30)每秒播放多少帧
2帧---------普通帧F5删除shift+F5
关键帧F6删除shift+F6
空白关键帧F7删除shift+F6
逐帧动画
1导入文件(ctrl+R)或者ctrl+窗口+R
逐帧文件必须是连续的序列图
2导入时只需选中第一张图----------确定-----------选择“是”
补间动画
1补间形状
A必须要有两个关键帧
B两个关键帧上内容必须为形状(绘制对象),必须得有属性的改变,必须得有一定的时间
C在两个关键帧之间的任意位置右键选择创建补间形状
D可以改变大小、形态、位置、颜色、不透明度
2传统补间动画(两个关键帧上必须为同一个元件)
A必须先转元件F8
B选择“影片剪辑”改名字
C一定要有两个关键帧,选中第二关键帧属性面板----色彩效果----样式:
alpha(调整透明度)
D在两个关键帧之间右键选择创建传统补间
文字动画
1先整体敲字------打散ctrl+B为独立文字
2分散到图层ctrl+shift+D
3分别转元件F8影片剪辑元件
4统一确定静止画面关键帧,统一插入中间关键帧(惯性动画)
5分别调整属性位置透明度缩放ctrl+alt+S
6统一选中右键转为传统补间动画
7鼠标统一拖动帧--------错帧
旋转动画
1先调整中心点-----Q键
2插入关键帧,在中间右键选择创建传统补间
3在属性面板(补间)-----旋转----选择顺时针/逆时针----设置圈数
循环动画
1把素材转元件----影片剪辑
2进入元件内部,复制两次山脉,把中间的做水平翻转
3选中三个素材,转元件
4设置两个关键帧,调整位置,在第二个关键帧上让第三个素材的画面和第一素材原位置重合
5在两个关键帧之间右键创建传统补间
缓动动画
1在两个关键帧之间右键创建传统补间
2在属性面板------缓动值(-100------100)
-100加速100减速0匀速
遮罩动画
1上方图层控制下方图层的显示范围
上方为遮罩层(范围层),下方为内容层
2在上方遮罩层用形状绘制一个显示范围,在范围层右键选择“遮罩层”
3编辑遮罩层时需要解锁,看实时效果一定要锁定做遮罩的所有图层
4遮罩层上每个关键帧只能有一个对象(形状、绘制对象、元件(除按钮元件外))
5遮罩只能填充不能是描边(笔触)
描边转换为填充(修改------形状------将线条转为填充)
文字扫光动画
1复制要扫光的文字ctrl+C
2新建图层-----原位粘贴ctrl+shift+V-------打散ctrl+B为形状(范围层)
3在文字范围层下边新建图层(内容层),绘制白色矩形-----用渐变填充两侧透明度
4在光效层添加关键帧,调节角度Q---改变位置-----选择创建补间形状
5在文字范围层右键选择遮罩层
引导动画
1至少三个图层,第一个图层背景层第二个图层被引导层(汽车层),上方图层(引导层)
2将汽车转为元件----------添加关键帧,设置起始点和终点的位置,Q调整车方向
3在汽车层上方新建引导层,用钢笔工具绘制引导线(中间不要断开,不要重合太多)
4在引导层上右键选择引导层,把汽车层拖拽到引导层内部
5调整汽车层上两个关键帧的元件,一定要让中心点在引导线上
6在汽车层创建传统补间动画,在属性面板里勾选“调整到路径”
7只能是描边(笔触),不能是填充
水波纹动画
1轮船转元件----双击进入内部-----在图层上右键复制图层
2在最上方新建图层,用直线工具绘制波纹(拉出水波弧形),复制多条(修改----形状---将线条转换为填充)
3水波转元件,添加关键帧,调整位置右键创建传统补间动画
4水波层右键选择“遮罩层”
5把最底层按方向键上下微调位置
时间轴控制
1新建图层命名as,在最后一帧添加关键帧
2F9打开动作面板-----左侧全局函数-------时间轴控制----双击stop
按钮------四种状态
1弹起(默认显示状态)
2指针经过(鼠标悬停效果)
3按下
4点击(鼠标触发范围,内容不可见)
按钮元件内部不能再包含按钮
按钮跳转代码
1选中按钮按F9,输入:
on(release){getURL("
替换网址"
);
}
2全局函数-------影片剪辑控制------双击ON----右边窗口选择“release”
3默认光标在右边中括号里,左边浏览器/网络里双击“getURL”
4在getURL括号里用英文输入法输入引号----在引号里输入网址(http:
//www.网址)
Banner按钮跳转代码
1在banner动画最上方新建图层-----绘制跟舞台大小一样的矩形----选择矩形F8转按钮元件
2双击进入按钮内部,将第一帧拖到第四帧
3返回主场景,在舞台上选中按钮---F9
As2.0代码:
A在左侧选择全局函数------影片剪辑控制------双击ON
B在右侧选择“release”
C默认让光标在右侧中括号内----在左侧选择----浏览器/网络-----双击getURL
D在右侧getURL里输入英文状态下的双引号,在双引号里输入(http:
//www.网址)-----在第一个双引号后输入逗号,再输入一个引号,在第二个引号里输入“_blank”
As3.0代码
A选择右侧代码片段----动作----双击“单击以转到web页”-----设置实例名------确定
B在代码中只需替换“”
Banner广告压缩大小
1纯色背景或渐变色尽量在flash里绘制
2对复杂背景或者透明图片,在库面板中找到对应图片,右键选择属性-----勾选“允许平滑”----选择自定义设置根据情况设置值
3产品投影----新建纯色形状------转影片剪辑元件-----加模糊滤镜调节透明度
4所有文字---在最终动画确定后,打散成形状
04WEEK
AE软件基本操作
1工作区设置-----------右上角:
标准(重置“标准”)
2新建---------新建项目
-