chore: added day1 update
This commit is contained in:
parent
9f0f74617d
commit
beee98de51
6
Week-1/Days-update/Day1.md
Normal file
6
Week-1/Days-update/Day1.md
Normal file
@ -0,0 +1,6 @@
|
|||||||
|
# Day 1 Update
|
||||||
|
|
||||||
|
- Set up the repository using Turborepo to organize the project as a monorepo.
|
||||||
|
- Learned about the Scene Graph concept in Three.js.
|
||||||
|
- Implemented the solar system from the Three.js manual scene graph tutorial: https://threejs.org/manual/#en/scenegraph
|
||||||
|
- Started implementing the same solar system in React Three Fiber (R3F), but did not finish it yet.
|
||||||
5
Week-1/Days-update/Day2.md
Normal file
5
Week-1/Days-update/Day2.md
Normal file
@ -0,0 +1,5 @@
|
|||||||
|
# Day 2 Update
|
||||||
|
|
||||||
|
- Continued work on Task 1 in React Three Fiber (R3F).
|
||||||
|
- Implemented earth orbit motion by rotating a parent `group` with `useFrame`.
|
||||||
|
- Current output: a very simple solar system where earth continuously orbits the sun.
|
||||||
@ -1,60 +1,58 @@
|
|||||||
# Task: [Feature Name]
|
# Task: Parent-Child Hierarchy
|
||||||
|
|
||||||
## Objective
|
## Objective
|
||||||
What is the feature trying to do?
|
The objective was to create a simple 3D scene with two objects in a parent-child hierarchy, then verify that transformations applied to the parent (such as position and scale) are correctly inherited by the child.
|
||||||
|
|
||||||
## Vanilla three.js
|
## Vanilla three.js
|
||||||
-Possible: Yes / Partial / No
|
-Possible: Yes
|
||||||
-Notes:
|
-Notes: Implemented by creating sunMesh and attaching an earthOrbit group to it (`sunMesh.add(earthOrbit)`), then adding earthMesh to that group. Parent transforms propagate correctly to child.
|
||||||
-Key concepts:
|
-Key concepts: Scene graph hierarchy, `THREE.Group` as orbit pivot, local vs world transforms, animation loop for orbit/spin.
|
||||||
-Complexity: Easy / Medium / Hard
|
-Complexity: Easy
|
||||||
|
|
||||||
## R3F
|
## R3F
|
||||||
-Possible: Yes / Partial / No
|
-Possible: Yes
|
||||||
-Notes:
|
-Notes: Implemented by nesting Earth inside a `<group ref={orbitRef}>` inside the Sun `<mesh>`, making Earth a child in the same scene graph hierarchy.
|
||||||
-What R3F abstracted:
|
-What R3F abstracted: Declarative JSX scene creation, automatic render lifecycle integration with React, and frame updates via `useFrame` instead of manual renderer/loop setup.
|
||||||
-Complexity: Easy / Medium / Hard
|
-Complexity: Easy
|
||||||
|
|
||||||
## Thob Page Builder
|
## Thob Page Builder
|
||||||
-Possible: Yes / Partial / No
|
-Possible: Yes
|
||||||
-Notes:
|
-Notes: Implemented by putting the Earth mesh inside the Sun mesh (parent-child). Changing Sun position/scale also affects Earth as expected (Earth follows position and scale inheritance). However, when Earth position is changed directly, Earth shape appears to distort/stretch as it moves farther from Sun.
|
||||||
-Builder steps:
|
-Builder steps: Create Sun mesh -> add Earth mesh as child of Sun -> test parent transform inheritance by changing Sun position/scale -> test child local transform by changing Earth position.
|
||||||
-Complexity: Easy / Medium / Hard
|
-Complexity: Easy
|
||||||
|
|
||||||
## Comparison Summary
|
## Comparison Summary
|
||||||
-Possible in all 3? Yes / Partial / No
|
-Possible in all 3? Yes
|
||||||
-Main differences:
|
-Main differences: Vanilla gives explicit low-level control; R3F gives cleaner declarative hierarchy; Thob gives fastest visual setup but less predictable child transform behavior in this case. Animation was not possible in Thob but was possible in vanilla and r3f.
|
||||||
-Where Thob is better:
|
-Where Thob is better: Quick setup and visual parenting without writing code.
|
||||||
-Where Thob is weaker:
|
-Where Thob is weaker: Child transform behavior is less transparent when editing child position under a transformed parent.
|
||||||
-What feels awkward or unclear:
|
-What feels awkward or unclear: Local vs inherited transforms are not obvious in the editor, and distortion behavior on child position change is unexpected.
|
||||||
|
|
||||||
## Limitation Type (if any)
|
## Limitation Type (if any)
|
||||||
-[ ] Editor UX limitation
|
-[x] Editor UX limitation
|
||||||
-[ ] Runtime limitation
|
-[ ] Runtime limitation
|
||||||
-[ ] Schema / data model limitation
|
-[ ] Schema / data model limitation
|
||||||
-[ ] Component limitation
|
-[x] Component limitation
|
||||||
-[ ] Event system limitation
|
-[ ] Event system limitation
|
||||||
-[ ] Asset pipeline limitation
|
-[ ] Asset pipeline limitation
|
||||||
-[ ] Unknown / needs investigation
|
-[ ] Unknown / needs investigation
|
||||||
|
|
||||||
## Workaround
|
## Workaround
|
||||||
-Is there a workaround?
|
-Is there a workaround? NO
|
||||||
-If yes, what is it?
|
-No, I tried a lot of different things, like many groupa and flex inside the parent mesh and different ways to place the components.
|
||||||
|
|
||||||
## Suggested Improvement
|
## Suggested Improvement
|
||||||
-What should improve in Thob?
|
-What should improve in Thob? Make transform inheritance behavior explicit and stable for nested meshes, especially when parent scale is applied and child position is edited.
|
||||||
-Is it:
|
-Is it:
|
||||||
-editor
|
-editor
|
||||||
-runtime
|
|
||||||
-component
|
-component
|
||||||
-UX
|
-UX
|
||||||
-schema/data
|
|
||||||
|
|
||||||
## Difficulty Estimate
|
## Difficulty Estimate
|
||||||
-Easy / Medium / Hard
|
-Easy
|
||||||
|
|
||||||
## Business Value
|
## Business Value
|
||||||
-Low / Medium / High
|
-High
|
||||||
|
|
||||||
## Recommendation
|
## Recommendation
|
||||||
Should Thob support this better? Why?
|
Should Thob support this better? Why? Yes. Parent-child transform consistency is a core 3D workflow; reliable nested transforms reduce confusion, improve trust in the builder, and make more advanced scenes practical without code-level debugging.
|
||||||
Loading…
x
Reference in New Issue
Block a user