目前 Cocos Creator 3。0 越來越成熟，使用 Cocos Creator 做遊戲的小夥伴越來越多。我們在這裡整理了

現階段最全面、最優質的 Cocos Creator 3.x 的學習資料

，供大家參考、交流。歡迎加入 Cocos Creator 3。x 的大家庭！

https：//forum。cocos。org/t/topic/122399

PART 1

認識 Cocos Creator

Cocos Creator 編輯器

透過官方文件「新手上路」，瞭解一下 v3。x 編輯器。

「Cocos Creator下載安裝」

https：//docs。cocos。com/creator/3。2/manual/zh/getting-started/install/

「使用 Dashboard」

https：//docs。cocos。com/creator/3。2/manual/zh/getting-started/dashboard/

「編輯器介面介紹」

https：//docs。cocos。com/creator/3。2/manual/zh/editor/

「專案結構」

https：//docs。cocos。com/creator/3。2/manual/zh/getting-started/project-structure/

「入門指南合集：編輯器面板介紹影片」

https：//www。bilibili。com/video/BV14p4y1U7qH

Cocos Creator 引擎功能

Cocos Creator 裡的元件有什麼功能、能產生什麼效果、該如何去做，都可以透過下列的展示來了解。

「展示範例合集」：從基本元件的使用到渲染效果的展示，專案包括多個側重功能不同的場景及多個遊戲 Demo。

GitHub -

https：//github。com/cocos-creator/example-3d

Gitee -

https：//gitee。com/mirrors_cocos-creator/example-3d

「物理測試範例」：包含了一些物理測試例和案例工程，如吞噬黑洞、簡化小車、墜落小球等。

GitHub -

https：//github。com/cocos-creator/example-3d/tree/v3。0/physics-3d

Gitee -

https：//gitee。com/mirrors_cocos-creator/example-3d/tree/v3。0/physics-3d

「Simple-Games」：簡單小遊戲集合演示 Demo。

GitHub -

https：//github。com/cocos-creator/example-3d/tree/v3。0/simple-games

Gitee -

https：//gitee。com/mirrors_cocos-creator/example-3d/tree/v3。0/simple-games

「模組展示集合」：引擎各個功能的範例專案，基本涵蓋了引擎的大部分功能模組。

GitHub -

https：//github。com/cocos-creator/test-cases-3d

Gitee -

https：//gitee。com/mirrors_cocos-creator/test-cases-3d

「UI 展示 Demo」：各類 UI 元件組合使用的演示 Demo。

GitHub -

https：//github。com/cocos-creator/demo-ui/

Gitee -

https：//gitee。com/mirrors_cocos-creator/demo-ui/

PART 2

學語言

TypeScript

Cocos Creator v3。x 僅支援 TypeScript，以下內容將告訴你什麼是 TypeScript、為什麼要使用 TypeScript、TypeScript 與 JavaScript 的區別等。

「為什麼選擇使用 TypeScript？」

https：//forum。cocos。org/t/typescript/93014

「TypeScript 入門教程」

https：//github。com/xcatliu/typescript-tutorial

「X 分鐘速成 TypeScript」

https：//learnxinyminutes。com/docs/zh-cn/typescript-cn/

「Cocos Creator 3。0 TypeScript 問題答疑及經驗分享」

https：//forum。cocos。org/t/topic/106995

「TypeScript 官方網站」

https：//www。typescriptlang。org/

「TypeScript 中文網」

https：//www。tslang。cn/

「TypeScript - Classes」

https：//www。typescriptlang。org/docs/handbook/classes。html

「TypeScript - Decorators」

https：//www。typescriptlang。org/docs/handbook/decorators。html

「TypeScript - DefinitelyTyped」

http：//definitelytyped。org/

「TypeScript 開原始碼倉庫」

https：//github。com/Microsoft/TypeScript

影片教程

如果你更喜歡透過影片來進行學習，也可以參考以下內容：

