Create stunning visualizations and 3D scenes using the Three.js library
About This Video
Learn to use the most popular WebGL library to display amazing 3D effects in any modern browser
The course takes you step-by-step from creating simple shapes to complex geometry, lighting, and animation.
Gives you a deep understanding of the library to prepare you for developing your own content
In Detail
Three.js is the most popular JavaScript library …
Hands-on Three.js 3D Web Visualisations
Video description
Create stunning visualizations and 3D scenes using the Three.js library
About This Video
Learn to use the most popular WebGL library to display amazing 3D effects in any modern browser
The course takes you step-by-step from creating simple shapes to complex geometry, lighting, and animation.
Gives you a deep understanding of the library to prepare you for developing your own content
In Detail
Three.js is the most popular JavaScript library for displaying 3D content on the web, giving you the power to display incredible models, games, music videos, and scientific/data visualizations in your browser and even on your smartphone! This course begins with a 3D beginner-level primer to 3D concepts and some basic examples to get you started with the most important features that Three.js has to offer. You'll learn how to quickly create a scene, camera, and renderer and how to add meshes using the Geometry primitives included with the library. You'll explore troubleshooting steps that will focus on some of the common pitfalls developers face. You'll learn the very sophisticated animation system included with the library. The course concludes by introducing post-processing, essentially adding filters to your rendered scene, and GLSL, the shading language that is used by all materials included with the library. You'll see how creating your materials is easier than you'd imagine using GLSL. By the end of this course, you'll be able to quickly add advanced features to your 3D scenes, improve the way users interact with them, and make them look stunning.
Audience
If you are a JavaScript developer and want to learn how to use the Three.js library to create 3D graphics in your browser, then this course is for you!
Chapter 1 : Build Your First 3D Web Page with THREE.js
The Course Overview
Introducing the THREE.js website
3D Basics
Your first THREE.js web page`
The THREE.js Editor
Debugging Your Pages
Chapter 2 : Geometry and Materials
Let’s Keep It Simple: Starting with a Box
Materials One – Basic and Wireframe
Spheres and Cylinders
Materials Two – Lambert and Phong
Cones and Tori
Chapter 3 : Scene Hierarchy and Cameras
Scene Hierarchy
Perspective Camera
Orthographic Camera
Dummy Cameras and Lerping
Complex Camera Paths
Chapter 4 : Lights and Shadows
Ambient and Hemisphere Lighting
Directional and Point Lighting
Spot and RectArea Lighting
Adding Shadows to Your Scenes
Physically Correct Lighting
Chapter 5 : Sourcing, Creating, and Loading Assets
Online Sources of 3D Assets
Using Blender with THREE.js
The GLTFLoader Class
The FBXLoader Class
LatheGeometry and ExtrudeGeometry
Chapter 6 : The THREE.js Animation System
The Basics of the Animation System
Skinned Meshes
Switching and Blending Animations
Splitting an Animation Clip
A WASD Control System for a Player Character
Chapter 7 : Post Processing and GLSL
THREE.js Post Processing
Introducing GLSL – ShaderMaterial
Introducing GLSL – Vertex Shaders
Introducing GLSL – Importance of Noise Function
Introducing GLSL – Textures
Start your Free Trial Self paced Go to the Course We have partnered with providers to bring you collection of courses, When you buy through links on our site, we may earn an affiliate commission from provider.
This site uses cookies. By continuing to use this website, you agree to their use.I Accept