docs: added builder exploration notes

This commit is contained in:
divyap 2026-03-27 23:45:05 +05:30
parent d3757fd58f
commit a911292d01

View File

@ -0,0 +1,36 @@
# Builder Exploration Notes — Task 1: Material Color Change
## Thob Capabilities Observed
* **Static Editing**: 100% Supported. The side panel color picker is intuitive and updates the `meshStandardMaterial` in real-time.
* **Layer Hierarchy**: The tree structure (`Canvas > mesh > meshStandardMaterial`) is logical and matches the Three.js/R3F scene graph.
* **Lighting Defaults**: Default `ambientLight` and `pointLight` are provided, which makes the initial setup faster than code.
## Limitations Identified
* **Dynamic Mutation (Runtime)**: Attempting to change the material color via an `onClick` event script failed.
* **Expression Error**: Direct property assignment like `meshStandardMaterial.color = 'pink'` is not currently interpreted correctly by the builder's internal script runner.
* **Property Binding**: There is no "No-Code" way to bind a click event directly to a material property (unlike R3F's simple `onClick`).
## Console Warnings & Diagnostics
During the exploration, the following engine-level issues were noted in the console (see screenshots):
1. **Hydration Mismatch (`No HydrateFallback`)**:
* *Observation*: React is complaining about a missing fallback during initial hydration.
* *Impact*: Minor. Suggests a slight desync between server-side rendering and client-side activation in the editor.
2. **Controlled vs. Uncontrolled Inputs**:
* *Observation*: `undefined` value is changing from uncontrolled to controlled.
* *Impact*: Mid. This often causes "jumping" or resetting behavior in UI sliders or color pickers.
3. **404 Resource Failure**:
* *Observation*: A specific resource ID failed to load (`670e...f891f:1`).
* *Impact*: Likely a missing texture or a broken internal reference to a metadata object.
## Comparison vs. Code
* **Workflow Speed**: Thob is **faster** for initially placing an object and picking a color.
* **Interaction Logic**: R3F is **significantly more powerful**. Writing simple React code for a toggle is easier than trying to find a workaround in the builder's current event system.
## Improvement Recommendations
1. **Event-to-Property Action**: Add a preset action for "Set Material Property" inside the `onClick` event trigger so no code is required.
2. **Error Feedback**: Provide a user-friendly "Scripting Error" toast inside the builder instead of failing silently in the browser console.
---
**Verdict**: Strong for **Visual Prototyping**; Limited for **Interactive Product Logic**.