#3/6 ThreeJS animation 3d model (running 2 animations). Animating the Mandalorian in Blender

Опубликовано: 02 Октябрь 2024
на канале: Inverser Pro
353
11

#threejs #blender #webgl #glb #js
CodePen:
https://codepen.io/inverser/pen/poQEWrV

Subscribe, put your fingers up, press the bell, make the old man happy!

Source (full version of the code, NOT FROM THIS LESSON): https://github.com/inverser-pro/three...

Source code for this tutorial:
https://github.com/inverser-pro/three...

File HDR:
https://github.com/inverser-pro/three...

Mandalorian model file (with animation), without helmet:
https://github.com/inverser-pro/three...

   • #0 THREEJS от 0 до PRO уровня БЕЗ ОПЛ...  
Playlist by Three.JS ^

Previous video:
https://youtube.com/live/UCnH5Qm-BWo
Other videos on animation in Blender:
   • Создание и анимация игрового персонаж...  
   • Параметрическая анимация походки перс...  
   • Анимация ходьбы 3D персонажа в Бленде...  
   • Кости и арматуры | Основы анимации в ...  


00:00-00:24 What will be the result of the lesson?
00:24 Features of the Mandalorian 3D model (Blender)
06:05 Optimization of the Mandalorian model
07:23 (1) Let's get started with the ThreeJS code
08:10 I remind you how to import a GLB model from Blender for ThreeJS
11:05 ThreeJS AnimationMixer - enable 3D model animations on the WEBGL stage
15:52 ThreeJS speed control of 3D model animation
19:43 (task) How to make the animation stop (disable cycling)
23:34 Hack to rewind animation to the beginning when starting a scene
23:59 (solution - method) output 'mixer' itself to the console
28:04 Solution (code) on how to stop the animation from looping
29:21 Results on the scene code
33:48 Features of connecting an environment map (envMap) to the model
43:17 (2) Blender: features of character animation, creating a skeleton
46:03 Features of “weight” when creating a skeleton
50:36 I decided to show the code first and then use Blender
51:27 Automatic generation of character skeleton
55:22 Adding additional bones for the character
59:20 Linking a skeleton to a character in Blender
1:01:07 Features of the distribution of automatically added “weight”
1:07:16 Features of animation of a specific bone in Blender
1:16:28 Features of the transition from one animation to another in ThreeJS (Blender)
1:20:23 Character environment on the ThreeJS stage (fields, mountains) - map for the sphere
1:29:30 Watch other videos. See you!
ThreeJS Animation
   • THREE.js Animation System  

Множество ссылок по теме:
https://three.inverser.pro/links