Skip to main content

Getting Started

This guide walks you through creating your first interactive smart object — from uploading a 3D model to publishing a finished package. No coding experience required.

Step 1: Upload Your Object​

Start by uploading a 3D model in GLB format. This is the standard format for web-ready 3D content. Most 3D tools (Blender, SketchUp, etc.) can export to GLB.

  1. Open the Fruit3D editor
  2. Click New Project to create a workspace
  3. Click Upload Model and select your .glb file
  4. Your model appears in the 3D viewport — you can orbit, pan, and zoom to inspect it
Don't have a model?

You can find free GLB models on sites like Sketchfab or Poly Pizza. Look for models with separate parts (doors, drawers, buttons) — these work best for interactivity.

Step 2: Describe What You Want with AI​

Once your model is loaded, open the AI chat panel and describe the behavior you want in plain language. The AI assistant will configure states, animations, and interactions for you.

Example prompts:

  • "Make the door open when I click on it"
  • "Add an open and closed state for the drawer — it should slide out smoothly"
  • "When I click the power button, make the screen light up"
  • "Create a spin animation for the fan blades"

The AI will:

  • Identify the relevant parts of your model
  • Create named states (e.g. "open" and "closed") with the right transforms
  • Set up click events to trigger transitions
  • Generate scripts for custom animations

You can keep chatting to refine the result — ask it to adjust speed, change which part responds to clicks, or add more states.

Step 3: Preview and Tweak​

Switch to Preview mode to test your smart object in action.

  • Click on parts of the model to trigger the interactions you set up
  • Watch animations play out in real time
  • Adjust settings in the sidebar panel — tweak animation speed, transform values, or state names

If something isn't quite right:

  • Go back to the AI chat and describe what you'd like to change
  • Or manually edit states and events in the sidebar panels
  • Toggle between Edit and Preview modes to make changes and test them
tip

Use the Leva controls panel (top-right) for quick parameter tweaking during preview. This is great for dialing in animation timing and positions.

Step 4: Publish​

When you're happy with how your smart object works, publish it.

  1. Click Publish in the toolbar
  2. Fruit3D packages everything up — your model, states, events, and scripts — into a portable bundle
  3. Download the package or copy the embed code

The published package is self-contained and can be dropped into any web project. It includes:

  • The optimized 3D model
  • All state definitions and event configurations
  • Any custom scripts
  • A lightweight runtime for rendering and interaction

Next Steps​