H5移动营销广告设计全攻略 软件操作+应用开发+视觉设计+实战案例2025|PDF|Epub|mobi|kindle电子书版本百度云盘下载

H5移动营销广告设计全攻略 软件操作+应用开发+视觉设计+实战案例PDF格式电子书版下载

注意：本站所有压缩包均有解压码： 点击下载压缩包解压工具

软件操作篇9

第1章 H5微营销：互动性更强的场景体验9

1.1 H5移动营销，更小、更快、更简单9

1.1.1 为什么选择做H5营销9

1.1.2 H5移动营销的功能特色9

1.1.3 细数用户的行为特征10

1.2 用实力说话，H5移动营销的优势11

第2章 工具：H5常用工具简介16

2.1 设计方法：H5移动设计的3种途径16

2.2 元素设计：H5的图形图像、影音开发工具16

2.2.1 Photoshop——功能强大的设计工具17

2.2.2 Ⅲustrator——专业的矢量图绘制工具17

2.2.3 Sketch——移动UI界面设计工具18

2.2.4 After Effects——制作炫酷的视频特效18

2.2.5 Cinema 4D——专业的三维软件工具19

2.2.6 Final cut Pro——专业视频非线性编辑软件19

2.2.7 Garage Band——数码音乐创作软件20

2.3 动画设计：H5设计的演示动画制作工具20

2.3.1 Keynote——设计吸引人的PPT20

2.3.2 HYPE——做出悦目的动画效果21

2.4 技术实现：H5的定制化发挥和创作工具21

2.4.1 FWA——H5可以实现什么动态效果21

2.4.2 W3school——了解H5的基础代码知识22

2.5 快速套用：互联网模板类H5开发平台23

2.5.1 人人秀——3分钟制作H5微场景平台23

2.5.2 易企秀——键生成企业营销H525

2.5.3 兔展——让H5设计不再单调27

2.5.4 MAKA——轻松搞定H5定制推广29

2.5.5 初页——把你的照片变成故事和书30

2.6 创意设计：互联网功能类H5开发平台31

2.6.1 互动大师（iH5）——可视化的H5在线编辑器31

2.6.2 意派360——非常懂设计师的专业H5工具34

2.7 组合使用：各种H5工具的选择方式37

2.7.1 开发类H5工具的选择37

2.7.2 网站类H5工具的选择37

2.8 省时省力：H5设计常用的辅助工具37

2.8.1 格式工厂——声音/视频压缩工具37

2.8.2 Ps Play——在手机上预览Photoshop设计稿38

2.8.3 TinyPNG——图片压缩工具38

2.8.4 草料——二维码生成工具39

第3章 重点：H5之Photoshop详解41

3.1 图像设计：轻松提升H5作品的颜值41

3.1.1 控制移动H5图像的画布41

3.1.2 运用工具裁剪移动H5图像42

3.1.3 移动H5图像的抠图合成43

3.1.4 移动H5图像的影调调整44

3.1.5 移动H5图像的色彩调整45

3.1.6 移动H5图像设计的绘图基础46

3.1.7 移动H5图像的路径编辑技巧47

3.1.8 移动H5图像的修饰与修复48

3.2 文字设计：做出有质感的好作品49

3.2.1 认识移动H5中的文字49

3.2.2 输入移动H5图像文字50

3.2.3 设置移动H5文字属性51

3.2.4 设置移动H5段落属性52

3.2.5 设置H5文字的排版样式53

3.2.6 设置H5的标题文字格式55

3.2.7 制作移动H5界面路径文字56

3.2.8 制作与编辑变形移动H5文字57

应用开发篇59

第4章 流程：移动H5的策划与开发59

4.1 前期准备：让H5设计事半功倍59

4.1.1 定目标：H5用来做什么59

4.1.2 找热点：H5如何火起来60

4.1.3 写策划：H5如何做起来61

4.2 程序设计：做H5的基本流程62

4.2.1 选择模板：一键生成H5作品62

4.2.2 交互设计：让H5更具互动性63

4.2.3 视觉设计：给H5锦上添花68

4.3 测试分析：做好H5的总结与沉淀73

4.3.1 程序测试：进行修改和完善73

4.3.2 活动上线：做好H5的推广74

4.3.3 效果分析：实现数据化营销77

第5章 技术：移动H5热门开发技术82

5.1 让H5人气值爆棚的“黑科技”82

5.1.1 运用720度全景技术打造全景画面效果82

5.1.2 运用3D旋转技术让H5画面更加动感82

5.1.3 运用人脸识别技术实现H5趣味营销83

5.1.4 运用物理引擎技术创建出虚拟世界84

5.1.5 运用重力感应技术提升用户的互动体验85

5.1.6 运用手指跟随产生滑动幻灯片效果86

5.2 H5＋VR/AR/AI：融合高端定制开发87

5.2.1 运用AR技术结合线下活动和线上互动87

5.2.2 运用VR技术生成一种虚拟的动态情境88

5.2.3 运用AI技术让移动H5作品变智能89

5.3 展现动态炫酷画面的H5技术运用92

5.3.1 运用快闪影片让H5作品更吸引眼球92

5.3.2 运用粒子特效展现炫酷的动画效果93

5.3.3 运用视频互动更好地展示品牌内容94

5.3.4 运用多屏互动打造互动娱乐新模式95

5.3.5 运用GIF动画让页面变得生动96

视觉设计篇98

第6章 风格：移动H5视觉风格设计98

6.1 设计原则：五大H5设计精髓要点98

6.1.1 有创意，少抄袭，多原创98

