DEV Community

Rafia Minhaj
Rafia Minhaj

Posted on

PawsitiveAI 🐾 - AI Dog Breed Classifier & Voice Companion

DEV Weekend Challenge: Dog Days Edition Submission πŸ•

Introducing PawsitiveAI 🐾

For the DEV Weekend Challenge (Dog Days Edition), I built PawsitiveAIβ€”a sleek, dark-themed, glassmorphic web application that serves as an AI-powered dog breed classifier and interactive voice companion.

It helps dog owners, prospective adopters, and dog lovers identify breeds from photos, discover traits, and listen to a custom voice-generated care guide!

πŸ”— Project Links


πŸš€ How It Works

  1. Upload & Analyze: Drag and drop or browse any dog image.
  2. Google AI Reasoning: The backend FastAPI server sends the image to Google's Gemini 1.5 Flash model, which classifies the breed and generates structured metadata (traits, care tips, fun facts, exercise requirements, and health indices).
  3. ElevenLabs Voice Synthesis: Clicking the "Listen to Care Guide" button triggers the ElevenLabs API to speak the personalized care guide in a clean, natural voice.
  4. Smart Fallback: If API keys are absent, the application gracefully activates Simulation Mode (mapping popular breeds) and leverages the browser's native Web Speech API for offline speech generation, ensuring a seamless, zero-cost UX for everyone.

πŸ› οΈ The Tech Stack

  • Backend Framework: FastAPI / Uvicorn (Python)
  • Frontend Design: Glassmorphic HTML5, CSS3 Variables, ES6 JavaScript (No heavy frameworks for maximum load speed).
  • AI Processing: Deprecating traditional vision APIs for Google AI Generative Models (google-generativeai).
  • Audio Synthesis: ElevenLabs TTS REST API + Browser SpeechSynthesis.

πŸ“Έ Interface Preview

Here is how the PawsitiveAI dashboard looks after classifying a Golden Retriever:

  • Accurate Match Confidence Indicators
  • Dynamic Telemetry Dial Meters (Exercise & Health Indices)
  • Interactive Play/Pause Voice Controllers

(Check out the repository for screenshots and codebase structure!)


πŸ’‘ What I Learned

During this weekend build, I learned how to handle unstructured image inputs to return strict JSON structures from LLMs (Gemini) and parse them safely on the client side. I also enjoyed designing a premium glassmorphic UI using pure CSS variables and radial gradient light sources.

Thank you to the DEV Community and the sponsors (Google AI & ElevenLabs) for organizing this challenge! 🐾

Top comments (0)