「尚矽谷2021版 TypeScript 教程」

https：//www。bilibili。com/video/BV1Xy4y1v7S2

「黑馬程式設計師最新 TypeScript 入門影片」

https：//www。bilibili。com/video/BV1UD4y1m7Gw

「5天入門 TypeScript」

https：//www。bilibili。com/video/BV1K5411H7Sx

「從入門到精通全集入門 TypeScript」

https：//www。bilibili。com/video/BV1784y1c7V9

PART 3

專案實戰

當你對 Cocos Creator 引擎和 TypeScript 都有一定的瞭解，就可以透過優質實戰專案，來進行模仿學習。

專案實戰+原始碼-文字類

「一步兩步」

GitHub -

https：//github。com/cocos-creator/tutorial-mind-your-step-3d

Gitee -

https：//gitee。com/mirrors_cocos-creator/tutorial-mind-your-step-3d

「彈彈樂教程和原始碼分享」

https：//forum。cocos。org/t/3d/86001

「3D 打磚塊」

https：//forum。cocos。org/t/creator3d/84349

「不停歇的球」

「拇指射箭」

https：//forum。cocos。org/t/cocos-creator-3d/86278

「拇指投籃」

https：//forum。cocos。org/t/topic/86638

「螞蟻莊園運動會」

https：//forum。cocos。org/t/topic/85732

「懶貓跑酷」

http：//www。cxybb。com/article/koljy111/113825458#01hello_world_124

專案實戰+原始碼-影片類

「快上車」

https：//www。bilibili。com/video/BV1AE411j7L9

「懶貓跑酷」

https：//www。bilibili。com/video/BV11b4y1R7eJ

「奔跑吧巨人」

https：//www。bilibili。com/video/BV1i3411z7J7

「音樂彈球」

https：//www。bilibili。com/video/BV1fC4y1W7ve

「架木板」

https：//www。bilibili。com/video/BV1Bp4y1678M

「快打快逃」

https：//www。bilibili。com/video/BV1Qi4y17722

「開發 2D 模仿超級瑪麗類遊戲實錄」

https：//www。bilibili。com/video/BV18g411M7MU

「Snake VS Block 小遊戲教程」

https：//www。bilibili。com/video/BV1364y1f7ka

Cocos Store 完整專案

除此之外，Cocos Store 上也有許多完整遊戲專案，不僅包含原始碼、美術素材（3D模型，特效，動畫等）、策劃方案，有的還提供了配套的文字或影片教程。後續，官方也將不斷髮布更多不同型別的遊戲專案給到開發者，敬請關注。

「幽靈射手」

https：//store。cocos。com/app/detail/3218

「奔跑吧小仙女」

https：//store。cocos。com/app/detail/3126

「奔跑吧巨人」

https：//store。cocos。com/app/detail/3026

「快上車」

https：//store。cocos。com/app/detail/2796

免費美術資源

自己動手做的時候，有缺失美術資源的苦惱嗎？Cocos Store 也提供了許多免費美術素材，供大家使用。

「實拍和 3D 掃描的貼圖和模型資源」

https：//www。textures。com/library

「HDRI 全景貼圖首選資源，UE 官方文件推薦」

https：//polyhaven。com/hdris

「國內美術大神教程集合地」

https：//www。aboutcg。com/

「國內最大的美術資源論壇，集合資源、教程、作品分享、外掛筆刷等」

https：//www。element3ds。com/

「世界級的美術大神都在這裡，有大神自創的筆刷、外掛、shader、教程等可供下載」

https：//www。artstation。com/

「角色動畫動作捕捉資源庫」

https：//www。mixamo。com/

PART 4

特色功能

想要的功能和效果不知道如何實現？做出來的成品不太滿意？我們整理了一些特色功能實現教程供大家參考，說不定就能學到新的知識，靈感迸發。在此也感謝各位開發者的無私分享！

「簡單的卡通水體渲染教程」

