Inspiration
Skincare e-commerce runs on guesswork. Shoppers pick products by ads and influencers, not by their own skin; wrong picks mean wasted money and high return rates for retailers. A selfie, on the other hand, already contains the signal — if you can measure it. Perfect Corp's YouCam AI Skin Analysis API measures it. SkinScope connects the two: analysis first, shopping second.
What it does
- Upload one front-facing selfie (drag & drop or file picker), with built-in photo guidance (face 60–80% of frame, even light, forehead visible — the same rules the API enforces).
- SkinScope's server calls the YouCam AI Skin Analysis API (V2) and scores 14 concerns: wrinkles, pores, texture, acne, oiliness, radiance, eye bags, age spots, dark circles, upper/lower eyelid droop, firmness, hydration, redness.
- A report dashboard shows the overall skin score, estimated skin age, and a score bar per concern (0–100, higher = healthier), each with a link to the API's detection-mask image.
- The three lowest scores drive the retail layer: concrete product-category recommendations (e.g., pores 66 → niacinamide serum + weekly clay mask) and a full AM/PM + weekly routine. Categories only, never brands — any retailer can map them onto its own catalogue, which is exactly where analysis becomes conversion and fewer returns.
How I built it
- Zero-dependency Node.js (≥18) server + vanilla JS frontend. No build step, no npm packages.
- YouCam API V2 server-to-server flow, implemented from the official docs: POST /s2s/v2.0/file/skin-analysis → PUT the image to the returned pre-signed URL → POST /s2s/v2.0/task/skin-analysis with 14 SD dst_actions and format "json" → poll GET /s2s/v2.0/task/skin-analysis/{id} until success.
- The API key lives only on the server (environment variable); photos are forwarded in memory and never stored.
- Verified end-to-end with a real key and the 1,000 hackathon units: a real run on the bundled AI-generated test portrait returned overall 78.6, skin age 39, all 14 metrics and mask URLs (sanitized capture in the repo, test/sample-live-result.json). Real integration findings baked into the code and docs: HD/SD dst_actions must never be mixed; skin_age arrives as {"type":"skin_age","score":N}; a face under 60% of frame width fails with error_src_face_too_small (the repo's test photo is cropped for exactly this reason).
- No API key? The app runs in a clearly labeled demo mode using the sample scores published in the official API documentation, so anyone can try the full UI immediately.
Challenges
- The two-phase upload (register file, then PUT to a pre-signed URL) is easy to get wrong — skipping the PUT yields 500/404s.
- Response-shape details (overall "all" entry, skin_age in "score", the extra resize_image entry) are only visible in a real response; I captured one and hardened the normalizer against it, with regression notes in TESTING.md.
What's next
- Map recommendation categories to a real retailer catalogue API for live product cards and prices.
- Optional HD analysis mode and multi-photo progress tracking (score history over time).
Built With
- ai
- analysis
- api
- css
- html
- javascript
- node.js
- skin
- youcam