/blender-web-pipeline
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
$ npx -y skills add freshtechbro/claudedesignskills --skill blender-web-pipeline --agent claude-codeHow it fires
How this skill gets triggered: by you, by Claude, or both.
- Fires itselfAuto-invocation. Claude auto-loads it when your prompt matches the work.Auto-invocation is when the right skill fires by itself at the right moment, driven by a FLOW.md router and a hook, instead of you invoking it by name. It is the difference between a skill being installed and a skill actually getting used.Read the full definition →
- You can call itInvoke it directly when you want it.
- Slash command
/blender-web-pipeline
Context preview
The summary Claude sees to decide when to auto-load this skill.
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
SKILL.md
blender-web-pipeline.SKILL.mdname: blender-web-pipeline
description: 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 tasks involving Blender glTF export, bpy scripting, 3D asset optimization, model compression, texture baking, or Blender automation. Exports models for threejs-webgl, react-three-fiber, and babylonjs-engine skills.
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:**
.gltf = JSON + external .bin + external textures
.glb = Single binary file (recommended for web)
Blender Python API (bpy)
**Access Blender data and operations via Python:**
import bpy
# Access scene data
scene = bpy.context.scene
objects = bpy.data.objects
# Modify objects
obj = bpy.data.objects['Cube']
obj.location = (0, 0, 1)
obj.scale = (2, 2, 2)
# Export glTF
bpy.ops.export_scene.gltf(
filepath='/path/to/model.glb',
export_format='GLB'
)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)
# Blender Python Console or script
import bpy
# Select objects to export (optional - exports all if none selected)
bpy.ops.object.select_all(action='DESELECT')
bpy.data.objects['MyModel'].select_set(True)
# Export as GLB
bpy.ops.export_scene.gltf(
filepath='/path/to/output.glb',
export_format='GLB', # Binary format
use_selection=True, # Export selected only
export_apply=True, # Apply modifiers
export_texcoords=True, # UV coordinates
export_normals=True, # Normals
export_materials='EXPORT', # Export materials
export_colors=True, # Vertex colors
export_cameras=False, # Skip cameras
export_lights=False, # Skip lights
export_animations=True, # Include animations
export_draco_mesh_compression_enable=True, # Compress geometry
export_draco_mesh_compression_level=6, # 0-10 (6 recommended)
export_draco_position_quantization=14, # 8-14 bits
export_draco_normal_quantization=10, # 8-10 bits
export_draco_texcoord_quantization=12 # 8-12 bits
)2. Python Script for Batch Export
#!/usr/bin/env blender --background --python
"""
Batch export all .blend files in a directory to glTF
Usage: blender --background --python batch_export.py -- /path/to/blend/files
"""
import bpy
import os
import sys
# Get command line arguments after --
argv = sys.argv
argv = argv[argv.index("--") + 1:] if "--" in argv else []
input_dir = argv[0] if argv else "/path/to/models"
output_dir = argv[1] if len(argv) > 1 else input_dir + "_gltf"
# Create output directory
os.makedirs(output_dir, exist_ok=True)
# Find all .blend files
blend_files = [f for f in os.listdir(input_dir) if f.endswith('.blend')]
print(f"Found {len(blend_files)} .blend files")
for blend_file in blend_files:
input_path = os.path.join(input_dir, blend_file)
output_name = blend_file.replace('.blend', '.glb')
output_path = os.path.join(output_dir, output_name)
print(f"Processing: {blend_file}")
# Open blend file
bpy.ops.wm.open_mainfile(filepath=input_path)
# Export as GLB with optimizations
bpy.ops.export_scene.gltf(
filepath=output_path,
export_format='GLB',
export_apply=True,
export_draco_mesh_compression_enable=True,
export_draco_mesh_compression_level=6
)
print(f" Exported: {output_name}")
print("Batch export complete!")**Run batch script:**
blender --background --python batch_export.py -- /models/source /models/output
3. Optimize Model for Web (Decimation)
import bpy
def optimize_mesh(obj, target_ratio=0.5):
"""Reduce polygon count using decimation modifier."""
if obj.type != 'MESH':
return
# Add Decimate modifier
decimate = obj.modifiers.new(name='Decimate', type='DECIMATE')
decimate.ratio = target_ratio # 0.5 = 50% of original polygons
decimate.use_collapse_triangulate = True
# Apply modifier
bpy.context.view_layer.objects.active = obj
bpy.ops.object.modifier_apply(modifier='Decimate')
print(f"Optimized {obj.name}: {len(obj.data.polygons)} polygons")
# Optimize all selected meshes
for obj in bpy.context.selected_objects:
optimize_mesh(obj, target_ratio=0.3)4. Texture Baking for Web
import bpy
def bake_textures(ob
Read more
name: blender-web-pipeline description: 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 tasks involving Blender glTF export, bpy scripting, 3D asset optimization, model compression, texture baking, or Blender automation. Exports models for threejs-webgl, react-three-fiber, and babylonjs-engine skills.
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:**
.gltf = JSON + external .bin + external textures .glb = Single binary file (recommended for web)
Blender Python API (bpy)
**Access Blender data and operations via Python:**
import bpy
# Access scene data
scene = bpy.context.scene
objects = bpy.data.objects
# Modify objects
obj = bpy.data.objects['Cube']
obj.location = (0, 0, 1)
obj.scale = (2, 2, 2)
# Export glTF
bpy.ops.export_scene.gltf(
filepath='/path/to/model.glb',
export_format='GLB'
)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)
# Blender Python Console or script
import bpy
# Select objects to export (optional - exports all if none selected)
bpy.ops.object.select_all(action='DESELECT')
bpy.data.objects['MyModel'].select_set(True)
# Export as GLB
bpy.ops.export_scene.gltf(
filepath='/path/to/output.glb',
export_format='GLB', # Binary format
use_selection=True, # Export selected only
export_apply=True, # Apply modifiers
export_texcoords=True, # UV coordinates
export_normals=True, # Normals
export_materials='EXPORT', # Export materials
export_colors=True, # Vertex colors
export_cameras=False, # Skip cameras
export_lights=False, # Skip lights
export_animations=True, # Include animations
export_draco_mesh_compression_enable=True, # Compress geometry
export_draco_mesh_compression_level=6, # 0-10 (6 recommended)
export_draco_position_quantization=14, # 8-14 bits
export_draco_normal_quantization=10, # 8-10 bits
export_draco_texcoord_quantization=12 # 8-12 bits
)2. Python Script for Batch Export
#!/usr/bin/env blender --background --python
"""
Batch export all .blend files in a directory to glTF
Usage: blender --background --python batch_export.py -- /path/to/blend/files
"""
import bpy
import os
import sys
# Get command line arguments after --
argv = sys.argv
argv = argv[argv.index("--") + 1:] if "--" in argv else []
input_dir = argv[0] if argv else "/path/to/models"
output_dir = argv[1] if len(argv) > 1 else input_dir + "_gltf"
# Create output directory
os.makedirs(output_dir, exist_ok=True)
# Find all .blend files
blend_files = [f for f in os.listdir(input_dir) if f.endswith('.blend')]
print(f"Found {len(blend_files)} .blend files")
for blend_file in blend_files:
input_path = os.path.join(input_dir, blend_file)
output_name = blend_file.replace('.blend', '.glb')
output_path = os.path.join(output_dir, output_name)
print(f"Processing: {blend_file}")
# Open blend file
bpy.ops.wm.open_mainfile(filepath=input_path)
# Export as GLB with optimizations
bpy.ops.export_scene.gltf(
filepath=output_path,
export_format='GLB',
export_apply=True,
export_draco_mesh_compression_enable=True,
export_draco_mesh_compression_level=6
)
print(f" Exported: {output_name}")
print("Batch export complete!")**Run batch script:**
blender --background --python batch_export.py -- /models/source /models/output
3. Optimize Model for Web (Decimation)
import bpy
def optimize_mesh(obj, target_ratio=0.5):
"""Reduce polygon count using decimation modifier."""
if obj.type != 'MESH':
return
# Add Decimate modifier
decimate = obj.modifiers.new(name='Decimate', type='DECIMATE')
decimate.ratio = target_ratio # 0.5 = 50% of original polygons
decimate.use_collapse_triangulate = True
# Apply modifier
bpy.context.view_layer.objects.active = obj
bpy.ops.object.modifier_apply(modifier='Decimate')
print(f"Optimized {obj.name}: {len(obj.data.polygons)} polygons")
# Optimize all selected meshes
for obj in bpy.context.selected_objects:
optimize_mesh(obj, target_ratio=0.3)4. Texture Baking for Web
import bpy def bake_textures(ob
Professional design agency skillstack for 3D/WebGL, animation, and modern web development Claude Code plugin marketplace providing comprehensive coverage of modern web technologies including Three.js, GSAP, React Three Fiber, Framer Motion, Babylon.js, and
Repo: freshtechbro/claudedesignskills
Other skills on claudedesignskills.
- /aframe-webxr
Declarative web framework for building browser-based 3D, VR, and AR experiences using HTML and entity-component architecture. Use this skill when creating WebXR applications, VR experiences, AR experiences, 360-degree media viewers, or immersive web content with minimal
Open skill - /animated-component-libraries
Pre-built animated React component collections combining Magic UI (150+ TypeScript/Tailwind/Motion components) and React Bits (90+ minimal-dependency animated components). Use this skill when building landing pages, marketing sites, dashboards, or interactive UIs requiring
Open skill - /animejs
Versatile JavaScript animation engine for DOM, CSS, SVG, and JavaScript objects. Use when creating timeline-based animations, stagger effects, SVG morphing, keyframe sequences, or complex choreographed animations. Triggers on tasks involving Anime.js, timeline animations,
Open skill - /babylonjs-engine
Comprehensive skill for Babylon.js 3D web rendering engine. Use this skill when building real-time 3D experiences, browser-based games, interactive visualizations, or immersive web applications. Triggers on tasks involving Babylon.js, 3D scenes, WebGL/WebGPU rendering,
Open skill - /barba-js
Page transitions library for creating fluid, smooth transitions between website pages. Use this skill when implementing page transitions, creating SPA-like experiences, adding animated route changes, or building websites with smooth navigation. Triggers on tasks involving
Open skill - /gsap-scrolltrigger
Comprehensive skill for GSAP (GreenSock Animation Platform) and ScrollTrigger plugin. Use this skill when creating web animations, scroll-driven experiences, timelines, tweens, scroll-triggered animations, pinning, scrubbing, parallax effects, or animating DOM elements, SVG,
Open skill

