Interactive physiology learning platform for medical and biology students
Learn how the body works by manipulating parameters and watching systems respond in real-time. Built mobile-first for studying on the go.
- Interactive Simulations - Adjust sliders, see instant feedback
- Visual Learning - Animations that make complex concepts click
- Mobile-First - Designed for learning on your phone
- Bite-Sized Modules - 5-10 minute sessions per topic
- Counter-Current Multiplier
- Glomerular Filtration Rate (GFR)
- Tubular Reabsorption
- Cardiac Cycle Animation
- Pressure-Volume Loops
- Conduction System
- Spirometry Simulation
- Gas Exchange
- V/Q Matching
# Clone the repo
git clone https://github.com/MetaMudraGames/physio-hub.git
cd physio-hub
# Install dependencies
npm install
# Start development server
npm run devOpen http://localhost:5173 in your browser.
- Framework: React 18 + Vite
- Styling: Tailwind CSS v4
- Animations: Framer Motion
- Charts: D3.js, Recharts
- Hosting: Cloudflare Pages
src/
├── components/
│ ├── shared/ # Reusable UI (Slider, Graph, QuizCard)
│ ├── modules/ # Physiology simulations by system
│ │ ├── Renal/
│ │ ├── Cardiac/
│ │ └── Respiratory/
│ └── games/ # Interactive exercises
├── hooks/ # Custom React hooks
├── utils/ # Helpers & formulas
└── data/ # Content configuration
npm run dev # Start dev server
npm run build # Production build
npm run preview # Preview production build
npm run lint # Check for errors- Fork the repository
- Create a feature branch (
git checkout -b feature/amazing-feature) - Commit your changes (
git commit -m 'feat: Add amazing feature') - Push to the branch (
git push origin feature/amazing-feature) - Open a Pull Request
MIT License - feel free to use for educational purposes!
Made by MetaMudra Games