1730次学习
本课程将全面讲解web开发实际流程中,从前端设计到前端架构环节中涉及到的工作技能及操作流程。课程主要包含审图、标注以及切图三部分,涉及的相关知识点位:Web前端开发中图像处理的相关知识、PS软件的基础操作及UI类操作、前端UI类相关插件的使用及工作解决方案。主要面向新手UI设计师及前端架构师。
年后持续更新中。。。
1-1 课程介绍及资源准备
1-2 前端工作流程梳理介绍
1-3 ps介绍及安装
1-4 概念:位图vs矢量图
1-5 概念and分配率
1-6 概念:色彩模式
2-1-1 Ps参数设置
2-1-2 ps界面及布局
2-2 新建打开保存
2-3 查看图像信息
2-4 查看图像辅助操作
2-5-1 图层:概念及类型
2-5-2 常见图层操作
2-5-3 图层:常见应用
2-6 操作选区1
2-6 操作选区2
2-7 文本操作1
2-7 文本操作2
2-8 色彩填充及历史记录
2-9 前端看图总结及技巧1
2-9 前端看图总结及技巧2
3-1 标注的认知
3-2 标注的操作:MarkMan
3-3 标注工具:PxCook
3-4-1 标注和视觉规范相结合
3-4-2 遵循开发逻辑和CSS思维
3-4-3 标注内容合理划分,归纳整合,提炼复用
3-5-1 标注方案演示:通用规范
3-5-2 标注方案演示:布局及通用模块
3-5-3 标注方案演示:页面模块标注
3-5-4 标注方案演示:总结
4-1 切图的认知:演示
4-2 切图的认知:总结
4-3-1 PS切图:切片工具1
4-3-2 PS切图:切片工具2
4-4 PS切图:存储为web格式
4-5 web图片格式:jpg
4-6 web图片格式:png
4-7 web图片格式:gif
4-8 web图片格式:SVG矢量
4-9-1 原始切图法总结及完整演示1
4-9-2 原始切图法总结及完整演示2
4-10 PS切图新技能:导出
4-11 PS:快速导出
4-12 PS:导出为
4-13 PS:导出脚本
4-14 导出切图法演示
4-15 PS切图新技能:生成资源(基础)
4-16 PS切图新技能:生成资源(高级)
4-17 现代切图完整演示
4-18 切图技能总结及观点
4-19 图片优化压缩:Tinypng
4-20 图片优化压缩:RIOT
4-21 优化:雪碧图介绍
4-22 优化:雪碧图演示
4-23-1 优化:雪碧图生成:Go!png
4-23-2 优化:雪碧图生成:雪碧图合成工具
4-23-3 优化:雪碧图生成:相关推荐
4-24 优化:雪碧图总结
4-25 移动端切图:概述
4-26 移动端切图:术语概念
4-27 移动端切图:流程
4-28 移动端切图:点9图的玩法
4-29 插件:切图神器:cutterman
再看看其他课
讲师
如水迷
柠檬金牌讲师
Web前端设计师、架构师,20年从业经验,精通webUI交互设计和前端架构技术,涉及和跨越Web行业多种领域柠檬学院金牌讲师,负责学员基础培养和行业指导,已培养千名优秀学员,主讲课程好评如潮。
欢迎拨打服务热线
400-620-5100