DresserToGo is a full-stack AI-powered wardrobe assistant built during CheeseHacks 2024. The system integrates a React Native mobile frontend, multiple Node.js/Flask backend servers, and AI-driven computer vision models to let users capture clothing images, upload them seamlessly to Google Drive, classify apparel, and dynamically generate personalized outfit recommendations for purposes such as what to wear, buy, recommend, etc.
Most wardrobes are underutilized because clothing is hard to organize and visualize at scale. DresserToGo solves this by combining AI object detection, cloud storage, and a mobile-first UI to automatically categorize outfits, reshuffle them like a digital closet, and even let users "like" clothing combos for inspiration or purchase.
- Camera Capture: Integrated with
expo-camerato capture clothing images, preview, and auto-upload to the backend. - Image Uploads: Immediate upload to a Google Drive–backed server via a dedicated
server2.jsAPI endpoint (/upload). - Collections Browser: Users can navigate Drive folders via the
CollectionandFolderBrowsercomponents, fetching file metadata through backend APIs. - Favorites: Dedicated screen to view curated "liked" outfits from Drive’s stitched folder.
- Dynamic Carousels: Clothing categories (Head, Top, Pants, Shoes) displayed via
react-native-reanimated-carousel. Reshuffle or "like" entire outfit combos inHomeWindowandMarketplace. - UI Components: Modularized
FolderCard,FolderBrowser, andBadgerNewsItemCardfor reusable and responsive layouts.
- Google Drive + Firestore: Hybrid setup where images are uploaded to Drive (
server2.js), with metadata stored in Firestore (firestore_utils.py). - Flask API (
server.py): Handles AI classification routes, Drive utilities (drive_utils.py), and Firestore operations (firestore_utils.py). - Node.js APIs:
server.js: Monitors Drive folders, triggers ML scripts, downloads new files, and runs classification pipelines.google-drive-server/server2.js: Upload endpoint for mobile app (handlesmultipart/form-datauploads).google-drive-server/server3.js: Handles "likes," stitches images into collages (stitch.py), and uploads results back to Drive.
- HumanClothesDetectionPipeline:
- Uses HuggingFace’s
hustvl/yolos-tiny(human detection) andvalentinafeve/yolos-fashionpedia(clothing detection). - Post-processes bounding boxes with IoU filtering and proportional adjustments (
utils.py) for robust segmentation.
- Uses HuggingFace’s
- Classification Flow:
- Uploaded images processed by
ml_module/main.py. - Cropped clothing images uploaded into category-specific Drive folders: Head, Top, Pants, Shoes.
- Uploaded images processed by
- Outfit Stitches: Liked outfits stitched together (
stitch.py) into composite images, with black pixels replaced by majority color for cleaner outputs. - Similarity Searcher: Prototype support for ViT-based feature embedding (
AutoImageProcessor+AutoModel) for future outfit similarity retrieval【main.py】.
- React Native (
expo-camera,react-native-reanimated-carousel,react-native-paper) - Expo FileSystem for local image management
- Modular component-based design
- Node.js (
express,googleapis,multer) for Drive integration - Flask for AI-serving routes
- Firebase Firestore for metadata persistence
- Google Drive API for file uploads, metadata, and stitched outputs
- HuggingFace
transformers(YOLOS, Fashionpedia) - PyTorch (
torch,torchvision) - OpenCV (
cv2) for cropping, bounding-box manipulation - Albumentations for resizing
- Custom post-processing (
iou,finalize_predictions,correct_clothing_bounding_boxes)
- Capture: User snaps a clothing photo in the mobile app.
- Upload: App sends the image to
server2.js, which uploads to Google Drive. - AI Processing:
- Drive monitor (
server.js) downloads new files. - AI pipeline (
main.py) detects human + clothing regions, crops items, and re-uploads them into category folders.
- Drive monitor (
- Frontend Display:
- Collections (
Collection.jsx,FolderBrowser.jsx) fetch categorized folders from Drive. - Carousels (
HomeWindow,Marketplace) assemble cross-category outfits.
- Collections (
- User Interaction:
- "Like" sends outfit metadata to
server3.js. - Outfits stitched (
stitch.py) and saved in Drive for retrieval in Favorites.
- "Like" sends outfit metadata to
- Feedback Loop: Firestore metadata tracks parsing/liked state, enabling future personalization.
- Outfit similarity search (Vision Transformer embeddings).
- User preference learning from likes.
- Marketplace integration for purchasing matched items.
- Targetted Advertisement for clothing.
- etc.
Frontend (React Native): Full UI implementation, camera capture, collections, favorites, outfit carousels.
Backend Integration: Built Google Drive upload pipeline, guided server integration, and product vision.
AI/ML & Server Logic: Developed in collaboration with team members (YOLOS + Fashionpedia pipelines).
Find Rest of the Team work/project submission on: CheeseHacks24': DressertoGo's Collaboration Github