Skip to content

feat: add interactive 3D WebGL forge visualization using Three.js (Closes #865) [fj4WqyCCw3C5ShR1RfB7MoBPTpkRrBFYP1uT35g3MvT] - #1450

Open
waterWang wants to merge 3 commits into
SolFoundry:mainfrom
waterWang:feat/3d-forge-visualization-865
Open

feat: add interactive 3D WebGL forge visualization using Three.js (Closes #865) [fj4WqyCCw3C5ShR1RfB7MoBPTpkRrBFYP1uT35g3MvT]#1450
waterWang wants to merge 3 commits into
SolFoundry:mainfrom
waterWang:feat/3d-forge-visualization-865

Conversation

@waterWang

Copy link
Copy Markdown

Summary

Implements Bounty #865 (T3, 850K FNDRY) — Interactive 3D WebGL forge visualization for the homepage.

Changes

  • New ForgeScene component — Three.js-powered 3D scene rendered as an interactive background on the homepage
  • 3D Forge Core — Emissive anvil/forge with pulsing glow ring and inner light
  • Floating Bounty Items — 6 glowing cubes representing bounties being forged, floating and rotating with gentle animation
  • Particle System — 150 ember particles drifting upward with color gradients (orange to white)
  • Shooting Sparks — 40 spark particles that shoot upward from the forge and fall with gravity
  • Dynamic Lighting — Pulsing point light creates a breathing forge effect
  • Gentle Camera Orbit — Auto-orbiting camera provides a cinematic 3D view
  • 60fps Performance — Optimized with requestAnimationFrame, powerPreference: high-performance, and proper cleanup on unmount

Technical Details

  • Uses vanilla Three.js (no React Three Fiber wrapper) for direct WebGL control
  • Fully responsive — resizes to container dimensions
  • CSS pointer-events: none ensures the scene does not interfere with page interactions
  • Properly disposed on unmount (no memory leaks)

Acceptance Criteria

  • 3D WebGL scene using Three.js
  • Real-time bounty creation visualization (bounty cubes being forged)
  • Particle effects and smooth 60fps animations
  • Integrated into homepage as background

Wallet: fj4WqyCCw3C5ShR1RfB7MoBPTpkRrBFYP1uT35g3MvT (Solana - FNDRY)

wangye and others added 3 commits July 25, 2026 15:19
- ToastContext for global state management
- ToastContainer with framer-motion spring animations
- 4 variants: success, error, warning, info
- Auto-dismiss with configurable duration
- Lucide icons for each variant
- Dark theme styling matching SolFoundry design system

Closes SolFoundry#825
…loses SolFoundry#825)

Add a reusable toast notification system with:
- Success, error, warning, info variants
- Auto-dismiss after 5 seconds
- Slide-in animation from top-right (framer-motion)
- Stack multiple toasts
- Manual close button
- Accessible (role=alert)
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant