課程簡(jiǎn)介：
本課程涵蓋HTML5游戲開發(fā)基礎(chǔ)知識(shí)到游戲?qū)崙?zhàn)，從零基礎(chǔ)開始，涉及HTML5 Web游戲開發(fā)中的需要掌握的方方面面的知識(shí)，并以兩個(gè)游戲?qū)崙?zhàn)鞏固和升華學(xué)習(xí)的游戲開發(fā)知識(shí)。
掌握本課程后，學(xué)員能夠完全勝任HTML5 Web游戲開發(fā)。
培訓(xùn)目標(biāo)：
掌握全新的HTML5 Web游戲開發(fā)技能
額外的話：
本課程是是HTML5的方向之一Web游戲方面的課程；
HTML5的軟硬整合技術(shù)和HTML5云開發(fā)技術(shù)是另外兩個(gè)非常重要的方向，有需要的話，可以自由選學(xué)；
?
培訓(xùn)內(nèi)容：
第1個(gè)主題：HTML5技術(shù)和商業(yè)思考
1,1 HTML5的目標(biāo)
1,2 無(wú)法拒絕使用HTML5的原因
1,3 可以放心使用HTML5的原因
第2個(gè)主題：基本的HTML5模板
2,1 Doctype
2,2 html元素
2.3 head元素
第3個(gè)主題：HTML5頁(yè)面結(jié)構(gòu)
3,1 header元素
3,2 section元素
3.3 article元素
3.4 nav元素
3.5 aside元素
3.6 footer元素
第4個(gè)主題：HTML5中游戲開發(fā)中的JavaScript（初級(jí)）
4.1 JavaScript概述
4.2 jQuery
4.2.1 jQuery是什么
4.2.2 為什么要使用它
4.2.3 這是在誤導(dǎo)你嗎
4.2.4 是否不需要理解純JavaScript
4.2.5 如何使用jQuery
4.3 在HTML頁(yè)面上添加JavaScript
4.4 在頁(yè)面加載之后運(yùn)行JavaScript
4.4.1 錯(cuò)誤的方法(window.onload事件)
4.4.2 冗長(zhǎng)的方法(DOM)
4.4.3 簡(jiǎn)單的方法(jQuery方法)
4.5 變量與數(shù)據(jù)類型
4.5.1 變量
4.5.2 數(shù)據(jù)類型
4.6 條件語(yǔ)句
4.6.1 if語(yǔ)句
4.6.2 比較運(yùn)算符
4.6.3 在if語(yǔ)句中進(jìn)行多重布爾值檢查
4.6.4 else和else if語(yǔ)句
第5個(gè)主題：HTML5中游戲開發(fā)中的JavaScript（中級(jí)）
5.1 函數(shù)
5.1.1 創(chuàng)建函數(shù)
5.1.2 調(diào)用函數(shù)
5.2 對(duì)象
5.2.1 什么是對(duì)象
5.2.2 創(chuàng)建和使用對(duì)象
5.3 數(shù)組
5.3.1 創(chuàng)建數(shù)組
5.3.2 訪問(wèn)和修改數(shù)組
5.4 循環(huán)
5.5 定時(shí)器
5.5.1 設(shè)置一次性定時(shí)器
5.5.2 取消一次性定時(shí)器
5.5.3 設(shè)置重復(fù)定時(shí)器
5.5.4 取消重復(fù)定時(shí)器
第6個(gè)主題：HTML5中游戲開發(fā)中的JavaScript（高級(jí)）
6.1 DOM
6.1.1 HTML網(wǎng)頁(yè)示例
6.1.2 使用純JavaScript訪問(wèn)DOM
6.1.3 使用jQuery訪問(wèn)DOM
6.1.4 操作DOM
第7個(gè)主題： HTML5中的Canvas
7.1 認(rèn)識(shí)canvas元素
7.2 2D渲染上下文
7.2.1 坐標(biāo)系統(tǒng)
7.2.2 訪問(wèn)2D渲染上下文
7.3 繪制基本圖形和線條
7.3.1 線條
7.3.2 圓形
7.4 樣式
7.5 繪制文本
7.6 擦除Canvas
7.7 使Canvas填滿瀏覽器窗口
第8個(gè)主題： Canvas高級(jí)開發(fā)
8.1 保存和恢復(fù)繪圖狀態(tài)
8.1.1 畫布繪圖狀態(tài)是什么
8.1.2 保存繪圖狀態(tài)
8.1.3 恢復(fù)繪圖狀態(tài)
8.1.4 保存和恢復(fù)多個(gè)繪圖狀態(tài)
8.2 變形
8.2.1 平移
8.2.2 縮放
8.2.3 旋轉(zhuǎn)
8.2.4 變換矩陣
8.3 合成
8.3.1 全局阿爾法值
8.3.2 合成操作
8.4 陰影
8.5 漸變
8.6 復(fù)雜路徑
8.7 將畫布導(dǎo)出為圖像
第9個(gè)主題：html 5頁(yè)面中視頻和音頻
9.1發(fā)展歷程
9.2 目前狀況
9.2.1 視頻容器格式
9.2.2 視頻編解碼器
9.2.3 音頻編解碼器
9.2.4 當(dāng)前瀏覽器使用哪種組合
9.3 標(biāo)記
9.3.1 啟用本機(jī)控件
9.3.2 autoplay屬性
9.3.3 loop屬性
9.3.4 preload屬性
9.3.5 poster屬性
9.3.6 audio屬性
9.3.7 添加對(duì)多種視頻格式的支持
9.3.8 資源順序
9.3.9 關(guān)于Internet Explorer 6～8
9.3.10 MIME類型
9.4 用于網(wǎng)絡(luò)的視頻文件解碼
9.5 創(chuàng)建自定義控件
9.5.1 讓我們從一些標(biāo)記和設(shè)計(jì)開始
9.5.2 介紹媒體元素API
9.5.3 播放和暫停視頻
9.5.4 視頻音軌的靜音與取消靜音
9.5.5 視頻結(jié)束播放的響應(yīng)
9.5.6 更新視頻播放的時(shí)間
9.5.7 媒體元素API的其他一些功能
9.6 關(guān)于音頻
9.7 可訪問(wèn)的媒體
第10個(gè)主題：HTML5中的圖像處理
10.1 加載圖像
10.2 調(diào)整和裁剪圖像
10.2.1 調(diào)整圖像大小
10.2.2 裁剪圖像
10.2.3 陰影
10.3 圖像變形
10.3.1 平移
10.3.2 旋轉(zhuǎn)
10.3.3 縮放與翻轉(zhuǎn)
10.4 訪問(wèn)像素值
10.5 從零繪制圖像
10.5.1 隨機(jī)繪制像素
10.5.2 創(chuàng)建馬賽克效果
10.6 基本圖像效果
10.6.1 反轉(zhuǎn)顏色
10.6.2 灰度
10.6.3 像素化
第11個(gè)主題：制作動(dòng)畫
11.1 畫布中的動(dòng)畫
11.2 創(chuàng)建動(dòng)畫循環(huán)
11.2.1 循環(huán)
11.2.2 更新、清除、繪制
11.3 記憶要繪制的形狀
11.3.1 錯(cuò)誤的方法
11.3.2 正確的方法
11.3.3 隨機(jī)產(chǎn)生形狀
11.4 改變方向
11.5 圓周運(yùn)動(dòng)
11.5.1 三角函數(shù)
11.5.2 綜合運(yùn)用
11.6 反彈
第12個(gè)主題：實(shí)現(xiàn)高級(jí)動(dòng)畫
12.1 物理常識(shí)
12.1.1 什么是物理學(xué)
12.1.2 物理學(xué)對(duì)創(chuàng)建動(dòng)畫有何作用
12.1.3 基本概念
12.1.4 牛頓運(yùn)動(dòng)定律
12.2 運(yùn)用物理知識(shí)創(chuàng)建動(dòng)畫
12.2.1 準(zhǔn)備工作
12.2.2 速度
12.2.3 添加邊界
12.2.4 加速度
12.2.5 摩擦力
12.3 碰撞檢測(cè)
12.3.1 碰撞檢測(cè)
12.3.2 彈開物體
12.3.3 動(dòng)量守恒
第13個(gè)主題：注意力游戲
13.1 思路
13.2 關(guān)鍵需求
13.3 HTML5、CSS和JavaScript特性
13.3.1 表示撲克牌
13.3.2 使用Date 確定時(shí)間
13.3.3 提供暫�！�
13.3.4 繪制文本
13.3.5 繪制多邊形
13.3.6 洗牌
13.3.7 單擊牌的實(shí)現(xiàn)
13.3.8 防止某些作弊行為
13.4 構(gòu)建自己的應(yīng)用
13.5 測(cè)試和上傳應(yīng)用
第14個(gè)主題：小行星游戲
14.1 游戲概述
14.2 核心功能
14.2.1 創(chuàng)建HTML 代碼
14.2.2 美化界面
14.2.3 編寫JavaScript代碼
14.3 創(chuàng)建游戲?qū)ο蟆?BR>
14.3.1 創(chuàng)建小行星
14.3.2 創(chuàng)建玩家使用的火箭
14.4 檢測(cè)鍵盤輸入
14.4.1 鍵值
14.4.2 鍵盤事件
14.5 讓對(duì)象運(yùn)動(dòng)起來(lái)
14.6 假造橫向卷軸效果
14.6.1 循環(huán)利用小行星
14.6.2 添加邊界
14.6.3 讓玩家保持連續(xù)移動(dòng)
14.7 添加聲音
14.8 結(jié)束游戲
14.8.1 計(jì)分系統(tǒng)
14.8.2 殺死玩家
14.9 增加游戲難度 |
總部李老師