builder-research/Week-3/Task-2/TaskNotes.md

Task: Scene Preset / Transform State Switching Consistency Audit

Objective

Test reliability of scene state switching with 3 presets, including deterministic transforms, visibility correctness, isolation between states, drift checks, and default/reset behavior.

Vanilla three.js

-Possible: Yes -Reliability verdict: Reliable -Notes:

• Uses a single states object (state1, state2, state3) with explicit position, rotation, and visible values for each mesh (center, left, right).
• Switching in any order remains deterministic because each state write fully overwrites target transforms and visibility.
• Repeated and fast switching stays stable; latest state selection becomes the active target.
• No cross-state contamination observed in logic because each object gets fresh target values per applyState call.
• state1 acts as reset/default and consistently restores baseline layout.
• Transitions are smooth due to per-frame lerp of position and rotation deltas. -Key concepts:
• Central state map
• Visibility + transform synchronization
• Target-based interpolation
• Deterministic overwrite model -Complexity: Medium

R3F

-Possible: Yes -Reliability verdict: Reliable -Notes:

• Uses SCENE_STATES config and React state (stateKey) to switch presets.
• useEffect applies state values to target vectors/eulers and visibility; useFrame handles smooth interpolation.
• State isolation is clear because every switch writes full values for every object.
• Different switching orders and rapid changes should remain deterministic from current code structure.
• state1 functions as default/reset and is straightforward to trigger.
• Transition quality is smooth and predictable (same interpolation approach as vanilla). -What R3F abstracted:
• Declarative state-driven updates
• Frame-loop orchestration through useFrame
• Better separation of UI intent and object motion -Complexity: Medium

Thob Page Builder

-Possible: Yes -Reliability verdict: Reliable -Notes:

• I made three different meshes, each arranged exactly as needed for one state.
• Then I used radio buttons to toggle mesh visibility between those state setups.
• Switching worked in any order and stayed correct even after many repeated toggles.
• Visibility/state isolation was clean and no drift/mismatch appeared.
• Default/reset is effectively the default selected radio state.
• Main gap: state change is instant; no transition animation while switching. -Builder steps:

1. Create three separate mesh setups representing the three scene states.
2. Position models in each mesh as desired for each state.
3. Add radio buttons for state selection.
4. Bind each radio option to visibility toggles.
5. Stress test repeated toggling and random order switching. -Complexity: Easy

Comparison Summary

-Possible in all 3? Yes -Main differences:

• Vanilla and R3F implement true transform-state interpolation on shared objects.
• Thob implementation is reliable through visibility swapping of prebuilt state meshes.
• Thob currently changes state instantly, while vanilla/R3F can make transitions smoother. -Where Thob is better:
• Fast no-code setup for deterministic state switching.
• Very stable for discrete preset jumps. -Where Thob is weaker:
• No built-in smooth transform interpolation in this setup. -What feels awkward or unclear:
• How to add animation/transition between two authored states without manually rebuilding logic.

Limitation Type (if any)

-[ ] Editor UX limitation -[ ] Runtime limitation -[ ] Schema / data model limitation -[ ] Component limitation -[ ] Event system limitation -[ ] Asset pipeline limitation -[x] Unknown / needs investigation

Workaround

-Is there a workaround?

• Yes. -If yes, what is it?
• Author each scene state as a separate mesh group and toggle visibility with radio buttons for predictable switching.

Suggested Improvement

-What should improve in Thob?

• Add optional transition animation between preset states (position/rotation/visibility easing).
• Provide a native state preset system where authored states can blend over time.
• Add a simple transition duration/easing control per state switch action. -Is it:
• runtime
• component
• UX

Difficulty Estimate

-Easy

Business Value

-High

Recommendation

Yes, and this should be improved with transitions. Current state switching is reliable for deterministic preset jumps, but animation support would make it production-ready for smoother demos and storytelling.