About the Project: WMGP (Windelectric Magnetic Power Generator)

Inspiration

The idea for WMGP was born from the growing energy crisis across Africa and the urgent need to reduce reliance on fossil fuels. Traditional generators are noisy, costly, and unsustainable. We envisioned a cleaner, smarter solution — a fuel-less generator built around the principles of electromagnetic induction, **resonance, and **energy harvesting.

What We Learned

Throughout this project, we gained a deeper understanding of:

• The science behind electromagnetic systems
• How to model generator output in terms of:
  V = -N(dΦ/dt) (Faraday’s Law)
• Designing interactive 3D components using tools like react-three-fiber
• The importance of communicating hardware products through intuitive digital interfaces

How We Built It

We created a single-page web application that serves as an educational and ordering platform for WMGP. The site includes:

• A hero section introducing WMGP’s zero-emission mission
• A 3D configurator to explore generator models (10KW–1000KW)
• An interactive selector displaying specs: voltage, amps, phase, and price
• A contact/order form integrated via EmailJS
• Built using React, **Tailwind CSS, and **react-three-fiber
• Hosted on Render

Core Technologies

• Frontend: React + TypeScript
  
• Styling: Tailwind CSS
  
• 3D Support: react-three-fiber (GLB-ready)
  
• Hosting: Render
  

Challenges We Faced

• 3D integration: We had to simplify our 3D model pipeline due to time and tooling constraints
• Time constraints: Balancing the hardware vision with a digital experience in a short timeframe
• User education: Translating complex science into understandable visual blocks

What’s Next?

• Fully integrated rotating 3D product viewer
• Admin dashboard to track customer orders and production timelines
• Pilot testing and feedback collection in rural communities

Built With

• react
• three.js
• typescript