Nature Walk Planner

Discover nature around you with smart species insights and walking routes.

🌟 Inspiration

Nature Walk Planner was born from a simple observation: people often have leisure time or want to take a walk, but don't know how to make the most of it. Instead of aimless wandering, why not use that time to explore and discover the fascinating wildlife that exists right in our neighborhoods?

In our increasingly urbanized world, many people walk past incredible biodiversity daily - birds, plants, and other wildlife - without knowing what they're seeing or where to find more. This app transforms those ordinary moments of free time into meaningful nature discovery adventures, combining real-time species data with intelligent route planning to help users explore nearby ecosystems during their walks.

Whether you have 15 minutes or an hour, Nature Walk Planner helps you make every step count by connecting you with the natural world around you.

📖 Project History

This project evolved through several key phases:

1. Initial Concept - Started as a simple species identification tool
2. Map Integration - Added Google Maps Platform for location-based discovery
3. AI Enhancement - Integrated Gemini AI for species insights and location summaries
4. Route Intelligence - Implemented Google Routes API for optimized walking paths
5. User Experience - Refined UI/UX with responsive design and intuitive controls

🗺️ Google Maps Platform Integration

Core Technologies Used:

• Google Maps JavaScript API - Interactive map display and user interaction
• Google Places API - Location search and autocomplete functionality
• Google Routes API - Walking route generation and optimization
• Google Maps Marker Clustering - Efficient species marker management

Key Implementation Features:

• Real-time Species Mapping - Displays nearby wildlife observations with clustered markers
• Intelligent Route Planning - Generates walking routes connecting multiple species locations
• Location-based Discovery - 2km radius detection circle for relevant species data
• Interactive Controls - Custom map controls for search, location, and route planning
• Responsive Design - Optimized for both desktop and mobile experiences

🔧 Technical Architecture

• Frontend: Next.js 14 + TypeScript + React
• Mapping: Google Maps Platform APIs
• Species Data: iNaturalist API
• AI: Google Gemini 2.0 Flash
• Styling: Tailwind CSS + Custom CSS

🚀 Key Features

• Species Discovery - Find birds, plants, and wildlife near any location
• AI-Powered Insights - Get detailed observation tips and species information
• Smart Route Planning - Three modes: Manual selection, time-based, and AI-optimized
• Location Summaries - AI-generated biodiversity overviews for any area
• Interactive Mapping - Clustered markers, info windows, and real-time updates
• Mobile Optimized - Responsive design for field use

🎯 Key Differentiators

1. Biodiversity Focus - Unlike general mapping apps, specifically designed for nature discovery
2. AI Integration - Combines Google Maps with Gemini AI for intelligent insights
3. Route Optimization - Creates walking paths that maximize species encounters
4. Real Data - Uses iNaturalist's research-grade observations for accuracy
5. Educational Value - Provides learning opportunities about local ecosystems

📚 Key Learnings

Google Maps Platform Insights:

• Marker Clustering - Essential for performance with large datasets
• Custom Controls - MapControl provides better UX than absolute positioning
• Routes API - Modern replacement for deprecated Directions API with better walking route optimization
• Mobile Considerations - InfoWindow positioning requires careful z-index management

Technical Learnings:

• Rate Limiting - Critical for external API integration (iNaturalist)
• Error Handling - Graceful degradation when APIs are unavailable
• Performance - Dynamic imports and efficient re-rendering for smooth UX
• Security - Input validation and XSS prevention in user-generated content

🛠️ Setup & Installation

1. Clone the repository

git clone [repository-url]
cd nature-walk-app

2. Install dependencies

npm install

3. Please go to GCP to create a project and billing account to link to the project

4. Enable APIs

• Maps JavaScript API
• Routes API
• Places API (New)

5. Create Credentials

• Create API Key
• Application restrictions (select Websites)
• Add website to the Website restrictions
• API restrictions (select Restrict key)
• Selected APIs (select the Enabled APIs)
• Store the credentials for later deployment or testing

6. Create Map ID

• Go to/ Search Google Maps Platform
• Select Map Management from left sidebar
• Select "Create map ID"
• Give a name and select JavaScript as Map type
• Store the map ID for later deployment or testing

7. Configure environment variables

# .env.local
NEXT_PUBLIC_GOOGLE_MAPS_API_KEY=your_google_maps_api_key
GOOGLE_MAPS_API_KEY=your_google_maps_api_key
GEMINI_API_KEY=your_gemini_api_key
GOOGLE_MAPS_ID=your_google_map_id

Note: This project currently uses Gemini 2.0 Flash for AI-powered insights. Future versions may update to newer Gemini models as they become available.

4. Run development server

npm run dev

5. Open http://localhost:3000

🚀 Deployment to Vercel

Quick Deploy

The easiest way to deploy Nature Walk Planner is with Vercel, the creators of Next.js:

Manual Deployment Steps

1. Push your code to GitHub

   git push origin main

2. Import project to Vercel

   • Go to vercel.com
   • Click "Add New..." → "Project"
   • Import your GitHub repository
   • Select the project folder (nature-walk-app)

3. Configure Environment Variables

   • In Vercel dashboard, go to Settings → Environment Variables
   • Add the following variables:
     • NEXT_PUBLIC_GOOGLE_MAPS_API_KEY
     • GOOGLE_MAPS_API_KEY
     • GEMINI_API_KEY

4. Deploy

   • Click "Deploy"
   • Your app will be live at https://your-project.vercel.app

Automatic Deployments

Vercel automatically deploys on every push to your main branch. Preview deployments are created for pull requests.

🌍 Environmental Impact

Nature Walk Planner promotes environmental awareness by:

• Encouraging outdoor exploration and physical activity
• Educating users about local biodiversity
• Supporting citizen science through iNaturalist integration
• Fostering connection between urban dwellers and nature

⭐ Support & Attribution

If you find Nature Walk Planner helpful or use it in your work, please consider:

• ⭐ Star this repository to show your support and help others discover the project
• 📝 Give proper credit if you use this code or build upon it
• 🔗 Link back to this repository in your project documentation

Using in Your Project?

If you're using Nature Walk Planner's code, concepts, or architecture in your own work, please include:

Based on Nature Walk Planner by @mimi030
Repository: [link-to-repo]

Your support helps us continue improving this project and motivates further development!

📄 License

MIT License - © 2025 NatureWalk by @mimi030.

Powered by Google Maps Platform, iNaturalist, and Google Gemini AI