6.1.2 注重H5设计风格的统一99

6.1.3 H5原型图的绘制与构思100

6.1.4 营造出合适的视觉氛围100

6.1.5 让用户真实参与和体验101

6.2 设计风格：12种H5设计风格解析103

6.2.1 扁平、插画视觉风格设计103

6.2.2 手绘、动漫视觉风格设计105

6.2.3 水墨、复古视觉风格设计105

6.2.4 写实、科技视觉风格设计106

6.2.5 极简、拼贴视觉风格设计108

6.2.6 摄影、小清新视觉风格设计109

6.3 表现手法：6种H5视觉特效设计110

6.3.1 来电视觉特效表现手法110

6.3.2 擦除视觉特效表现手法112

6.3.3 动画视觉特效表现手法113

6.3.4 SVG视觉特效表现手法113

6.3.5 拍立得视觉特效表现手法114

6.3.6 玻璃碎掉视觉特效表现手法115

第7章 创意：移动H5视觉创意设计117

7.1 版式设计：让你的设计越来越出色117

7.1.1 视觉动线设计117

7.1.2 画面焦点设计117

7.1.3 页面层级设计118

7.2 活动设计：快速引爆H5页面的热度119

7.2.1 砍价活动设计119

7.2.2 抽奖活动设计121

7.2.3 调查问卷设计121

7.2.4 投票活动设计123

7.2.5 微信卡券活动设计127

7.3 动效设计：为H5页面打造视觉动效127

7.3.1 了解移动H5的动效知识127

7.3.2 H5动效的主要类型与实现方法128

7.3.3 在H5作品中运用转场类动效130

7.3.4 在H5作品中运用内容类动效131

7.3.5 在H5作品中运用辅助性动效131

7.3.6 在H5作品中运用功能性动效131

7.4 音效设计：更好展现H5作品个性与情感132

7.4.1 不能忽略H5作品中的声音132

7.4.2 H5背景音效的注意事项133

7.4.3 选择合适的H5背景音效133

7.4.4 H5作品中常见的辅助音效134

7.4.5 如何获取更好的音效134

7.5 交互设计：增加互动性吸引更多人气135

7.5.1 弹幕评论设计135

7.5.2 点击触发事件设计136

7.5.3 互动游戏设计138

实战案例篇142

第8章 单页：精美H5单页移动设计142

8.1 旅行相册H5页面设计142

8.1.1 设计旅行相册颗粒背景效果142

8.1.2 设计旅行相册文字信息效果143

8.1.3 设计旅行相册照片装饰效果145

8.2 促销活动H5页面设计147

8.2.1 设计促销活动背景纹理效果147

8.2.2 设计促销活动文字边框效果148

8.2.3 设计促销活动产品布局效果151

8.3 年会邀请函H5页面设计152

8.3.1 设计年会邀请函边框效果152

8.3.2 设计年会邀请函主题效果155

8.3.3 设计年会邀请函整体效果156

第9章 综合：节日场景H5移动设计159

9.1 春节 活动H5作品设计的前期准备159

9.1.1 整体的创意构思159

9.1.2 素材图像的收集160

9.2 通过Photoshop制作图像效果160

9.2.1 制作节日主题文字效果160

9.2.2 抠取新年装饰素材图案163

9.3 通过工具网站生成H5作品164

9.3.1 设计H5作品的第1页：活动标题164

9.3.2 设计H5作品的第2页：祝福文案168

9.3.3 设计H5作品的第3页：红包活动172

9.3.4 为H5作品添加背景音效175

9.4 移动H5作品的发布和分享176

9.4.1 发布与上线H5作品176

9.4.2 将H5活动页面分享到微信群178

第10章 综合：产品推广H5移动设计180

10.1 产品推广H5作品设计的前期准备180

10.1.1 整体的创意构思180

10.1.2 素材图像的拍摄与收集180

10.2 通过Photoshop制作图像效果181

10.2.1 主题文字的设计181

10.2.2 产品图片的调色处理184

10.2.3 产品图片的详情展示185

10.3 通过工具网站生成H5作品187

10.3.1 设计H5作品的第1页：首页设计187

10.3.2 设计H5作品的第2页：推荐产品1190

10.3.3 设计H5作品的第3页：推荐产品2192

10.3.4 设计H5作品的第4页：产品展示193

10.3.5 设计H5作品的第5页：产品预订194

10.3.6 为H5作品添加背景音效196

10.4 移动H5作品的发布和分享196

10.4.1 发布与上线H5作品196

10.4.2 将H5作品分享到朋友圈198

第11章 综合：企业招聘H5移动设计200

11.1 企业H5招聘广告制作的前期准备200

11.1.1 H5招聘广告的整体创意构思200

11.1.2 整理相关的招聘内容201

11.2 通过Photoshop制作图像效果201

11.2.1 使用Photoshop制作招聘主题图片201

11.2.2 使用Photoshop调整企业相关图片203

11.3 通过工具网站生成H5页面206

11.3.1 设计H5招聘广告的第1页：招聘主题206

11.3.2 设计H5招聘广告的第2页：公司实力展示209

11.3.3 设计H5招聘广告的第3页：工作环境展示210

11.3.4 设计H5招聘广告的第4页：企业福利展示211

11.3.5 设计H5招聘广告的第5页：招聘岗位展示213

11.3.6 设计H5招聘广告的第6页：在线报名申请216

11.3.7 为H5作品添加背景音效219

11.4 移动H5作品的发布和分享220

11.4.1 发布与上线H5作品221

11.4.2 分享H5作品与收集求职者信息221