An interactive website featuring an immersive cosmic zen background with WebGL 3D effects and an interactive book element. The experience combines visual elements inspired by zen philosophy with subtle audio elements to create a meditative digital space.
The book opens to reveal three sections:
- Enter Zen - Journey to the path of enlightenment
- Ancients - Discover the wisdom of ancient civilizations
- Break The Code - Unravel mysteries and decode hidden messages
- Advanced WebGL cosmic background
- Interactive 3D elements with parallax effects
- Energy flows, mandalas, and sacred geometry patterns
- Floating sacred geometry around the book:
- Platonic solids (Tetrahedron, Octahedron, Icosahedron, Dodecahedron)
- Seed of Life pattern
- Vesica Piscis
- Merkaba (Star Tetrahedron)
- Golden Spiral
- Zen quotes that appear occasionally
- Ambient audio experience with meditation bells
- Interactive book element as the focal point
- Responsive design for different screen sizes
All documentation is available in the docs folder:
- WebGL Zen Space Documentation
- Loading Fixes Documentation
- Project Tracker
- Architecture Overview
- Integration Instructions
- Todo List
- Documentation Overview
- Clone this repository
- Open index.html in your browser
- Interact with the book element to enter the zen experience
The project is built with:
- HTML5
- CSS3
- JavaScript
- Three.js for WebGL rendering
To make modifications, edit the relevant files:
- index.html - Main structure
- css/ - Styling files
- js/ - JavaScript implementation
- webgl-zen.js - WebGL background
- zen-audio.js - Audio implementation
- zen-elements.js - DOM-based elements (fallback)
Press Alt+D to activate debug mode if you encounter issues. This enables:
- FPS counter
- WebGL information
- Wireframe view
- Fallback option
For browsers without WebGL support, a fallback DOM-based background is provided automatically.