Baymax Lite

A healthcare companion chatbot inspired by the inflatable healthcare robot from Big Hero 6.

Comment

Baymax Lite - Project Story

💡 Inspiration

The inspiration for Baymax Lite came from the beloved inflatable healthcare companion from Disney's "Big Hero 6." Just like the original Baymax, our AI companion embodies the gentle, caring nature of a personal healthcare robot with his signature phrase: "I am satisfied with my care."

In a world where healthcare information can be overwhelming and medical concerns often cause anxiety, we wanted to create a calming, supportive AI assistant that could provide preliminary health guidance while maintaining the warm, methodical personality that made Baymax so endearing.

🎯 What We Built

Baymax Lite is an AI-powered healthcare companion that combines:

  • Conversational AI using Google's Gemini models for intelligent health discussions
  • Image Analysis capabilities for visual symptom assessment and wound evaluation
  • Caring Personality that mirrors the original Baymax's gentle, thorough approach
  • Modern Web Interface built with Next.js, React, and Tailwind CSS
  • Real-time Interactions with typing animations and smooth transitions

Key Features

  • 🔍 Visual Health Assessment: Upload images of symptoms, injuries, or concerns for AI analysis
  • 💬 Intelligent Conversations: Multi-turn conversations with context awareness
  • 🎭 Baymax Personality: Caring, methodical responses with gentle medical guidance
  • 📱 Responsive Design: Works seamlessly on desktop and mobile devices
  • ⚡ Fast Performance: Optimized with caching and multiple AI model fallbacks
  • 🔒 Privacy-Focused: No data persistence, images processed in-memory only

🛠️ How We Built It

Technology Stack

Frontend:

  • Next.js 15 - React framework with App Router
  • TypeScript - Type-safe development
  • Tailwind CSS - Utility-first styling
  • Custom Hooks - Reusable logic for typewriter effects and form handling

Backend:

  • Google Gemini AI - Multiple model support (gemini-2.5-flash-lite, gemini-1.5-pro, etc.)
  • Next.js API Routes - Serverless API endpoints
  • Image Processing - Base64 encoding with format validation
  • Response Caching - In-memory caching for common queries

UI/UX:

  • Shadcn/ui Components - Accessible, customizable component library
  • Custom Animations - Smooth transitions and typewriter effects
  • Responsive Layout - Mobile-first design approach

Architecture Decisions

  1. Component-Based Design: Modular React components for maintainability
  2. Type Safety: Comprehensive TypeScript interfaces for all data structures
  3. Error Handling: Graceful fallbacks and user-friendly error messages
  4. Performance: Multiple AI model fallbacks and intelligent caching
  5. Accessibility: Proper ARIA labels and semantic HTML

🎨 Design Philosophy

Visual Identity

  • Baymax-Inspired Colors: Red gradients and gentle grays reflecting the character
  • Soft UI Elements: Rounded corners and gentle shadows for a caring feel
  • Animated Avatar: Pulsing circles around Baymax's logo for life-like presence
  • Clean Typography: Easy-to-read fonts for medical information clarity

User Experience

  • Gentle Onboarding: Large, welcoming interface that transitions to chat view
  • Contextual Assistance: Dynamic placeholders and helpful suggestions
  • Progressive Disclosure: Information revealed as needed, not overwhelming
  • Consistent Feedback: Loading states, typing indicators, and clear responses

🧠 What We Learned

Technical Learnings

  1. AI Integration Complexity: Managing multiple AI models and handling API quotas requires careful orchestration
  2. Image Processing: Converting files to base64 and validating formats across different browsers
  3. Real-time UX: Creating smooth animations and transitions while maintaining performance
  4. TypeScript Mastery: Advanced type checking for complex data structures and API responses
  5. Error Resilience: Building robust error handling for AI services and network issues

Healthcare AI Insights

  1. Ethical Considerations: Always emphasizing professional medical care over AI diagnosis
  2. Language Sensitivity: Using gentle, non-alarming language for health discussions
  3. Context Awareness: Maintaining conversation history for better health guidance
  4. Image Analysis Ethics: Providing observations without definitive diagnoses

User Experience Discoveries

  1. Trust Building: Users respond better to caring, methodical communication
  2. Visual Feedback: Image previews and loading states significantly improve perceived reliability
  3. Mobile Optimization: Healthcare discussions often happen on mobile devices
  4. Accessibility: Clear language and proper semantic structure are crucial for health information

🚧 Challenges We Faced

Technical Challenges

1. AI Model Reliability

  • Problem: API quota limits and model availability issues
  • Solution: Implemented cascading fallback system across multiple Gemini models
  • Learning: Always have backup plans for external services

2. Image Format Compatibility

  • Problem: Frontend sending object format while backend expected data URLs
  • Solution: Created flexible validation that handles both formats
  • Learning: Ensure consistent data contracts between frontend and backend

3. TypeScript Type Safety

  • Problem: Complex union types for image data causing compilation errors
  • Solution: Used type assertions and proper type guards
  • Learning: Sometimes pragmatic typing is better than perfect typing

4. Performance Optimization

  • Problem: Large image uploads and AI processing causing delays
  • Solution: Implemented caching, image compression, and loading states
  • Learning: User perception of speed is as important as actual speed

Design Challenges

1. Balancing Personality with Professionalism

  • Problem: Making Baymax caring without seeming unprofessional for medical advice
  • Solution: Careful language crafting and consistent disclaimers
  • Learning: Healthcare AI needs both warmth and clear boundaries

2. Mobile Responsiveness

  • Problem: Complex layouts breaking on smaller screens
  • Solution: Mobile-first design with progressive enhancement
  • Learning: Start with constraints, then enhance for larger screens

3. Information Hierarchy

  • Problem: Presenting complex health information clearly
  • Solution: Structured responses with clear sections and next steps
  • Learning: Healthcare information needs careful organization and formatting

Product Challenges

1. Scope Management

  • Problem: Wanting to build comprehensive medical features in limited time
  • Solution: Focused on core chat and image analysis features
  • Learning: Better to excel at fewer features than poorly implement many

2. Legal and Ethical Considerations

  • Problem: Ensuring AI doesn't overstep into medical diagnosis territory
  • Solution: Clear disclaimers and emphasis on professional medical care
  • Learning: Healthcare AI requires careful ethical boundaries

🔮 Future Enhancements

Planned Features

  • Voice Interaction: Speech-to-text and text-to-speech capabilities
  • Health Tracking: Simple symptom logging and trends
  • Emergency Detection: Recognition of urgent medical situations
  • Multi-language Support: Healthcare assistance in multiple languages
  • Integration APIs: Connect with health record systems

Technical Improvements

  • Database Integration: Conversation history and user preferences
  • Advanced Caching: Redis or similar for production scalability
  • Image Enhancement: Better image processing and analysis
  • Real-time Features: WebSocket connections for instant responses

🎉 Conclusion

Building Baymax Lite was an incredible journey that combined our love for thoughtful design, cutting-edge AI technology, and genuine care for user wellbeing. The project challenged us to think deeply about the intersection of technology and healthcare, pushing us to create something that's not just functional, but truly caring.

The most rewarding aspect was seeing how the gentle, methodical personality of our AI companion could make healthcare discussions feel less intimidating and more supportive. Just like the original Baymax, our goal was to create a healthcare companion that users can trust and feel comfortable with.

We're proud of what we've built and excited about the potential for AI to make healthcare more accessible, understandable, and human-centered.

"I am satisfied with my care" - Baymax Lite

Built with ❤️ for TerraHacks 2025

Built With

Share this project:

Updates