Skip to content

Latest commit

 

History

History
72 lines (53 loc) · 5.22 KB

File metadata and controls

72 lines (53 loc) · 5.22 KB

🎨 DoodlePic - Image to Sketch Converter

DoodlePic is a modern web application that converts your photos into stunning pencil sketches using advanced computer vision algorithms. Built with Flask and OpenCV, it provides a seamless, responsive experience across all devices for transforming digital images into artistic pencil sketches.

✨ Key Features

🖼️ Image Processing

  • Instant Conversion: Transform any image into artistic pencil sketch with one click
  • Drag & Drop Upload: Intuitive file upload with drag-and-drop functionality
  • Format Support: Handles PNG, JPG, JPEG, GIF formats with 5MB size limit
  • Real-time Processing: Fast image processing with optimized algorithms and progress feedback

📱 User Experience

  • Fully Responsive Design: Works seamlessly on all devices with mobile-first approach
  • SEO Optimized: Proper meta tags, structured data, and accessibility features
  • Error Handling: Robust error handling with user-friendly feedback messages
  • File Validation: Comprehensive validation for file types and sizes

💾 Output Management

  • One-Click Download: Download sketches in high quality PNG format instantly
  • Smart File Management: Automatic cleanup prevents storage accumulation with threading
  • Unique Naming: UUID-based filenames to avoid conflicts and ensure uniqueness
  • Secure Processing: Safe file handling with proper validation and cleanup

⚡ Performance

  • Optimized Algorithms: Efficient OpenCV operations for fast processing
  • Memory Management: Automatic cleanup of temporary files and memory optimization
  • Background Tasks: Periodic cleanup threading every 30 minutes
  • Efficient I/O: Optimized file input/output operations for better performance

💻 Tech Stack

Backend Framework

  • Flask 3.0.3 – Lightweight Python web framework for API endpoints
  • Python 3.8+ – Modern Python with async capabilities and robust libraries
  • OpenCV 4.10.0 – Industry-leading computer vision library for image processing

Image Processing Libraries

  • NumPy 1.26.4 – Scientific computing with array operations for image manipulation
  • OpenCV-Python – Computer vision algorithms for sketch generation
  • Pillow – Python Imaging Library for additional image processing capabilities

Frontend Technologies

  • HTML5 – Semantic markup with proper accessibility features
  • CSS3 – Responsive styling with modern layout techniques
  • JavaScript – Client-side functionality and user interactions

Deployment & Infrastructure

  • Gunicorn – Production WSGI HTTP server for Python applications
  • Heroku-ready – Procfile included for easy cloud deployment
  • Environment Management – Virtual environment support for dependency isolation

🧩 Challenges & Learnings

🤖 OpenCV Algorithm Implementation

Implementing the sketch generation algorithm using OpenCV presented significant challenges in achieving the right balance between artistic quality and processing speed. The initial implementation struggled with memory management during image processing. I learned to optimize the algorithm using grayscale conversion, inversion, Gaussian blur, and division operations to create realistic pencil sketch effects while maintaining performance.

🗂️ File Management & Cleanup

Managing temporary files and preventing storage accumulation required implementing a sophisticated cleanup system. The challenge was ensuring files were properly cleaned up without affecting active processing. I implemented threading-based periodic cleanup and request-scoped cleanup functions to maintain optimal storage usage while ensuring data integrity.

⚡ Performance Optimization

Optimizing image processing speed while maintaining sketch quality required careful tuning of OpenCV parameters and algorithm efficiency. Learning to balance processing speed with output quality involved experimenting with different blur kernel sizes and scaling factors to achieve optimal results across various image sizes and formats.

📱 Responsive Design Implementation

Creating a mobile-friendly interface for image upload and display required adapting drag-and-drop functionality for touch devices. Implementing proper responsive layouts and ensuring cross-browser compatibility taught me best practices for modern web application design and accessibility standards.

🔒 Security & Validation

Implementing robust file validation to prevent malicious uploads while maintaining user experience required comprehensive validation strategies. Learning to validate file types, sizes, and content helped me understand security best practices for file upload systems and prevent potential vulnerabilities.

🏆 Outcome

DoodlePic successfully delivers a comprehensive image-to-sketch conversion solution with intuitive user interface, reliable processing, and excellent performance. The application demonstrates proficiency in computer vision with OpenCV, full-stack web development with Flask, and creating user-centric applications that transform images into artistic sketches with remarkable quality and speed. The project showcases expertise in handling complex image processing tasks, implementing secure file handling, and creating responsive web applications with modern development practices.