H5和長圖的制作訓(xùn)練

課程背景：
    為什么要開發(fā)本課程？隨著移動(dòng)互聯(lián)網(wǎng)的發(fā)展，H5和長圖的運(yùn)用越來越廣，對于宣傳企業(yè)文化、及時(shí)傳遞公司資訊、分享微課等都非常有利。
    如何開發(fā)本課程？對比多款技術(shù)軟件，對最常用的軟件應(yīng)用進(jìn)行實(shí)操演示。本課程的特色是什么？可操作性強(qiáng)，課堂產(chǎn)出效果明顯。

課程收益：
● 知識方面：熟悉H5和長圖的應(yīng)用和優(yōu)勢
● 技能方面：掌握H5和長圖的制作技巧
● 獲贈(zèng)豐富的模板和素材、相關(guān)軟件等

課程時(shí)間：2天，6小時(shí)/天
課程對象：企業(yè)中基層人員
課程方式：講師講授、案例分析、課堂練習(xí)、輔導(dǎo)點(diǎn)評、操作演示等

課程大綱

上篇：H5的制作訓(xùn)練

第一講：制作H5的十大工具對比
1. 易企秀的優(yōu)缺點(diǎn)
2. 人人秀的優(yōu)缺點(diǎn)
3. MAKA的優(yōu)缺點(diǎn)
4. 兔展的優(yōu)缺點(diǎn)
5. 人人秀的優(yōu)缺點(diǎn)
6. 70C的優(yōu)缺點(diǎn)
7. 最酷網(wǎng)的優(yōu)缺點(diǎn)
8. 云來的優(yōu)缺點(diǎn)
9. Epub360的優(yōu)缺點(diǎn)
10. iH5的優(yōu)缺點(diǎn)

第二講： 制作實(shí)戰(zhàn)篇（以易企秀為例）
一、第1步：認(rèn)識H5的操作界面
1. 菜單欄
1）文本
2）圖片
3）背景
4）音樂
5）形狀
6）表單
7）特效
2. 模板欄
1）單頁模板（與整體模板對應(yīng)）
2）功能模板
3）我的模板
二、第2步：1.0版H5——骨感
1. 全副武裝
1）安裝圖片水印去除軟件
2）安裝音視頻剪切軟件
3）安裝屏幕取色器軟件
2. 設(shè)計(jì)主題封面
1）添加公司LOGO
2）標(biāo)題字體字號顏色設(shè)計(jì)
3）正文字體字號顏色設(shè)計(jì)
4）主題背景設(shè)計(jì)
3. 設(shè)計(jì)主題內(nèi)容總頁數(shù)
三、第3步：2.0版H5——豐滿
1. 豐富血肉三要素
1）圖片
2）文字
3）音樂
2. 七大渠道豐富血肉
1）記錄本
2）學(xué)員訪談
3）相片圖片
4）互聯(lián)網(wǎng)
5）同行激蕩
6）書報(bào)雜志
7）實(shí)地考察
四、第4步：3.0版H5——美化
1. 排版美化六要素
2. 版面設(shè)計(jì)4大要求
3. 版面設(shè)計(jì)工具
1）網(wǎng)格開關(guān)
2）智能參考線
3）吸附效果
4. 文字處理技巧
1）文不如句、句不如詞
2）標(biāo)題字體字號顏色
3）正文字體字號顏色
5. 圖片的兩大來源
1）百度圖片
2）專業(yè)圖片網(wǎng)站
6. 圖片的常用處理技巧（結(jié)合圖片處理軟件）
7. 色彩搭配技巧
1）三色原則
2）深淺原則
3）統(tǒng)一原則
8. 色彩的四大形式
1）字體顏色
2）形狀顏色
3）邊框顏色
4）背景顏色
9. 音頻的剪切技巧示范
五、第5步：4.0版H5——?jiǎng)赢?br/>1. 動(dòng)畫的四種類型
1）進(jìn)入動(dòng)畫
2）強(qiáng)調(diào)動(dòng)畫
3）退出動(dòng)畫
4）特殊動(dòng)畫
2. 動(dòng)畫的批處理技巧和設(shè)置技巧
1）H5極品動(dòng)畫欣賞
2）動(dòng)畫設(shè)置技巧
3. 頁面特效的設(shè)置

第三講：設(shè)計(jì)理念篇
一、H5新手的七宗罪
1. 長篇大論
2. 五顏六色
3. 風(fēng)格雜亂
4. 低劣圖片
5. 排版混亂
6. 濫用動(dòng)畫
7. 邏輯不清
二、精美H5四要素模型
1. 結(jié)構(gòu)化思考
2. 圖表化表達(dá)
3. 色彩化突出
4. 動(dòng)態(tài)化呈現(xiàn)
三、何謂結(jié)構(gòu)化與結(jié)構(gòu)化的優(yōu)點(diǎn)
1. 簡明扼要
2. 清晰明了
3. 容易記憶
四、H5風(fēng)格的定位
1. 夸張風(fēng)格：濃妝艷抹
2. 商務(wù)風(fēng)格：質(zhì)樸簡約
3. 藝術(shù)風(fēng)格：天馬行空
4. 極簡風(fēng)格：只言片語

下篇：長圖文的制作訓(xùn)練（課前準(zhǔn)備：安裝240種書法字體）

第一講：制作長圖文的常用軟件
1. 電腦自帶畫圖工具
2. Word
3. PPT
4. 美圖秀秀
5. PhotoShop（位圖軟件）
6. Ai（矢量圖軟件）
7. Indesign（排版強(qiáng)大，位圖 矢量圖，擅長文字）
8. Coredraw（排版強(qiáng)大，位圖 矢量圖，擅長文字）
9. 網(wǎng)頁工具——秀米（做H5，做公眾號）
10. 手機(jī)APP（如簡書）

第二講：制作實(shí)戰(zhàn)篇（以PhotoShop為例）
一、圖片的基本知識
1. 像素與矢量（函數(shù)）
2. 位圖與位圖設(shè)計(jì)軟件（PS、美圖秀秀）
3. 矢量圖與矢量設(shè)計(jì)軟件
4. 圖片的存儲(chǔ)格式（jpg有背景，png背景透明，占空間，psd-PS，ai-AI,GIF動(dòng)圖等）
二、圖片的顏色模式
1. 位圖模式（黑白模式）
2. 灰度模式（與位圖模式的差別）
3. RGB模式（紅綠藍(lán)）
4. CMYK模式（打印）
5. Lab模式
三、圖片大小的影響因素
1. 寬度與高度比例
2. 分辨率
四、長圖制作六步驟
1. 設(shè)置圖片大小（寬高、分辨率）
2. 圖片主色調(diào)選擇
3. 設(shè)計(jì)長圖背景
4. 主字體選擇
5. 圖層素材收集
6. 圖文排版
五、圖層素材的來源
1. 形狀工具的妙用
2. 選區(qū)工具制作icon
3. PS筆刷
4. 圖層素材網(wǎng)站（千庫網(wǎng)等）
5. 圖層樣式的設(shè)置
六、版面設(shè)計(jì)工具
1. 標(biāo)尺
2. 網(wǎng)格線
3. 參考線
4. 對齊格式
七、圖片導(dǎo)出
八、H5設(shè)計(jì)理念知識點(diǎn)回顧（色彩、配色、風(fēng)格）

第三講：制作延展篇
1. 秀米制作長圖文（網(wǎng)頁端）
2. 簡書制作長圖文（手機(jī)端）
注：課綱大綱可根據(jù)企業(yè)實(shí)際需求進(jìn)行調(diào)整，最終以課件內(nèi)容為準(zhǔn)！