Blender to web export workflows for 3D models and animations. Use this skill when exporting Blender models to glTF for web, optimizing 3D assets for Three.js or Babylon.js, batch processing models with Python scripts, automating Blender workflows, or creating web-ready 3D pipelines. Triggers on task

Blender Web Pipeline Overview Blender Web Pipeline skill provides workflows for exporting 3D models and animations from Blender to web optimized formats (primarily glTF 2.0). It covers Python scripting for batch processing, optimization techniques for web performance, and integration with web 3D libraries like Three.js and Babylon.js. When to use this skill: Exporting Blender models for web applications Batch processing multiple 3D assets Optimizing file sizes for web delivery Automating repetitive Blender tasks Creating production pipelines for 3D web content Converting legacy formats to glTF Key capabilities: glTF 2.0 export with optimization Python (bpy) automation scripts Texture baking and compression LOD (Level of Detail) generation Batch processing workflows Material and lighting optimization for web Core Concepts glTF 2.0 Format Why glTF for Web: Industry standard 3D format for web Efficient binary encoding (.glb) PBR materials support Animation and skinning Extensible with custom data Wide library support (Three.js, Babylon.js, etc.) glTF vs GLB: Blender Python API (bpy) Access Blender data and operations via Python: Web Optimization Goals Target Metrics: File size: <5 MB per model (ideal <1 MB) Polygon count: <50k triangles for real time Texture resolution: 2048x2048 max (1024x1024 preferred) Draw calls: Minimize via texture atlases Load time: <2 seconds on average connection Common Patterns 1. Basic glTF Export (Manual) 2. Python Script for Batch Export Run batch script: 3. Optimize Model for Web (Decimation) 4. Texture Baking for Web 5. Generate LOD (Level of Detail) 6. Export with Texture Compression 7. Command Line Automation Integration Patterns With Three.js With React Three Fiber With Babylon.js Optimization Techniques 1. Geometry Optimization Decimate Modifier: Merge by Distance: Triangulate Faces: 2. Texture Optimization Image Compression: Texture Atlas: 3. Material Simplification Convert to PBR: Common Pitfalls 1. Large File Sizes Problem: Exported .glb files are 20+ MB Solutions: Enable Draco compression (60 90% reduction) Reduce texture resolution (2048 → 1024 or 512) Use JPEG instead of PNG for textures Decimate geometry (target <50k triangles) Remove unused materials/textures 2. Missing Textures in Export Problem: Textures don't appear in web viewer Solutions: Ensure all images are saved (not packed) Use relative paths for textures Export with "Export Images" enabled Check image format compatibility (PNG/JPEG) 3. Animations Not Playing Problem: Animations don't export or play incorrectly Solutions: Ensure animations are on timeline (not NLA strips) Export with "Export Animations" enabled Check animation actions are assigned to objects Use "Bake Actions" for complex rigs 4. Materials Look Different Problem: Materials render differently in web vs Blender Solutions: Use Principled BSDF (maps to glTF PBR) Avoid custom shader nodes (won't export) Use supported texture types (Base Color, Metallic, Roughness, Normal, Emission) Test in glTF viewer before deploying 5. Slow Export Times Problem: Export takes 10+ minutes Solutions: Apply modifiers before export (don't export non destructively) Reduce geometry complexity Remove unused data (orphan cleanup) Use command line export (faster than GUI) 6. Performance Issues in Browser Problem: Model lags in browser Solutions: Generate LODs (Level of Detail) Use instancing for repeated objects Limit draw calls (merge objects, texture atlases) Reduce polygon count (<50k triangles) Optimize shaders (avoid transparency/refraction) Best Practices Pre Export Checklist Export Settings Resources This skill includes: scripts/ batch export.py Batch export .blend files to glTF optimize model.py Optimize geometry and textures for web generate lods.py Generate LOD copies automatically references/ gltf export guide.md Complete glTF export reference bpy api reference.md Blender Python API quick reference optimization strategies.md Detailed optimization techniques assets/ export template.blend Pre configured export template shader library/ Web optimized PBR shaders Related Skills threejs webgl Load and render exported glTF models in Three.js react three fiber Use glTF models in React applications babylonjs engine Alternative 3D engine for web playcanvas engine Game engine that supports glTF import

blender-web-pipeline