AI-powered digital wardrobe & personal stylist. Digitize your closet, build your style profile, and let AI dress you every morning.
Built for Hack Canada — targeting four tracks: Best Use of Auth0, Best Use of Cloudinary, Best Use of Google Gemini API, and [MLH] Best Use of Solana.
Outfitted is a high-end web app where users photograph their clothing. The app strips the background via AI and stores every piece in a sleek virtual closet. Items can be marked as Owned (in your physical closet) or Wishlisted (items you want). From there, a Gemini-powered stylist reads your style profile and assembles curated outfit flatlay cards using only your owned items — and Solana records ownership of those items on-chain.
| Layer | Tools |
|---|---|
| Frontend | Next.js (App Router), TypeScript, Tailwind CSS, shadcn/ui, Lucide Icons, Zustand |
| Backend | Next.js API Routes, Drizzle ORM, PostgreSQL |
| Auth | Auth0 |
| Media & AI Cutout | Cloudinary (AI Background Removal) |
| Outfit AI | Google Gemini API |
| Blockchain | Solana (devnet) — @solana/web3.js, wallet adapters |
- Aesthetic: Minimalist Luxury — dark mode by default
- Style: Glassmorphism (frosted overlays), masonry/grid layouts, bold typography
- Palette: Monochrome with subtle gold or neon accents — premium fashion platform energy
A high-conversion landing page. Users hit Get Started and are routed through Auth0 for secure sign-up or login.
First-time users go through a two-part onboarding flow:
- The Guide — A skippable tutorial with tips for photographing clothes (flat surface, good lighting, contrasting background).
- The Questionnaire — A 5–10 question multi-step form covering personal style, vibe, fit preferences, and typical occasions.
- The Result — Answers compile into a single User Style string saved to their profile, which becomes the AI's context.
The core engine:
- Upload — Drag-and-drop clothing photos from phone or computer.
- Tag — Each item is marked as Owned (you have it) or Wishlisted (you want it).
- Process — The image is sent to Cloudinary, which returns a clean transparent PNG via AI background removal.
- On-Chain — Owned items are minted as lightweight NFTs on Solana devnet, creating a verifiable ownership record.
- Display — Items are laid over glassmorphic cards in a filterable grid. Filter by category, status (Owned/Wishlisted), wear frequency, or search by notes.
Where the magic happens:
- The Brains — Backend sends the User Style string + owned wardrobe items to the Gemini API. Wishlisted items are excluded — you can't wear what you don't have.
- The Output — Gemini returns outfit groupings (item IDs) with a 2-sentence stylist explanation for each look.
- The Canvas — The frontend assembles the transparent PNGs into a beautiful e-commerce-style flatlay Outfit Card using CSS Grid.
The user's identity hub:
- Manage account & logout
- View Style Badges generated from their questionnaire (e.g., "Streetwear Minimalist", "Corporate Goth")
- Retake the questionnaire anytime to update the AI stylist's parameters
outfitted/
├── frontend/ # Next.js app
└── backend/ # API routes & DB layer
Setup instructions coming soon. The app requires Auth0, Cloudinary, Google Gemini API keys, a local PostgreSQL instance, and a Solana wallet (Phantom recommended) connected to devnet.
| Track | Integration |
|---|---|
| Best Use of Auth0 | Secure authentication & user session management |
| Best Use of Cloudinary | AI background removal on clothing uploads |
| Best Use of Google Gemini API | LLM-powered outfit generation & style badge creation |
| [MLH] Best Use of Solana | On-chain ownership records for wardrobe items (NFT minting on devnet) |