web

Siddhansh Govind - AI Engineer & Innovator Portfolio

Project Overview

• Name: Siddhansh Govind Portfolio
• Goal: Comprehensive professional portfolio showcasing AI engineering expertise, MUN leadership experience, and innovative projects
• Features: Interactive constellation background, AI chat system, MUN speech generator, glassmorphism design, responsive layout

URLs

• Production: https://siddhansh28.github.io/web/ (To enable: Go to GitHub Repository > Settings > Pages > Source: Deploy from branch ‘main’)
• Demo: https://3000-i38skua4y7218oj7gm3jy-6532622b.e2b.dev (Live demo - temporary URL)
• GitHub: https://github.com/siddhansh28/web

Key Features

🌟 Interactive Elements

• Moving Constellation Particle System: Canvas-based animated background with mouse interaction
• AI Chat Assistant: Intelligent chatbot that mimics Siddhansh’s personality and knowledge base
• MUN Speech Generator: AI-powered tool for generating diplomatic speeches, position papers, and resolutions
• Glassmorphism Design: Modern glass-like UI elements with backdrop blur effects
• Smooth Animations: AOS library integration with custom scroll-triggered animations

🎯 Core Sections

1. Hero Section: Dynamic introduction with animated profile and call-to-action buttons
2. About: Personal story, highlights, and animated statistics
3. Skills: Interactive skill bars with category organization (AI/ML, Web Dev, Data/Cloud, Leadership)
4. Projects: Filterable project showcase with detailed descriptions and live demos
5. Experience Timeline: Interactive career journey with achievements
6. Achievements: Recognition and awards showcase
7. Blog: Latest articles on AI, technology, and leadership
8. AI Tools: Interactive tools including chat assistant and MUN generator
9. Contact: Functional contact form with validation

🛠️ Technical Implementation

• Frontend: Vanilla JavaScript, CSS3, HTML5
• Libraries: AOS (Animate On Scroll), Font Awesome, Google Fonts
• Animation Engine: Custom constellation canvas system with performance optimization
• AI Systems: Rule-based chatbot with personality modeling, comprehensive MUN knowledge base
• Responsive Design: Mobile-first approach with breakpoints for all devices
• Performance: Optimized loading, lazy loading, and efficient animations
• Accessibility: WCAG compliance, keyboard navigation, screen reader support

Data Architecture

• AI Chat System: Personality-driven response system with contextual awareness
• MUN Generator: Comprehensive knowledge base covering countries, committees, and diplomatic procedures
• User Interactions: Client-side analytics with privacy-focused event tracking
• Content Management: Modular architecture for easy content updates

User Guide

Navigation

• Use the top navigation bar to jump to different sections
• Mobile users can access the hamburger menu for navigation
• Scroll indicator shows your current position

Interactive Features

1. AI Chat: Click “Start Chatting” in the AI Tools section to interact with Siddhansh’s AI assistant
2. MUN Generator: Select your delegation, committee, and topic to generate professional MUN content
3. Project Filter: Use filter buttons to view projects by category (All, AI/ML, Web Dev, MUN Tools)
4. Contact Form: Fill out the form to send a message directly

Keyboard Shortcuts

• Tab: Navigate through interactive elements
• Esc: Close any open modals
• Ctrl/Cmd + /: Show keyboard shortcuts help

Technical Features

Performance Optimizations

• Lazy loading for images and content
• Efficient particle system with optimized rendering
• Throttled scroll events for smooth performance
• Memory usage monitoring and cleanup

Accessibility

• WCAG 2.1 AA compliance
• Semantic HTML structure
• Keyboard navigation support
• Screen reader compatibility
• High contrast mode support
• Reduced motion preference handling

Browser Support

• Modern browsers (Chrome 60+, Firefox 60+, Safari 12+, Edge 79+)
• Progressive enhancement for older browsers
• Responsive design for all screen sizes

Deployment

• Platform: GitHub Pages
• Status: ✅ Active
• Tech Stack: HTML5 + CSS3 + Vanilla JavaScript
• CDN Libraries: Font Awesome, Google Fonts, AOS Animation Library
• Last Updated: 2024

Development Setup

1. Clone Repository:

   git clone https://github.com/siddhansh28/web.git
   cd web
   

2. Local Development:

   # Serve locally using any HTTP server
   python -m http.server 8000
   # or
   npx serve .
   

3. File Structure:

   webapp/
   ├── index.html              # Main HTML file
   ├── styles/
   │   ├── main.css           # Core styles and variables
   │   ├── components.css     # Component-specific styles
   │   └── animations.css     # Animation and modal styles
   ├── js/
   │   ├── constellation.js   # Particle system animation
   │   ├── ai-chat.js        # AI chat functionality
   │   ├── mun-generator.js  # MUN content generator
   │   ├── animations.js     # Scroll and UI animations
   │   ├── interactions.js   # User interactions and forms
   │   └── main.js           # Main app controller
   ├── .gitignore            # Git ignore rules
   └── README.md             # This file
   

Contributing

This is a personal portfolio project. For suggestions or feedback, please use the contact form on the website or reach out via GitHub.

License

© 2024 Siddhansh Govind. All rights reserved.

Contact

• Email: Available through contact form on website
• LinkedIn: Connect via social links on website
• GitHub: https://github.com/siddhansh28

---

Built with passion and cutting-edge technology to showcase the intersection of AI, diplomacy, and innovation.