![[threejs-journey] three.js之旅 | threejs journey](https://www.feifeiziyuan.com/wp-content/uploads/2022/08/1661099907-ff238a926175eb6-300x200.png)
three.js之旅
threejs journey
学习 Three.js的最佳方式
您是否曾经想创建令人惊叹的3D 网站？
在45 小时的视频中，本课程将教您使用Three.js创建最酷的WebGL网站的秘诀，无论您是初学者还是高级开发人员。
只需一门课程就能熟练掌握Three.js
加入Three.js之旅，您就可以终生学习包含39节课的完整且容易掌握的课程。
想看看包括哪些内容吗？请看下面的视频。
你会学到什么？
该课程是完整的，但初学者可以访问。我们将首先了解WebGL是什么以及为什么必须使用Three.js库。然后我们将发现 Three.js 的各种组件，一旦掌握了基础知识，我们将继续使用更先进的技术来显示数百万个粒子、添加物理、添加交互、创建星系、为汹涌的大海设置动画等等。
在课程结束时，您将对 Three.js 有深入的了解，并有足够的经验开始自己的项目。
作为奖励，我们还将学习如何使用 3D 软件Blender来创建我们自己的模型。
添加一个调试面板来调整您的环境并为所有内容设置动画。
- 介绍
-
什么是 WebGL 以及为什么使用 Three.js
- 基本场景
- webpack
- 变换对象
- 动画
- 相机
- 全屏和调整大小
- 几何形状
- 调试界面
- 纹理
- 材料
- 3D文字
- 上线
02 经典技术 用各种灯光照亮您的场景，开始练习环境创建并创建数百万个粒子
- 灯
-
阴影
- 鬼屋
- 粒子
- 银河发电机
- 光线施法者
- 基于滚动的动画
03 先进技术
将物理添加到您的世界中，以便物体开始碰撞和绊倒。然后导入你自己用 Blender 制作的模型，让它看起来尽可能逼真。
- 物理
- 引入模型
- 使用Blender的自定义模型
- 逼真的渲染
- 大型项目的代码结构
04 着色器
使用 Three.js 材料很棒，但创建自己的材料更好。
学习着色器语言以释放 WebGL 的真正力量并创造令人惊叹的体验！
- 着色器
- 着色器模式
- 汹涌的大海
- 动画银河
- 改性材料
05 额外的
如果大多数计算机都无法运行它，那么创建一个很酷的 WebGL 体验是没有用的。
了解如何监控和优化性能以实现最佳帧速率。
- 后期处理
- 性能提示
- 介绍和加载进度条
- 混入HTML和WebGL
- 在Blender中创建场景
- 烘培和导出场景
- 导入和优化场景
- 为场景添加细节
Chapter 01
Basics
01. Introduction
35:24
02. What is WebGL and why use Three.js
23:56
03. First Three.js Project
01:19:27
04. Transform objects
46:12
05. Animations
30:26
06. Cameras
57:55
07. Fullscreen and resizing
30:41
08. Geometries
35:00
09. Debug UI
48:17
10. Textures
01:14:57
11. Materials
01:21:19
12. 3D Text
44:29
13. Go live
24:29
14. Lights
42:02
15. Shadows
01:00:44
16. Haunted House
01:15:48
17. Particles
49:51
18. Galaxy Generator
01:08:47
19. Scroll based animation
01:23:01
Chapter 03
Advanced techniques
20. Physics
01:57:38
21. Imported models
01:07:37
22. Raycaster and Mouse Events
01:07:31
23. Custom models with Blender
01:59:45
24. Environment map
01:49:33
25. Realistic render
01:12:21
26. Code structuring for bigger projects
03:19:40
Chapter 04
Shaders
27. Shaders
02:17:57
28. Shader patterns
01:49:25
29. Raging sea
01:15:33
30. Animated galaxy
01:14:11
31. Modified materials
51:55
32. Coffee Smoke
01:25:07 new
33. Hologram
01:21:18 new
34. Fireworks
01:47:28 new
35. Lights Shading
01:17:09 new
36. Raging Sea Shading
57:02 new
37. Halftone Shading
56:04 new
38. Earth
01:40:43 new
39. Particles Cursor Animation
01:48:08 new
40. Particles Morphing
01:35:12 new
41. GPGPU Flow Field Particles
02:22:59 new
42. Wobbly Sphere
01:16:27 new
43. Sliced Model
01:03:59 new
44. Procedural Terrain
01:24:18 new
Chapter 05
Extra
45. Post-processing
01:36:39
46. Performance tips
01:12:24
47. Intro and loading progress
49:54
48. Mixing HTML and WebGL
58:07
Chapter 06
Portal Scene
49. Creating a scene in Blender
02:04:52
50. Baking and exporting the scene
02:11:58
51. Importing and optimizing the scene
46:55
52. Adding details to the scene
01:34:51
Chapter 07
React Three Fiber
53. What are React and React Three Fiber
25:50
54. First React Application
04:23:01
55. First R3F Application
02:05:24
56. Drei
01:14:15
57. Debug
51:44
58. Environment and Staging
02:02:06
59. Load models
01:29:57
60. 3D Text
59:13
61. Portal Scene
41:54
62. Mouse Events
47:15
63. Post-processing
01:53:21
64. Fun and Simple Portfolio
51:20
65. Physics
02:11:34
66. Create a game
04:01:51
67. The end
03:50
2022/11/13 更新react three fiber
2022/12/2 补全12章节materials 缺少的图片和视频
2022/12/5 文字版12章节后面的忘记上传了 补全了下
2023/03/01 作者更新了Shaders部分 从54节更新到67节
2023/03/02 33、36、37、41、43、44 视频源更换为1920*1080
2023/06/24 因为作者把webpack替换成了vite 还有课程顺序的替换 所以重新整理了视频 字幕替换为官网的英文字幕 文字版整理了1-26节
2024/10/10 更新 完整的文字版
2024/12/22 字幕更新为官方字幕
评论(5)
之前用现金买的时候没登录，现在看不了了，订单号还在。
qq 或者微信 联系我下吧
字幕有点问题能重新整理一下吗，有的对不上有的用法语字幕
可以 现在有官网的字幕 不过需要过段时间
好的，感谢