H5和长图的制作训练

上篇：H5的制作训练

首讲：制作H5的十大抓手对比

1. 易企秀的优缺点

2. 人人秀的优缺点

3. MAKA的优缺点

4. 兔展的优缺点

5. 人人秀的优缺点

6. 70C的优缺点

7. 最酷网的优缺点

8. 云来的优缺点

9. Epub360的优缺点

10. iH5的优缺点

次讲： 制作实战篇（以易企秀为例）

一，第1步：认识H5的操作界面

1. 菜单栏

1）文本

2）图片

3）来由

4）音乐

5）形状

6）表单

7）特效

2. 模板栏

1）单页模板（和整体模板对应）

2）功能模板

3）我的模板

二，第2步：1.0版H5——骨感

1. 全副武装

1）安装图片水印去除软件

2）安装音视频剪切软件

3）安装屏幕取色器软件

2. 规划主题封面

1）添加公司LOGO

2）标题字体字号颜色规划

3）正文字体字号颜色规划

4）主题来由规划

3. 规划主题内容总页数

三、第3步：2.0版H5——丰满

1. 充实血肉三要素

1）图片

2）文字

3）音乐

2. 七大渠道充实血肉

1）记录本

2）参训者访谈

3）相片图片

4）互联网

5）同行激荡

6）书报杂志

7）实地考察

四，第4步：3.0版H5——美化

1. 排版美化六要素

2. 版面规划4大要求

3. 版面规划抓手

1）网格开关

2）智能参考线

3）吸附成效

4. 文字处理招数

1）文不如句、句不如词

2）标题字体字号颜色

3）正文字体字号颜色

5. 图片的两大来源

1）百度图片

2）专精图片网站

6. 图片的常用处理招数（结合图片处理软件）

7. 色彩搭配招数

1）三色要则

2）深浅要则

3）统一要则

8. 色彩的四大形式

1）字体颜色

2）形状颜色

3）边框颜色

4）来由颜色

9. 音频的剪切招数示范

五、第5步：4.0版H5——动画

1. 动画的四种类型

1）进入动画

2）强调动画

3）退出动画

4）特殊动画

2. 动画的批处理招数和设置招数

1）H5极品动画欣赏

2）动画设置招数

3. 页面特效的设置

三讲： 规划理念篇

一、H5新手的七宗罪

1. 长篇大论

2. 五颜六色

3. 风格杂乱

4. 低劣图片

5. 排版混乱

6. 滥用动画

7. 推演不清

二、精美H5四要素模型

1. 结构化思索

2. 图表化表述

3. 色彩化突出

4. 动态化呈现

三、何谓结构化和结构化的优点

1. 简明扼要

2. 清晰明了

3. 容易记忆

四，H5风格的定位

1. 夸张风格：浓妆艳抹

2. 商务风格：质朴简约

3. 艺术风格：天马行空

4. 极简风格：只言片语

下篇：长图文的制作训练（课前准备：安装240种书法字体）

首讲：制作长图文的常用软件

1. 电脑自带画图抓手

2. Word

3. PPT

4. 美图秀秀

5. PhotoShop（位图软件）

6. Ai（矢量图软件）

7. Indesign（排版强大，就一线经验说，位图+矢量图，在实际应用里，擅长文字）

8. Coredraw（排版强大，往细里说，位图+矢量图，擅长文字）

9. 网页抓手——秀米（做H5，做公众号）

10. 手机APP（如简书）

次讲：制作实战篇（以PhotoShop为例）

一、图片的基本学识

1. 像素和矢量（函数）

2. 位图和位图规划软件（PS、美图秀秀）

3. 矢量图和矢量规划软件

4. 图片的存储格式（jpg有来由，png来由透明，占空间，psd-PS，ai-AI,GIF动图等等）

二，图片的颜色模式

1. 位图模式（黑白模式）

2. 灰度模式（和位图模式的差别）

3. RGB模式（红绿蓝）

4. CMYK模式（打印）

5. Lab模式

三，图片大小的影响因素

1. 宽度和高度比例

2. 分辨率

四，长图制作六步骤

1. 设置图片大小（宽高，分辨率）

2. 图片主色调选项

3. 规划长图来由

4. 主字体选项

5. 图层素材收集

6. 图文排版

五，图层素材的来源

1. 形状抓手的妙用

2. 选区抓手制作icon

3. PS笔刷

4. 图层素材网站（千库网等等）

5. 图层样式的设置

六、版面规划抓手

1. 标尺

2. 网格线

3. 参考线

4. 对齐格式

七、图片导出

八、H5规划理念学识点回顾（色彩、配色、风格）

三讲：制作延展篇

1. 秀米制作长图文（网页端）

2. 简书制作长图文（手机端）

注：课纲大纲可根据公司实际诉求开展调整，最终以课件内容为准！

老师简介

Introduction to lecturers

弄懂更多

珀菲特顾问|戴辉平老师