https：//forum。cocos。org/t/topic/102227

「關於黑洞遊戲的簡易實現思路」

https：//forum。cocos。org/t/muzzik/95991

「3D 不規則地形行走」

https：//forum。cocos。org/t/topic/114586

「標誌板！教程」

https：//forum。cocos。org/t/topic/102891

「3D 換裝」

https：//forum。cocos。org/t/topic/113759

「2D 素材 3D 效果」

https：//forum。cocos。org/t/topic/101977

「摺紙效果 / 豎排文字」

https：//forum。cocos。org/t/topic/112045

「四元數與 3D 旋轉例項」

https：//forum。cocos。org/t/3d/99368

「彈性跟隨相機」

https：//forum。cocos。org/t/topic/104946

「3。x 2D 超大隨機地圖」

https：//forum。cocos。org/t/topic/115260

「FPS Demo」

https：//forum。cocos。org/t/topic/115260

「殘影效果」

https：//forum。cocos。org/t/muzzik-2-3d/94179

PART 5

知識進階

有了一定基礎後，就可以學習一些進階內容，以下是做一個 3D 遊戲應當深入瞭解的部分內容。

3D 遊戲

《3D數學基礎：圖形與遊戲開發》

《window遊戲程式設計大師技巧》

《3D遊戲程式設計大師技巧》

《遊戲引擎架構》

《OpenGL 程式設計指南》

《Real-Time Rendering 4th》

《Physically Based Rendering 3rd》

《WebGL程式設計指南》

Shader

「Creator Shader：從零開始」

https：//forum。cocos。org/t/topic/118989

「OpenGL 教程」

https：//learnopengl-cn。github。io/intro/

「WebGL 教程」

https：//webglfundamentals。org/webgl/lessons/zh_cn/

「GLSL 語法」

https：//thebookofshaders。com/02/？lan=ch

「Shader 基礎知識_法線貼圖」

https：//www。bilibili。com/video/BV12v411h7VM？from=search&seid=6090895175285310535

「Creator3D Shader 的正確姿勢」

https：//forum。cocos。org/t/topic/118989

「Shader 編寫示例」

https：//forum。cocos。org/t/cocos-2-3-shader/90789

「學習 Shader 的入門筆記」

https：//forum。cocos。org/t/shader/99677

「Shader Effect 系列」

https：//forum。cocos。org/t/topic/87889

「Shader 進行頭像圓角化處理」

https：//forum。cocos。org/t/topic/114780

「鏡面光澤（shader）」

https：//forum。cocos。org/t/shader/92342

「用 Shader 寫個完美的波浪」

https：//forum。cocos。org/t/topic/97927

「Creator3D 水紋及水波 Shader」

https：//forum。cocos。org/t/creator3d-shader/87339

「Creator3D：噪聲消融」

https：//forum。cocos。org/t/creator3d-shader14-/98460

「Creator3D：水面波浪」

https：//forum。cocos。org/t/creator3d-shader11-/98042

「Creator3D：心動效果」

https：//forum。cocos。org/t/creator3d-shader6-/97829

「MatCap Shader」

https：//www。bilibili。com/video/BV1B64y147xc

「跨引擎 Shader」

https：//www。bilibili。com/video/BV17y4y1W7j2

「Shader 進階專案 uv 動畫教程」

https：//www。bilibili。com/video/BV1j4411m782

「歡樂水杯（happy glass）的流體實現」

https：//www。bilibili。com/video/BV167411X7NG

「Shader3D 熔岩特效 3D」

https：//www。bilibili。com/video/BV1Y4411y7Ed

「Shader 入門實戰之噪聲紋理」

https：//forum。cocos。org/t/shader/97909

「飄揚的旗幟！Shader」

https：//forum。cocos。org/t/flag/88446

知識和學習是無窮的，問題和分享也是無窮的，感謝無私分享的 Cocos 開發者們，讓我們可以站在巨人的肩膀上進行學習。