Skip to content

Three Blender is now released! v0.1

Latest
Compare
Choose a tag to compare
@ppmpreetham ppmpreetham released this 04 Mar 14:20
· 4 commits to main since this release

banner

Three Blender

Introducing THREEEE BLENDERRRR! View your Blender scenes on the web in realtime! This addon automatically converts your Blender project into web-compatible Three.js code. Bridge the gap between 3D modeling in Blender and web-based visualization with just one click. Share your creations online effortlessly.

First Public Release

I'm excited to announce the first public release of the Three Blender for Blender! After months of development and testing, it is now available for artists and developers who want to showcase their Blender creations on the web.

What's included in this release:

Core Functionality

  • Complete Blender to Three.js scene conversion with a simple UI
  • Preservation of cameras, lights, and meshes
  • GLTF/GLB export with proper transformation settings
  • Interactive orbit controls for scene exploration
  • Responsive design that adapts to browser window size

Light Types Support

  • Point lights with proper intensity and color
  • Spot lights with targeting and shadow casting
  • Area lights converted to Three.js DirectionalLights
  • Light position and orientation preservation

Camera Features

  • Multiple camera support with correct field of view
  • Automatic camera selection for scene rendering
  • Fallback default camera when no camera exists in the scene

Generated Files

  • Clean HTML template with proper viewport settings
  • Modular JavaScript file with complete scene setup
  • Organized directory structure for GLTF assets

UI Integration

  • Seamlessly integrated into Blender's Output Properties panel
  • Simple HTML file path selection
  • Clear success/error messages

Installation

  • Download the three_blender_v0.1.py file from the releases section
  • Open Blender and navigate to Edit > Preferences > Add-ons > Install
  • Select the downloaded zip file
  • Enable the addon by checking the box next to Import-Export: Three.js Scene Exporter

Usage Instructions

  • Create and set up your scene in Blender
  • Navigate to Output Properties panel
  • Find the Three.js Export section
  • Enter a path where your HTML file should be saved
  • Click Export Scene button
  • Get the generated HTML file!