H5移动营销广告设计全攻略:软件操作+应用开发+视觉设计+实战案例 刘松异 著 图形图像 专业科技 人民邮电出版社 9787115511560

●H5移动营销广告设计全攻略工具操作+应用开发+视觉设计+实战案例目 录软件操作篇第 1章H5微营销：互动性更强的场景体验1.1 H5移动营销，更小、更快、更简单.....91.1.1 为什么选择做H5营销.......................91.1.2 H5移动营销的功能特色....................91.1.3 细数用户的行为特征.......................101.2 用实力说话，H5移动营销的优势.......11第 2章工具：H5常用工具简介2.1 设计方法：H5移动设计的3种途径....162.2 素设计：H5的图形图像、影音开发工具............................................162.2.1 Photoshop——功能强大的设计工具...............................................172.2.2 Illustrator——专业的矢量图绘制工具...............................................172.2.3 Sketch——移动UI界面设计工具....182.2.4 After Effects——制作炫酷的视频特效........................................182.2.5 Cinema 4D——专业的三维软件工具........................................192.2.6 Final cut Pro——专业视频非线性编辑软件........................................192.2.7 Garage Band——数码音乐创作软件...............................................202.3 动画设计：H5设计的演示动画制作工具............................................202.3.1 Keynote——设计吸引人的PPT.....202.3.2 HYPE——做出悦目的动画效果......212.4 技术实现：H5的定制化发挥和创作工具............................................212.4.1 FWA——H5可以实现什么动态效果...............................................212.4.2 W 3school——了解H5的基础代码知识...............................................222.5 快速套用：互联网模板类H5开发平台.232.5.1 人人秀——3分钟制作H5微场景平台...............................................232.5.2 易企秀——一键生成企业营销H5....252.5.3 兔展——让H5设计不再单调...........272.5.4 MAKA——轻松搞定H5定制推广....292.5.5 初页——把你的照片变成故事和书....302.6 创意设计：互联网功能类H5开发平台.312.6.1 互动大师（iH5）——可视化的H5在线编辑器........................................312.6.2 意派360——非常懂设计师的专业H5工具..........................................342.7 组合使用：各种H5工具的选择方式...372.7.1 开发类H5工具的选择.....................372.7.2 网站类H5工具的选择.....................372.8 省时省力：H5设计常用的辅助工具...372.8.1 格式工厂——声音/视频压缩工具.....372.8.2 Ps Play——在上预览Photoshop设计稿...........................................382.8.3 TinyPNG——图片压缩工具...........382.8.4 草料——二维码生成工具................39第3章重点：H5之Photoshop详解3.1 图像设计：轻松提升H5作品的颜值....413.1.1 控制移动H5图像的画布..................413.1.2 运用工具裁剪移动H5图像..............423.1.3 移动H5图像的抠图合成..................433.1.4 移动H5图像的影调调整..................443.1.5 移动H5图像的色彩调整..................453.1.6 移动H5图像设计的绘图基础...........463.1.7 移动H5图像的路径编辑技巧...........473.1.8 移动H5图像的修饰与修复..............483.2 文字设计：做出有质感的好作品.......493.2.1 认识移动H5中的文字.....................493.2.2 输入移动H5图像文字.....................503.2.3 设置移动H5文字属性.....................513.2.4 设置移动H5段落属性.....................523.2.5 设置H5文字的沛样式..................533.2.6 设置H5的标题文字格式..................553.2.7 制作移动H5界面路径文字..............563.2.8 制作与编辑变形移动H5文字...........57应用开发篇第4章流程：移动H5的策划与开发4.1 前期准备：让H5设计事半功倍.........594.1.1 定目标：H5用来做什么..................594.1.2 找热点：H5如何火起来..................604.1.3 写策划：H5如何做起来..................614.2 程序设计：做H5的基本流程............624.2.1 选择模板：一键生成H5作品...........624.2.2 交互设计：让H5更具互动性...........634.2.3 视觉设计：给H5锦上添花..............684.3 测试分析：做好H5的总结与沉淀.......734.3.1 程序测试：进行修改和完善............734.3.2 活动上线：做好H5的推广..............744.3.3 效果分析：实现数据化营销............77第5章技术：移动H5热门开发技术5.1 让H5人气值棚的“黑科技”.........825.1.1 运用720度全景技术打造全景画面效果........................................825.1.2 运用3D旋转技术让H5画面更加动感...............................................825.1.3 运用人脸识别技术实现H5趣味营销...............................................835.1.4 运用物理引擎技术创建出虚拟世界...............................................845.1.5 运用重力感应技术提升用户的互动体验........................................855.1.6 运用手指跟随产生滑动幻灯片效果....865.2 H5 +VR/AR/AI：融合高端定制开发....875.2.1 运用AR技术结合线下活动和线上互动...............................................875.2.2 运用VR技术生成一种虚拟的动态情境........................................885.2.3 运用AI技术让移动H5作品变智能....895.3 展现动态炫酷画面的H5技术运用......925.3.1 运用快闪影片让H5作品更吸引眼球...............................................925.3.2 运用粒子特效展现炫酷的动画效果....935.3.3 运用视频互动更好地展示品牌内容....945.3.4 运用多屏互动打造互动新模式....955.3.5 运用GIF动画让页面变得生动..........96视觉设计篇第6章风格：移动H5视觉风格设计6.1 设计原则：五大H5设计精髓要点......986.1.1 有创意，少抄袭，多原创................986.1.2 注重H5设计风格的统一..................996.1.3 H5原型图的绘制与构思................1006.1.4 营造出合适的视觉氛围.................1006.1.5 让用户真实参与和体验.................1016.2 设计风格：12种H5设计风格解析....1036.2.1 扁平、插画视觉风格设计..............1036.2.2 手绘、动漫视觉风格设计..............1056.2.3 水墨、复古视觉风格设计..............1056.2.4 写实、科技视觉风格设计..............1066.2.5 极简、拼贴视觉风格设计..............1086.2.6 摄影、小清新视觉风格设计..........1096.3 表现手法：6种H5视觉特效设计.......1106.3.1 来电视觉特效表现手法.................1106.3.2 擦除视觉特效表现手法.................1126.3.3 动画视觉特效表现手法.................1136.3.4 SVG视觉特效表现手法................1136.3.5 拍立得视觉特效表现手法..............1146.3.6 玻璃碎掉视觉特效表现手法..........115第7章创意：移动H5视觉创意设计7.1 版式设计：让你的设计越来越出色....1177.1.1 视觉动线设计...............................1177.1.2 画面焦点设计...............................1177.1.3 页面层级设计...............................1187.2 活动设计：快速引H5页面的热度..1197.2.1 砍价活动设计...............................1197.2.2 抽奖活动设计...............................1217.2.3 调查问卷设计...............................1217.2.4 投票活动设计...............................1237.2.5 卡券活动设计........................1277.3 动效设计：为H5页面打造视觉动效....1277.3.1 了解移动H5的动效知识................1277.3.2 H5动效的主要类型与实现方法.....1287.3.3 在H5作品中运用转场类动效.........1307.3.4 在H5作品中运用内容类动效.........1317.3.5 在H5作品中运用辅助性动效.........1317.3.6 在H5作品中运用功能性动效.........1317.4 音效设计：更好展现H5作品个性与情感.........................................1327.4.1 不能忽略H5作品中的声音............1327.4.2 H5背景音效的注意事项................1337.4.3 选择合适的H5背景音效................1337.4.4 H5作品中常见的辅助音效............1347.4.5 如何获取更好的音效.....................1347.5 交互设计：增加互动性吸引更多人气....1357.5.1 幕评论设计...............................1357.5.2 点击触发事件设计........................1367.5.3 互动游戏设计...............................138实战案例篇第8章单页：精美H5单页移动设计8.1 旅行相册H5页面设计...................1428.1.1 设计旅行相册颗粒背景效果........1428.1.2 设计旅行相册文字信息效果........1438.1.3 设计旅行相册照片装饰效果........1458.2 促销活动H5页面设计...................1478.2.1 设计促销活动背景纹理效果........1478.2.2 设计促销活动文字边框效果........1488.2.3 设计促销活动产品布局效果........1518.3 年会邀请函H5页面设计................1528.3.1 设计年会邀请函边框效果...........1528.3.2 设计年会邀请函主题效果...........1558.3.3 设计年会邀请函整体效果...........156第9章综合：节日场景H5移动设计9.1 春节活动H5作品设计的前期准备....1599.1.1 整体的创意构思............................1599.1.2 素材图像的收集............................1609.2 通过Photoshop制作图像效果......1609.2.1 制作节日主题文字效果.................1609.2.2 抠取新年装饰素材图案.................1639.3 通过工具网站生成H5作品.............1649.3.1 设计H5作品的第 1页：活动标题...1649.3.2 设计H5作品的第 2页：祝福文案...1689.3.3 设计H5作品的第3页：红包活动...1729.3.4 为H5作品添加背景音效................1759.4 移动H5作品的发布和分享.............1769.4.1 发布与上线H5作品.......................1769.4.2 将H5活动页面分享到群.........178第 10章综合：产品推广H5移动设计10.1 产品推广H5作品设计的前期准备..18010.1.1 整体的创意构思.......................18010.1.2 素材图像的拍摄与收集.............18010.2 通过Photoshop制作图像效果.....18110.2.1 主题文字的设计.......................18110.2.2 产品图片的调色处理................18410.2.3 产品图片的详情展示................18510.3 通过工具网站生成H5作品...........18710.3.1 设计H5作品的第 1页：首页设计........................................18710.3.2 设计H5作品的第 2页：推荐产品1......................................19010.3.3 设计H5作品的第3页：推荐产品2 .....................................19210.3.4 设计H5作品的第4页：产品展示........................................19310.3.5 设计H5作品的第5页：产品预订........................................19410.3.6 为H5作品添加背景音效...........19610.4 移动H5作品的发布和分享...........19610.4.1 发布与上线H5作品..................19610.4.2 将H5作品分享到朋友圈...........198第 11章综合：企业招聘H5移动设计11.1 企业H5招聘广告制作的前期准备..20011.1.1 H5招聘广告的整体创意构思....20011.1.2 整理相关的招聘内容................20111.2 通过Photoshop制作图像效果....20111.2.1 使用Photoshop制作招聘主题图片.................................20111.2.2 使用Photoshop调整企业相关图片.................................20311.3 通过工具网站生成H5页面...........20611.3.1 设计H5招聘广告的第 1页：招聘主题........................................20611.3.2 设计H5招聘广告的第 2页：公司实力展示.................................20911.3.3 设计H5招聘广告的第3页：工作环境展示.................................21011.3.4 设计H5招聘广告的第4页：企业展示.................................21111.3.5 设计H5招聘广告的第5页：招聘岗位展示.................................21311.3.6 设计H5招聘广告的第6页：在线报名申请.................................21611.3.7 为H5作品添加背景音效...........21911.4 移动H5作品的发布和分享...........22011.4.1 发布与上线H5作品..................22111.4.2 分享H5作品与收集求职者信息.221