An interactive, step-by-step guide for learning the Babylon.js Node Particle Editor. This web application provides comprehensive lessons, live examples, and hands-on practice to help you master particle system creation from beginner to expert level.
NPE Guide is an educational platform designed to teach developers how to create stunning particle effects using the Babylon.js Node Particle Editor. The application combines:
- Interactive Lessons: Step-by-step tutorials that guide you through creating particle systems
- Live Editor Preview: See your particle effects in real-time as you learn
- Block Documentation: Detailed information about each node block with links to official documentation
- Bilingual Support: Available in English and Russian
- 📚 Progressive lesson structure from basics to advanced techniques
- 🎨 Live Babylon.js particle editor integration
- 📖 Comprehensive block documentation with property explanations
- 🌐 Multi-language support (English/Russian)
- 📱 Responsive design with modern UI
- 🚀 Deployed on GitHub Pages
- Framework: Angular 21
- 3D Engine: Babylon.js 8.39
- Particle Editor: Babylon.js Node Particle Editor
- Styling: Tailwind CSS 4
- Internationalization: ngx-translate
- Node.js 20 or higher
- npm 11.4.2 or higher
# Clone the repository
git clone https://github.com/soullnik/npe-guide.git
# Navigate to the project directory
cd npe-guide
# Install dependencies
npm install# Start the development server
npm start
# The application will be available at http://localhost:4200# Build for production
npm run build
# Build for GitHub Pages deployment
npm run build:gh-pages- Select a lesson from the menu
- Follow the step-by-step instructions
- Use the "Load example" button to see the lesson's particle system in action
- Explore block properties and documentation
- Progress through lessons to build your particle effect skills
Visit the live application: https://soullnik.github.io/npe-guide/
Contributions are welcome! This project is open to improvements, suggestions, and new lesson ideas. Whether you want to:
- Add new lessons
- Improve existing content
- Fix bugs
- Enhance the UI/UX
- Translate to additional languages
Feel free to open an issue or submit a pull request. Your contributions help make this guide better for everyone!
This project is open source and available for educational purposes.
Built with Babylon.js and the amazing Node Particle Editor.