Growing skills, one keystroke at a time ๐ฑโจ๏ธ
A comprehensive pixel-art typing game that combines competitive typing races with tree collecting, forest management, and educational content. Master your typing skills while building your own virtual forest ecosystem!
TypeSprout transforms traditional typing practice into an engaging multi-game experience featuring:
- ๐ Competitive Typing Races - Race against AI opponents with real-time WPM tracking
- ๐ฒ Forest Management - Plant and grow trees in your personal isometric forest
- ๐ TreeDex Collection - Discover and unlock 16 unique tree species with rich lore
- ๐ต Immersive Audio - Dynamic music system with crossfading and spatial sound effects
- ๐ผ๏ธ Pixel-Perfect Art - Authentic retro aesthetic with smooth animations
- Multi-Difficulty Racing: Easy, Intermediate, Hard, and Hidden "Impossible" mode
- Real-Time Competition: Race against 3 AI opponents with dynamic WPM calculations
- Live Performance Tracking: WPM, accuracy, and placement statistics
- Visual Tree Growth: Watch your tree evolve as you type faster and more accurately
- Seed Rewards: Earn different seed types based on your performance
- Isometric Grid System: Plant trees in a beautiful 3D-perspective environment
- Growth Mechanics: Trees progress through seed โ sprout โ mature stages over time
- Species Diversity: 16 different tree types with unique appearances and growth patterns
- Inventory Management: Collect and manage different seed types
- Save System: Persistent forest state with automatic saving
- 16 Unique Species: From common Oak to legendary Yggdrasil
- Educational Content: Scientific names, native ranges, and detailed descriptions
- Rarity System: Common, Rare, Goated, and Hidden classification
- Progress Tracking: Trees unlock as you grow them in your forest
- Rich Lore: Each species features unique backstories and cultural significance
- Dynamic Music: Automatic track switching between menu and gameplay
- 2-Second Crossfading: Smooth transitions between different sections
- Universal SFX: Button sounds and interaction feedback
- Volume Controls: Separate sliders for master, music, and SFX
- Persistent Settings: Audio preferences saved across sessions
Discover 16 meticulously researched tree species, each with unique characteristics:
- Oak, Birch, Spruce, Cedar, Willow, Maple, Acacia
- Silk Floss - Thorny trunk with beautiful blossoms
- Ghost Gum - Glowing white bark from Australian Dreamtime
- Socotra Dragon - Alien umbrella shape that bleeds red resin
- Ginkgo - Living fossil that survived the atomic bomb
- Monkey Puzzle - Prehistoric Chilean sacred tree
- Rainbow Eucalyptus - Natural rainbow-colored bark
- Baobab - Ancient water-storing giants
- Fertility Tree - Campus legend from University of the Philippines
- Yggdrasil - Norse mythological world tree
- Start Racing โ Choose difficulty and compete in typing challenges
- Earn Seeds โ Better performance yields rarer seed rewards
- Plant Forest โ Use seeds to grow your personal tree collection
- Unlock TreeDex โ Mature trees reveal detailed species information
- Collect All โ Discover all 16 species and complete your encyclopedia
- Seamless Navigation: Smooth transitions between game modes
- View Management: Opening cutscene โ Main menu โ Game sections
- Modular Design: Clean separation between gameplay systems
TypeSprout/
โโโ ๐ฌ Main Menu/ # SPA hub with video cutscenes
โ โโโ index.html # Main application entry point
โ โโโ script.js # Navigation and view management
โ โโโ *.css # Modular styling system
โโโ ๐ Main Game/ # Typing race engine
โ โโโ script.js # Race logic and AI opponents
โ โโโ Assets/ # Game sprites and images
โโโ ๐ฒ Forest/ # Isometric farming simulation
โ โโโ script.js # Plant system and save management
โ โโโ assets/ # Tree sprites and environment
โโโ ๐ TreeDex/ # Species encyclopedia
โ โโโ script.js # Collection tracking and species data
โ โโโ assets/ # TreeDex UI and tree images
โโโ ๐ต audio/ # Comprehensive audio system
โ โโโ AudioManager.js # Singleton audio coordination
โ โโโ MusicManager.js # Background music with crossfading
โ โโโ SFXManager.js # Button sounds and effects
โ โโโ SettingsManager.js # Audio settings integration
โโโ ๐ assets/ # Shared sprites and resources
โโโ sprites/seeds/ # Seed collection graphics
โโโ sprites/sprouts/ # Growth stage sprites
โโโ sprites/trees/ # Mature tree artwork
# Clone the repository
git clone https://github.com/yourusername/typesprout.git
cd typesprout
# Launch with local server (recommended)
python -m http.server 8000
# or
npx serve .
# Open in browser
open http://localhost:8000Simply open index.html in any modern web browser!
Place these files in the SFX/ directory:
Title _ScreenMusic.mp3- Main menu background musicBattleMusic.mp3- Gameplay background musicButton Sound Effect.mp3- UI interaction sounds
- Arrow Keys: Navigate menu options
- Enter/Space: Select menu items and confirm actions
- Escape: Return to previous screen or pause
- Tab: Cycle through interactive elements
- Ctrl/Cmd + M: Toggle audio on/off
- Ctrl/Cmd + Plus/Minus: Adjust master volume
- Complete keyboard navigation support
- Visual focus indicators for all interactive elements
- Screen reader compatible semantic markup
- High contrast pixel-art design for clarity
- Native Resolution: 320ร180 base resolution with crisp scaling
- Authentic Retro Style: Press Start 2P font and classic gaming colors
- Consistent Art Direction: Unified color palette across all assets
- Isometric Perspective: Beautiful 3D-style forest environments
- Sprite Animations: Smooth tree growth and UI transitions
- Video Backgrounds: Atmospheric cutscenes with graceful fallbacks
- Vanilla JavaScript: No frameworks, maximum compatibility
- Modular CSS: BEM methodology with organized stylesheets
- Semantic HTML: Accessibility-first markup structure
- Progressive Enhancement: Graceful degradation for all features
- โ Chrome/Edge: Full feature support
- โ Firefox: Complete compatibility
- โ Safari: WebM video fallback to MP4
- โ Mobile: Touch-friendly responsive design
- Words Per Minute (WPM): Real-time calculation during races
- Accuracy Tracking: Error detection and correction feedback
- Placement Rankings: 1st-4th place competitive results
- Progressive Difficulty: Adaptive challenge scaling
- Common Seeds: Consistent rewards for steady performance
- Rare Seeds: Earned through exceptional typing speed/accuracy
- Goated Seeds: Reserved for mastery-level achievements
- Hidden Seeds: Secret unlock conditions for legendary trees
- Forest State: Tree positions, growth stages, and planting timestamps
- TreeDex Progress: Species unlock status and collection tracking
- Audio Settings: Volume preferences and toggle states
- Cross-Tab Sync: Settings synchronized across browser tabs
Uses localStorage with structured JSON for reliable data persistence.
- Typing Proficiency: Measurable improvement in speed and accuracy
- Botanical Knowledge: Real scientific information about tree species
- Cultural Awareness: Tree significance across different cultures
- Environmental Appreciation: Understanding of global forest diversity
Each tree species features:
- Accurate scientific nomenclature
- Authentic native range information
- Cultural and historical significance
- Ecological importance and conservation status
We welcome contributions in these areas:
- New typing challenges and game modes
- Additional tree species and biomes
- Enhanced AI opponent behaviors
- Achievement and progression systems
- Additional tree species artwork
- Environmental backgrounds and biomes
- UI improvements and animations
- Accessibility enhancements
- Performance optimizations
- Cross-browser compatibility fixes
- Mobile responsiveness enhancements
- Code refactoring and documentation
# Fork and clone your fork
git clone https://github.com/yourusername/typesprout.git
cd typesprout
# Create feature branch
git checkout -b feature/amazing-enhancement
# Test your changes locally
python -m http.server 8000
# Submit pull request with:
# - Clear description of changes
# - Screenshots/videos of new features
# - Browser compatibility testing results- Mobile touch controls optimization
- Advanced typing statistics and analytics
- Custom typing lesson creation tools
- Enhanced error feedback and correction
- Additional forest biomes (Desert, Rainforest, Tundra)
- Seasonal tree variations and environmental effects
- More tree species with regional focus
- Multiplayer typing race implementation
- User account system with cloud save
- Global leaderboards and tournaments
- Custom forest sharing and community features
- Advanced audio system with 3D spatial effects
- University of the Philippines Los Baรฑos - Inspiration for the Fertility Tree legend
- Norse Mythology - Yggdrasil world tree concept
- Aboriginal Dreamtime - Ghost Gum spiritual significance
- Global Forest Conservation - Species information and awareness
- Classic Typing Games - Mario Teaches Typing, Mavis Beacon
- Pixel Art Games - Stardew Valley, Hyper Light Drifter
- Educational Gaming - Making learning engaging and memorable
- Minecraft - Audio assets inspired and credited to Mojang's Minecraft as part of the immersive sound design
- Jump King - Visual art style inspiration drawn from Jump King's distinctive pixel art aesthetic
- Web Standards - HTML5, CSS3, and JavaScript best practices
- Accessibility Guidelines - WCAG compliance and inclusive design
- Browser Developers - Cross-platform compatibility and modern APIs
TypeSprout - Where every keystroke grows your digital forest and expands your knowledge of the natural world. Start your typing journey today and discover the wonder of trees from around the globe! ๐ณโจ
Built with โค๏ธ using vanilla web technologies for maximum compatibility and performance.