# Task: Parent Group Motion with Child Offset Inheritance

## Objective
Build a step-based scene where a parent group is translated and rotated, while child meshes inherit those transforms and keep their relative spacing.

## Vanilla three.js
-Possible: Yes
-Notes:
  - Uses a parent group containing three child meshes.
  - Step data controls camera position, look target, group position, group rotation, and spin speed.
  - Animation loop lerps toward target transforms for smooth guided transitions.
-Key concepts:
  - Group hierarchy and transform inheritance
  - Step-driven state config
  - Camera and group interpolation
  - Maintaining child local offsets under parent motion
-Complexity: Medium

## R3F
-Possible: Yes
-Notes:
  - Uses a group with child meshes in declarative JSX.
  - Step index in React state drives camera and parent group targets.
  - useFrame performs smooth interpolation and optional spin per step.
-What R3F abstracted:
  - Render-loop integration through hooks
  - Scene graph composition with nested components
  - State-driven UI to scene updates
-Complexity: Medium

## Thob Page Builder
-Possible: Partial
-Notes:
  - We can make things like this by following the simple mesh-inside-mesh design.
  - Rotate the parent object, and children inherit the rotation and move with the parent while maintaining offset distance.
  - This matches the same parent-child transform behavior used in vanilla and R3F.
  - Perspective Camera component rotation feature appears broken right now: no matter how much camera rotation is changed on any axis, objects disappear.
-Builder steps:
  - Create a parent mesh/group container.
  - Place child meshes inside it with different local positions.
  - Animate or rotate only the parent transform to drive combined motion.
  - Add camera positions per step if needed for guided presentation, but avoid camera rotation controls until this issue is fixed.
-Complexity: Easy

## Comparison Summary
-Possible in all 3? Partial
-Main differences:
  - Vanilla is explicit and manual for hierarchy and animation wiring.
  - R3F keeps hierarchy readable and state-driven.
  - Thob can represent the same hierarchy visually with low setup effort, but camera rotation behavior blocks full parity.
-Where Thob is better:
  - Fast scene assembly for parent-child structures.
  - Easier visual understanding of nested transforms.
-Where Thob is weaker:
  - Perspective Camera rotation currently causes objects to disappear.
  - Fine-grained transition logic can still need extra workflow clarity.
-What feels awkward or unclear:
  - Managing more advanced multi-step timing and orchestration can become less obvious than code-first flow.
  - Camera rotation controls are not reliable due to object disappearance.

## Limitation Type (if any)
-[ ] Editor UX limitation
-[x] Runtime limitation
-[ ] Schema / data model limitation
-[ ] Component limitation
-[ ] Event system limitation
-[ ] Asset pipeline limitation
-[x] Unknown / needs investigation

## Workaround
-Is there a workaround?
  - Partial workaround.
-If yes, what is it?
  - Keep parent/child group rotation for the main motion behavior.
  - Avoid rotating the Perspective Camera component for now.
  - Use camera position changes and look target adjustments instead of direct camera rotation.

## Suggested Improvement
-What should improve in Thob?
  - Fix Perspective Camera component rotation behavior so objects do not disappear when rotating on any axis.
  - Optional guided presets for common parent-child motion patterns.
  - Better timeline/state visualization for multi-step camera + transform storytelling.
-Is it:
  - editor
  - runtime
  - UX

## Difficulty Estimate
-Medium

## Business Value
-High

## Recommendation
Yes, Thob should support this strongly because parent-child transform inheritance is foundational for many real scenes, from product showcases to motion compositions. Priority should include fixing Perspective Camera rotation reliability first.