CNN-STREAMLIT
Deep Learning Convolutional Neural Network Image Classifier
Test accuracy on Fashion-MNIST dataset
Shirts, Shoes, Bags, Coats, Dresses
CPU inference per single grayscale image
Dropout regularization preventing overfitting
Problem Statement & Target Users
The real-world business and technical bottleneck addressed
Traditional machine learning classifiers struggle with image pixel data due to lack of spatial invariance and inability to capture hierarchical edge features. Deep learning models often remain locked in notebooks without an accessible interactive interface for non-technical verification.
Target User Personas:
- โComputer vision students and researchers studying CNN architecture design
- โRetail catalog managers categorizing fashion apparel imagery automatically
- โML engineers evaluating PyTorch model inference speed on CPU runtimes
Technology Stack & Architecture Philosophy
Curated tools selected for performance, reliability, and developer experience
A multi-layer convolutional neural network architecture featuring Conv2D filters, ReLU activation, Batch Normalization, Max Pooling, and Dropout layers feeding into fully-connected classification heads.
CNN-STREAMLIT Architecture & Data Flow
Interactive structural nodes & deterministic processing sequence
1. Input Normalizer
Resizes, converts to grayscale, and normalizes pixel values to [0, 1].
2. Conv Block 1
Conv2D (1->32 channels, 3x3 kernel) + BatchNorm + ReLU + MaxPool(2x2).
3. Conv Block 2
Conv2D (32->64 channels, 3x3 kernel) + BatchNorm + ReLU + MaxPool(2x2) + Dropout(0.25).
4. Dense Classifier
Flatten + Linear(64*7*7 -> 128) + Dropout(0.5) + Linear(128 -> 10).
5. Streamlit Canvas UI
Allows users to upload custom images or sketch directly on a canvas for live predictions.
โก Deterministic Execution Pipeline (End-to-End Flow)
- 1User uploads an image file or draws an apparel silhouette on the digital canvas.
- 2Image preprocessor converts input to 28x28 grayscale, inverts colors if needed, and applies standard tensor transforms.
- 3Preprocessed tensor is passed through the trained PyTorch forward pass.
- 4Conv2D layers extract hierarchical edges, textures, and apparel shape contours.
- 5Softmax layer calculates confidence distribution across all 10 target categories.
- 6Streamlit interface renders top-3 predictions with visual confidence percentage bars.
Technical Tradeoffs & Architecture Decisions
Why specific design decisions were chosen over common alternatives
Engineering Rationale: Using direct PyTorch weights simplified the codebase and avoided extra dependencies while achieving <45ms CPU latency.
Engineering Rationale: Fashion-MNIST features richer internal contours and realistic textures, making it a far more rigorous benchmark.
Failure Handling & Edge-Case Resilience
Protecting uptime, data integrity, and degraded operational states
- !Dynamic Channel Conversion: Handles RGB, RGBA, and CMYK image uploads by automatically stripping alpha channels and converting to single-channel luminance.
- !Out-of-Bounds Resizing: Uses anti-aliased bicubic interpolation to preserve shape integrity when downsampling high-res images.
Security, Privacy & Data Retention
Ethical data handling and client isolation principles
- ๐Local CPU Execution: Inference runs in-memory without sending images to any external third-party API.
Results & Measurable Outcomes
Verified performance metrics and business deliverables
- โ 89.3% test accuracy on test set of 10,000 unseen apparel images.
- โ Interactive UI enabling real-time testing of custom user images.
Known Limitations
- โขInput images must be cropped closely to the garment to match Fashion-MNIST distribution.
- โขLow 28x28 resolution limits classification of complex layered outfits.
Future Roadmap
- โขTransfer learning with MobileNetV3 or ResNet-18 for high-resolution 224x224 color fashion datasets.
- โขWebCam capture mode for real-time item scanning.
Explore More or Review Credentials
Ready to see how CNN-STREAMLIT fits into real-world production engineering?