Needle Engine for Blender

Create interactive 3D web experiences directly from Blender. This tutorial will guide you through installing the add-on and creating your first interactive web project in under 10 minutes.

Needle Engine really eased up a lot of developer work — it's very artist friendly. The workflow was very fast and agile.

Martin F3D Generalist, Slovenia

Prerequisites

Before starting, make sure you have:

Step 1: Install the Add-on

Download

Install

1. In Blender, go to Edit > Preferences > Add-ons
2. Click the dropdown arrow → Select Install from Disk
3. Choose the downloaded .zip file → Click Install Add-on
4. Search for "Needle" and check the box to enable it

✓ Checkpoint: You should now see "Needle Engine Exporter for Blender" in your add-ons list with a checkmark.

Step 2: Create Your First Project

Let's start with a sample project to see how everything works.

Get Sample Projects

Download Blender Samples

Download and open any sample .blend file in Blender. These samples show what's possible and help you learn by example.

Generate the Web Project

1. Find the Needle Engine Panel

   • Open the Viewport Sidebar (right side)
   • Click the Needle Engine tab

2. Set Project Path

   • Click the folder icon next to Web Project Path
   • Choose a location for your web project folder
   • This folder will contain all your web files

3. Generate Project

   • Click the Generate Web Project button
   • Wait while Needle Engine:
     • Creates your web project files
     • Installs dependencies (may take 1-2 minutes)
     • Starts the local development server
   • Your browser should open automatically!

✓ Checkpoint: You should see your 3D scene running in a web browser. Try rotating the view with your mouse!

Step 3: Set Up Environment Lighting

Your HDRI environment is automatically exported and used for lighting — objects in your scene will reflect it and receive ambient light from it. The visible background is separate: it can show the skybox or render as a solid color.

To set up your environment:

1. Open Viewport Shading options (top right of 3D viewport)
2. Assign an HDRI cubemap
3. Optionally, set World Opacity to 1 to also show it as the background skybox

✓ Checkpoint: Save and check the browser — your scene should now have environment lighting (and a visible skybox if you set World Opacity to 1)!

Learn more about environment lighting → — custom HDRIs, automatic compression for fast loading, and more.

Step 4: Add Basic Interactivity

Now let's add camera controls so users can explore your scene.

Add OrbitControls

1. Select your camera in Blender
2. Find the Needle Object panel (in Viewport Sidebar)
3. Click Add Component
4. Search for OrbitControls and select it
5. Save your Blender file (Ctrl/Cmd + S)
6. Watch the browser refresh automatically

✓ Checkpoint: You can now click and drag in the browser to orbit the camera around your scene!

Understanding Components

Components are reusable behaviors you add to objects. Needle Engine includes 100+ built-in components:

• OrbitControls - Mouse/touch camera controls
• Rigidbody + Colliders - Built-in Rapier physics simulation
• SyncedRoom + Voip - Multiplayer with voice chat
• Animation - Play animation clips
• WebXR - Enable VR/AR with one click
• DragControls - Make objects draggable
• VideoPlayer, AudioSource, ParticleSystem, and many more!

Learn more about components →

Step 5: Set Up Color Management

By default, Blender uses Filmic which makes colors look different in the browser. Switch to Standard so what you see in Blender matches the web output.

1. Go to Render Properties tab

2. Find Color Management section

3. Set View to Standard

   

✓ Checkpoint: Colors now match between Blender and the web!

What You've Learned

Congratulations! You've just:

• ✅ Installed the Needle Engine add-on
• ✅ Created and launched a web project
• ✅ Added interactive camera controls
• ✅ Configured colors and environment lighting

Your Blender scenes are now running on the web with hot reload!

Next Steps

For Blender Artists → Comprehensive guide covering what you can create without code, workflow tips, and when you might want scripting.

• Environment Lighting → — custom HDRIs, skybox settings, and automatic compression
• Animation → — playback, state machines, and timeline export
• Components → — 100+ built-in behaviors and creating your own
• Lightmapping → — baked lighting for stunning visuals with great performance
• Deploy Your Project → — publish to Needle Cloud or self-host
• Sample Projects → — interactive examples to learn from
• FAQ → — common questions and troubleshooting

Getting Help

Discord Community → Ask questions and get real-time help from the community.

Forum → Detailed discussions and solutions.

Bug Reporter: Built-in tool in Blender (Help > Needle) for complex issues.