Three.js From Zero · Article s6-07

S6-07 Blender Export

Season 6 · Article 07

Blender Export Pipeline for Three.js

Blender's glTF exporter is excellent. But there are 20 settings, 5 material gotchas, and 3 animation traps. A checklist so your artist's file actually works in Three.js.

1. The basics

File → Export → glTF 2.0 (.glb/.gltf). In modern Blender (3.x+), this is built in.

2. The settings that matter

Format:           glTF Binary (.glb)     ← one file, smaller
Include:
  Limit to:       Selected + Visible      ← skip dev clutter
  Custom Properties: on if using IDs
  Cameras:        on if defining shots
  Punctual Lights: on for lights
Transform:
  +Y Up:          on  ← glTF convention
Data/Mesh:
  Apply Modifiers: on   ← bake subsurf, arrays, booleans
  UVs:             on
  Normals:         on
  Tangents:        on if using normal maps
  Vertex Colors:   on if you use them
  Compression:     Draco on (level 7 typical)
Data/Material:
  Images:          Automatic or Optimized
  Format:          AUTO   ← keeps PNG for alpha, JPG otherwise
Data/Animation:
  Export:          on
  Shape Keys:      on if you have them
  Bake All Actions:on for multi-take

3. The "Principled BSDF" shader rule

glTF exports ONLY the Principled BSDF material. Custom shader nodegraphs? Baked or ignored.

Connect your textures to Principled BSDF inputs:

  • Base Color → baseColorTexture
  • Metallic → metallicRoughnessTexture.b channel
  • Roughness → metallicRoughnessTexture.g
  • Normal → normalTexture (always through a Normal Map node)
  • Emission + Emission Strength → emissiveTexture + factor
  • Alpha → alpha channel of base color texture

4. Common pitfalls

Missing normals / dark shading: apply modifiers before export. Subsurf modifiers need baking.
Strange rotation: enable "+Y Up." Blender is Z-up; glTF is Y-up. Exporter converts, but only if the checkbox is on.
Gigantic textures: Blender packs full-res. Run gltf-transform to resize/compress after export.
Lost animations: check Bake All Actions in export. Otherwise only the current Action exports.
Armature in T-pose doesn't play: enable "Always Sample Animations" and "Bake All Actions."

5. Materials that DO port

Blender nodeglTF slot
Principled BSDFCore PBR
Normal MapNormal texture
Emission + StrengthKHR_materials_emissive_strength
TransmissionKHR_materials_transmission
Specular (in Principled)KHR_materials_specular
SheenKHR_materials_sheen
ClearcoatKHR_materials_clearcoat

6. Materials that DO NOT port

  • Procedural nodes (Voronoi, Musgrave, etc.) — must be baked to a texture first.
  • Mix shaders combining BSDFs (e.g., glass + diffuse mixed by Fresnel) — only one PBR BSDF gets through.
  • Shader→Shader→... custom nodegraphs — baked or lost.
  • Cycles-only ray features (Principled Volume, etc.) — ignored.

7. Multiple UV maps

glTF supports TEXCOORD_0, TEXCOORD_1. Map #1 is typically for lightmaps (after baking).

  • Blender: UV menu → make a second UV. Auto-unwrap.
  • Lightmap bake: Cycles → Bake → Diffuse + lightmap.
  • In Three.js: set material.lightMap, ensure uv2 attribute exists.

8. Scale / unit gotchas

Blender default is meters. Mixamo FBX is often centimeters. If your character is 0.01m tall in Three.js, it's a cm→m conversion bug.

9. Export checklist (save as a text file)

[ ] Apply all modifiers (Ctrl+A on each)
[ ] Origin at feet / center of mass
[ ] Clear parents + clean transforms (Ctrl+A → Location/Rotation/Scale)
[ ] +Y Up checkbox on
[ ] Materials: Principled BSDF only
[ ] Textures packed OR relative paths
[ ] Armature in rest pose at frame 0
[ ] Actions named + marked Fake User (shield icon)
[ ] Bake All Actions on
[ ] Format: glb
[ ] Run gltf-transform inspect && validate after export

10. Python scripting

import bpy
bpy.ops.export_scene.gltf(
  filepath='/path/out.glb',
  export_format='GLB',
  export_apply=True,
  export_yup=True,
  export_animations=True,
  export_draco_mesh_compression_enable=True,
)

Run in Blender's script editor or via blender --background --python export.py for CI.

11. Takeaways

  • Principled BSDF or nothing. Other shaders don't port.
  • +Y Up is mandatory.
  • Apply modifiers before export.
  • Bake All Actions for animation.
  • Always gltf-transform after. Never ship raw Blender output.

Concept article — Blender export is an offline workflow. See S6-10 for the end-to-end pipeline demo.