
Delete the default content, add a plane, and enter edit mode to extrude edges that form all dice faces. Scale the flaps with individual origins for precise rigging.
Create an armature in Blender by entering edit mode, extruding bones along the Y axis from head to tail, and aligning them over the figure before returning to object mode.
Assign the armature to the mesh with empty groups, create vertex groups named after bones, and assign edges to those groups; then test bone rotation in pose mode.
Create and apply a new material in blender, adjust the base color to an image texture, and map six dice face images onto the figure.
Select the dice figure, enter edit mode, assign textured materials to each face, then unwrap with u to correct texture positions, repeating for every face.
Define movable bones by adding custom properties to selected bones in Blender’s armature, then use the properties with Javascript to distinguish which bones move.
Add a point light in Blender object mode, move it up in front view, and set its power to 4. Duplicate and reposition the light to create a lighting setup.
Set up a Three.js scene to load a glb model, enable orbit controls, and use TransformControls to rotate bones with local space, snapping rotations and preventing overlaps.
Explore rigging practices for Blender and Three.js and illustrate the results of applying these techniques to character rigs across both platforms.
Create a base arm and hand starting from a cube in Blender, extruding and beveling edges to prep flexing joints for rigging in Blender and Three.js.
Add a new material and a different base color for the figure. Enter edit mode, press three to select arm faces, assign the second material, and return to object mode.
Create and shape an armature for a claw rig by entering edit mode, extruding bones along z axis, and mirroring for left and right sides with wireframe and x-ray views.
Assign the shape to the armature with automatic weights, then verify bone influence in pose mode by rotating a bone and undoing changes, returning to object mode.
Learn to implement inverse kinematics in Blender by creating and detaching bones in edit mode, then applying an IK constraint in pose mode with a target armature to verify movement.
Use shift a to add a point light, move it to the top, and set power to 5. Duplicate light with shift d and place copy at the bottom.
Create and export a base FABRIK class for Blender and Three.js, wiring tip, root, effector, and target, with root position and tolerance checks plus final-to-root, root-to-final, and look-at utilities.
Create target_position and effector_position in the FABRIK class CheckDistanceTolerance, compute distance with distanceTo from distance_float, and compare it to tolerance to return the result.
Execute the FABRIK class FinalToRoot by computing target_position from target and tail_position from effector, iterating current_bone to set next_tail_position and child, and applying CustomLookAtTarget and CustomSetWorldPositionAt.
Create a CustomLookAtTarget in the FABRIK class by computing bone_position and bone_direction with subVectors and normalize, derive rotation via cross and angle, and update bone.rotation when angle is numeric.
Execute CustomSetWorldPositionAt to compute bone_position and direction using subVectors and normalize, measure distances with distanceTo to tail_position and target_position, and update bone.position in the scene.
Create the root-to-final FABRIK workflow by defining a parent variable, setting it to root.parent, adding root to the scene, adjusting root position with root_position, and attaching root to the parent.
implement a three.js setup using FABRIK, GLTFLoader, and OrbitControls; map bones to fabrik targets, add TransformControls, and drive an animation loop to update the scene.
Master practical rigging techniques for Blender and Three.js to achieve reliable character animation results, combining cross-platform workflows and rigging best practices.
Hello and welcome.
If you are a web developer who is interested in using 3D models for a website or if you are a 3D model designer and want to know how to prepare a basic scenario so that it can be exported and used in other applications, this course may be for you.
This course is oriented to put into practice the knowledge of rigging armatures in blender and use them with three.js through exercises.
In this course, you will learn:
How to do basic modeling in Blender.
How to do basic rigging in Blender.
Export the scene we created in blender to be used in different applications.
Create a basic html page to display our work in Blender.
Using Three.js to display a 3D scene
Load in the html page our model using Three.js
How to read and use the armature and bones with Javascript
How to prepare Visual Studio Code to work with our Three.js project
Using Webpack to export the project
View the project on a local server
In addition, you will find these lessons attractive because they can serve as a basis to start creating a web page that can be used as a portfolio to display 3D figures that you have previously created.
Also for developers, these lessons can be attractive to learn how to use elements within a 3D model and modify them using JavaScript.
I hope you enjoy the videos and can use what you learn for your personal projects.
Have fun