| title | MediSkin AI |
|---|---|
| emoji | π©Ί |
| colorFrom | blue |
| colorTo | green |
| sdk | docker |
| pinned | false |
| app_port | 7860 |
Deployed on Hugging Face Spaces (Docker)
| Page | URL |
|---|---|
| π Home | https://sree8639-mediskin-ai.hf.space/ |
| π¬ Diagnostics | https://sree8639-mediskin-ai.hf.space/diagnostics/ |
| π€ Profile | https://sree8639-mediskin-ai.hf.space/profile/ |
| π Report Preview | https://sree8639-mediskin-ai.hf.space/pdf-demo/ |
Demo credentials β Username:
demoΒ· Password:demo123
Watch a full walkthrough of MediSkin AI in action β from image upload to PDF report download.
π Watch Demo on Vimeo
- Overview
- Features
- Tech Stack
- Architecture
- Supported Conditions
- Getting Started
- Project Structure
- API Reference
- Deployment
- Environment Variables
- Contributing
MediSkin AI is a production-grade, full-stack web application that uses a deep learning model (24.7M parameters) trained on a curated dermatology dataset to classify skin conditions from uploaded photographs. The platform provides:
- Instant AI-powered skin disease classification with confidence scores
- Differential diagnosis table (top 3 predictions)
- Downloadable PDF diagnostic reports
- Nearby dermatology clinic recommendations via Google Maps
- Secure user authentication with Google OAuth 2.0
- Personalized user profiles with prediction history
β οΈ Medical Disclaimer: MediSkin AI is an informational tool only. It does not replace professional medical diagnosis. Always consult a qualified dermatologist for treatment.
| Feature | Detail |
|---|---|
| Model Architecture | Custom CNN (MobileNetV2-based), 24.7M parameters |
| Input Resolution | 224 Γ 224 pixels |
| Output Classes | 10 skin conditions |
| Training Accuracy | 81% |
| Test / Inference Accuracy | ~77% |
| Confidence Display | Percentage score + animated bar |
| Differential Diagnosis | Top-3 ranked predictions in a table |
| PDF Report | Download full report (html2pdf.js + jsPDF) |
| Feature | Detail |
|---|---|
| Standard Login | Username + password |
| Google OAuth 2.0 | One-click sign-in via django-allauth |
| Password Reset | Secure temp password via email |
| Session Management | Django sessions |
- Full name, email, phone number management
- Location: country β state β district β city cascade
- Profile picture upload
- Prediction history log
- State/district/city cascade selector (India-focused)
- Embedded Google Maps iframe showing nearby dermatology clinics
- Curated hospital database per city
- Welcome email on signup/login (branded HTML template)
- Password reset email (secure, temp password only via email)
- HTTP-based via Brevo API (300 emails/day free, works on HF Spaces)
| Technology | Version | Purpose |
|---|---|---|
| Django | 5.x | Web framework, ORM, authentication |
| django-allauth | 0.61+ | Google OAuth 2.0 integration |
| TensorFlow / Keras | 2.15+ | ML model inference |
| Gunicorn (gthread) | 21.2+ | WSGI server (4 threads) |
| WhiteNoise | 6.6+ | Static file serving |
| Pillow | 10.0+ | Image processing & validation |
| Brevo API | v3 | HTTP email delivery (SMTP-free) |
| Technology | Purpose |
|---|---|
| Vanilla HTML5 + CSS3 | Semantic markup, responsive layouts |
| Vanilla JavaScript (ES6+) | DOM manipulation, API calls, state |
| html2pdf.js | Client-side PDF report generation |
| Google Fonts (Outfit) | Typography |
| Technology | Purpose |
|---|---|
| Docker | Containerization |
| Hugging Face Spaces | Production hosting |
| SQLite | Database (HF Spaces) |
| PostgreSQL | Database (production) |
| Hugging Face Hub | Model artifact storage |
flowchart TD
subgraph HF["βοΈ Hugging Face Spaces β Docker Container"]
direction TB
subgraph Client["Client Layer"]
B["π Browser\nHTML / CSS / JS"]
end
subgraph Server["Server Layer"]
G["βοΈ Gunicorn\ngthread Β· 4 threads"]
D["π Django App"]
V["π Views & URLs"]
ML["π€ ML Model\nTensorFlow Β· pre-loaded"]
DB["ποΈ SQLite DB"]
end
subgraph Static["Static Assets"]
WN["π¦ WhiteNoise\n/staticfiles/"]
end
subgraph External["External Services"]
HFH["π€ HF Hub\nskin-disease-model"]
GO["π Google OAuth\ndjango-allauth"]
BR["π§ Brevo API\nEmail Delivery"]
end
B -->|HTTP Request| G
G --> D
D --> V
V --> ML
V --> DB
WN -->|CSS Β· JS Β· Images| B
HFH -->|Download at startup| ML
GO <-->|OAuth 2.0| D
BR <-->|HTTP Email| D
end
flowchart LR
A["πΈ User Uploads\nSkin Image"] --> B["β
Pillow\nValidation"]
B --> C["π€ ML Model\nInference"]
C --> D["π Top-10 Class\nProbabilities"]
D --> E["β οΈ Severity\nClassification"]
E --> F["π‘ Recommendations\nGenerated"]
F --> G["π Display Results\n+ PDF Download"]
The model classifies 10 skin conditions with a training accuracy of 81% and test/inference accuracy of ~77%:
| # | Condition | Category |
|---|---|---|
| 1 | Eczema | Inflammatory |
| 2 | Warts, Molluscum & Viral Infections | Infectious |
| 3 | Melanoma | Malignant |
| 4 | Atopic Dermatitis | Inflammatory |
| 5 | Basal Cell Carcinoma (BCC) | Malignant |
| 6 | Melanocytic Nevi (NV) | Benign |
| 7 | Benign Keratosis-like Lesions (BKL) | Benign |
| 8 | Psoriasis & Lichen Planus | Autoimmune |
| 9 | Seborrheic Keratoses | Benign |
| 10 | Tinea / Ringworm / Fungal Infections | Infectious |
- Python 3.10+
- Git
1. Clone the repository
git clone https://github.com/your-username/mediskin-ai.git
cd mediskin-ai2. Create and activate virtual environment
python -m venv venv
# Windows
venv\Scripts\activate
# macOS/Linux
source venv/bin/activate3. Install dependencies
pip install -r requirements.txt4. Configure environment variables
cp backend/.env.example backend/.env
# Edit backend/.env with your values5. Download the ML model
python download_model_locally.py6. Run migrations and start server
cd backend
python manage.py migrate
python manage.py collectstatic --noinput
python manage.py runserver7. Open in browser
http://127.0.0.1:8000
mediskin-ai/
β
βββ π backend/ # Django application
β βββ π main/ # Core app
β β βββ views.py # All API endpoints + page views
β β βββ models.py # UserProfile, SkinPrediction
β β βββ urls.py # URL routing
β β βββ adapters.py # Google OAuth custom adapter
β β βββ signals.py # Auto-create profile on user creation
β βββ π mediskin/ # Django project config
β β βββ settings.py # Base settings (development)
β β βββ settings_hf.py # HF Spaces production settings
β β βββ urls.py # Root URL config
β βββ π ml/ # Machine learning
β β βββ predict.py # Inference engine (pre-loaded model)
β β βββ π models/ # Model artifact directory
β β βββ skin_disease_classifier.h5
β βββ manage.py
β
βββ π frontend/ # Static assets & templates
β βββ π templates/ # Django HTML templates
β β βββ home.html # Landing page
β β βββ login.html # Login page
β β βββ create-account.html # Registration page
β β βββ diagnostics.html # AI diagnosis page β
β β βββ profile.html # User profile page
β β βββ reset-password.html # Password reset page
β β βββ pdf-demo.html # Report preview & download
β βββ π static/
β βββ π css/ # Page-specific stylesheets
β β βββ global.css # Design system & shared styles
β β βββ login.css # Login page styles
β β βββ diagnostics.css # Diagnostics page styles
β β βββ ...
β βββ π js/ # Page-specific scripts
β β βββ config.js # API base URL config
β β βββ logo.js # Logo + icon injection (base64)
β β βββ diagnostics.js # Upload, predict, report logic
β β βββ ...
β βββ π images/ # Static image assets
β βββ logo.png
β
βββ π³ Dockerfile # Docker container definition
βββ π hf_start.sh # HF Spaces startup script
βββ π requirements.txt # Python dependencies
βββ π§ upload_model_to_hf.py # Utility: push model to HF Hub
βββ π₯ download_model_locally.py # Utility: pull model for local dev
βββ π README.md
All API endpoints are under /api/. Authentication required unless noted.
| Method | Endpoint | Description | Auth |
|---|---|---|---|
POST |
/api/register/ |
Create account | β |
POST |
/api/login/ |
Login with username/password | β |
POST |
/api/logout/ |
Logout | β |
GET |
/accounts/google/login/ |
Initiate Google OAuth | β |
GET |
/auth/google/complete/ |
OAuth callback bridge | β |
| Method | Endpoint | Description | Auth |
|---|---|---|---|
GET |
/api/profile/ |
Get profile data | β |
POST |
/api/profile/update/ |
Update profile info | β |
POST |
/api/profile/picture/ |
Upload profile picture | β |
POST |
/api/change-password/ |
Change password | β |
POST |
/api/reset-password/ |
Password reset via email | β |
| Method | Endpoint | Description | Auth |
|---|---|---|---|
POST |
/api/predict/ |
Upload image & get AI diagnosis | β |
GET |
/api/history/ |
Get prediction history | β |
POST |
/api/feedback/ |
Submit prediction feedback | β |
curl -X POST https://sree8639-mediskin-ai.hf.space/api/predict/ \
-H "Cookie: sessionid=your-session-id" \
-F "image=@skin_sample.jpg"{
"success": true,
"disease": "Eczema",
"confidence": 87.4,
"severity": "Moderate",
"top_predictions": [
{"rank": 1, "disease": "Eczema", "confidence": 87.4},
{"rank": 2, "disease": "Psoriasis Lichen Planus", "confidence": 7.2},
{"rank": 3, "disease": "Atopic Dermatitis", "confidence": 3.1}
],
"recommendations": [
"Consult a licensed dermatologist",
"Apply fragrance-free moisturiser twice daily",
"Avoid known irritants and allergens"
]
}- Runtime: Docker (
python:3.10-slim) - Server: Gunicorn (1 worker, 4 gthread threads)
- Model: Downloaded from HF Hub at startup (
sree8639/skin-disease-model) - Database: SQLite (ephemeral; resets on container restart)
- Static Files: WhiteNoise (served directly from Django)
1. Download ML model from HF Hub (if not cached)
2. Run Django migrations
3. Collect static files
4. Create demo superuser (demo / demo123)
5. Test SMTP connectivity
6. Setup Google OAuth SocialApp in DB
7. Start Gunicorn on port 7860
- Fork this repository
- Create a new Hugging Face Space (Docker)
- Add your repo as the Space source
- Configure Secrets (see below)
- Push β HF automatically builds and deploys
| Variable | Description |
|---|---|
SECRET_KEY |
Django secret key (generate with python -c "from django.core.management.utils import get_random_secret_key; print(get_random_secret_key())") |
GOOGLE_CLIENT_ID |
Google OAuth client ID |
GOOGLE_CLIENT_SECRET |
Google OAuth client secret |
HF_MODEL_REPO |
HF Hub repo ID for ML model (e.g. sree8639/skin-disease-model) |
| Variable | Default | Description |
|---|---|---|
BREVO_API_KEY |
β | Brevo API key for email delivery |
BREVO_SENDER_EMAIL |
anyasreekadali@gmail.com |
Verified sender email |
DEBUG |
False |
Enable Django debug mode |
ALLOWED_HOSTS |
*.hf.space |
Comma-separated allowed hostnames |
- Go to console.cloud.google.com
- Create OAuth 2.0 credentials (Web application)
- Add Authorised Redirect URI:
https://your-space-name.hf.space/accounts/google/login/callback/ - Copy Client ID and Client Secret β add as HF Secrets
Contributions are welcome! Please follow these steps:
- Fork the repository
- Create a feature branch:
git checkout -b feature/your-feature - Commit your changes:
git commit -m 'feat: add your feature' - Push to the branch:
git push origin feature/your-feature - Open a Pull Request
- Follow PEP 8 for Python code
- Test API endpoints with the provided
backend/ml/test_predictions.py - Never commit secrets or
.envfiles - Keep the ML model in HF Hub, not in the repo
This project is licensed under the MIT License.
