# Task 3 Report: [Hover Interaction (Visual Feedback)]

## Objective
When the user hovers over the 3D object, something changes visually (e.g., color, scale).

## Vanilla Three.js
- Possible: **Yes**
- Notes: Requires setting up a `Raycaster`, calculating **Normalized Device Coordinates (NDC)** for the mouse, and manually toggling states inside a `mousemove` event listener.
- Key concepts: `THREE.Raycaster`, `mousemove`, `NDC calculation`, `Manual State Management`.
- Complexity: **Medium** (High math/boilerplate).

## R3F
- Possible: **Yes**
- Notes: Extremely intuitive. Built-in `onPointerOver` and `onPointerOut` props handle everything declaratively. State management is simple with `useState`.
- What R3F abstracted: `Raycaster computation`, `Normalized Coordinates`, `Event-to-Mesh mapping`.
- Complexity: **Easy** (Very concise, 5-10 lines of code).

## Thob Page Builder
- Possible: **No (for hover interaction)**
- Notes:
  - Hover interaction is not supported in the current UI
  - Click trigger exists but did not produce consistent results during testing
  - Interaction system appears limited or unstable for dynamic visual feedback
- Complexity: **Limited** (interaction features not fully functional)

---

## Comparison Summary

- Possible in all 3? **No** (hover interaction not supported in builder)

- Main differences:
  - **Vanilla**: Powerful but requires manual setup
  - **R3F**: Simplest and most reliable interaction system
  - **Thob**: Limited interaction support; hover missing and click behavior unclear

- Where Thob is better:
  - **Static visual prototyping**

- Where Thob is weaker:
  - **Interaction system reliability**
  - Lack of hover support
  - Unclear event-to-property binding

- What feels awkward or unclear:
  - Interaction triggers are visible but behavior is not always predictable

---

## Limitation Type

- [ ] Editor UX limitation
- [x] Runtime limitation (event execution unclear)
- [ ] Schema / data model limitation
- [ ] Component limitation
- [x] Event system limitation
- [x] Property binding limitation
- [ ] Asset pipeline limitation

---

## Workaround

- No reliable workaround found for hover interaction
- Click interaction may require further investigation or configuration

---

## Suggested Improvement

- Improve reliability of event execution (e.g., onClick behavior)
- Introduce hover interaction support (`onHoverStart`, `onHoverEnd`)
- Provide clearer feedback when event actions fail

---

## Recommendation

To enable interactive 3D experiences, the builder should strengthen its event system, ensuring reliable execution of click triggers and adding support for hover-based interactions.