Inspiration
Beauty and skincare decisions are still mostly guesswork—generic routines and unrelated product picks. We wanted a loop that feels personal: measure skin from a selfie, connect habits to changes, and show what consistency (or neglect) could look like years later, using Perfect Corp’s APIs so it isn’t slideshow UX—it’s real AI.
What it does
SkinTwin gives logged-in users one journey: capture or upload a selfie → AI skin scores + undertone → habits, shelf, trends, and insights → personalized product recommendations with “why this matches you” → AI skin simulation (before/after scenarios). Everything is tied to their account so scans and history persist.
How we built it
We used Next.js (App Router) and TypeScript on the front, API routes on the server for Perfect Corp and Supabase, Tailwind for UI, Recharts for trends/radar, and Supabase for auth, Postgres data, and optional image storage. Perfect Corp calls run server-side with timeouts and polling so flows don’t hang; we added demo seeding so judges can experience the full app without a camera.
Challenges we ran into
Perfect Corp responses vary by console/version—we had to parse nested poll results, handle image size / face framing errors, and avoid infinite “generating” states with client + server timeouts. Linking auth users to app DB rows for foreign keys took careful alignment. localStorage quota forced trimming scan history. Making future simulations feel distinct in UX (slider, scenarios, copy) helped even when the API’s visual delta is subtle.
Accomplishments that we're proud of
Three Perfect Corp APIs in one coherent product—not a single demo endpoint. Auth-gated, user-scoped data end-to-end. A retail-facing recommendations layer with explicit rationale. A demo mode that populates realistic data in one click. Polished pastel UI, Skin Card export, and a submission story that matches the hackathon’s consumer/retail angle.
What we learned
API integration is half the product—the other half is reliability, empty states, and judge-proof demos. Skin + simulation products need clear disclaimers and honest live vs demo labeling. Small UX choices (slider, badges, seed button) matter more than extra features for hackathon judging.
What's next for Perfect Skin
Deeper routine ↔ product links (ingredient conflicts, AM/PM slots), compare two scans side-by-side, optional partner SKU or affiliate hooks if allowed, and tighter mobile capture. Longer term: brand dashboards or clinic handoff summaries—same core loop, bigger distribution.
Log in or sign up for Devpost to join the conversation.