Meet your future self. One selfie. Two futures. We show you what you look like in 20 years — and exactly how to change it with the right skincare and makeup, today.

Built for the Perfect Corp × Startup World Cup Hackathon (Silicon Valley, May 2026).

A web experience that turns a single selfie into a personalized skincare wake-up call:

1. Scan — User uploads a selfie. The app fans out three Perfect Corp APIs in parallel:
   • AI Skin Analysis — pores, wrinkles, texture, pigmentation, dark circles, redness, oiliness
   • AI Aging Generator — projects the same face 10 / 20 / 30 / 40 years out
   • AI Face Analyzer — face shape + features that drive makeup placement
2. Reveal — Cinematic two-timelines split: Today vs. In 20 years (if nothing changes).
3. Diagnostic — Skin scores in a glanceable grid, each paired with the exact ingredient/routine that addresses it (retinol for wrinkles, BHA for pores, etc.).
4. Try-on — Three curated makeup looks, each engineered to minimize the user's measured concerns. AI Makeup Try-On renders the chosen look on the user's face. Product cards turn the experience into a buying journey.

Skincare is a $190B market built on guesswork — most people don't know their skin's actual concerns or which products solve them. Time Mirror collapses that into a 30-second loop:

• Diagnose the exact problem (Skin Analysis)
• Visualize the cost of inaction (Aging Generator)
• Prescribe the routine + makeup that solves it (Face Analyzer + Makeup VTO)
• Convert with curated product cards

Four APIs, one continuous purchase path.

cd time-mirror
cp .env.local.example .env.local
# edit .env.local and paste your Perfect Corp API key:
#   PERFECTCORP_API_KEY=...
# get one at https://yce.makeupar.com/api-console/en/api-keys/

npm install
npm run dev

Visit http://localhost:3000.

GET /api/health — confirms the key is valid without burning units.

/demo — exercises every UI stage with stock data; useful for screenshots and judging without spending API units.

src/
├── app/
│   ├── page.tsx              ← state machine: idle → scanning → revealing → plan
│   ├── demo/page.tsx         ← stage-stub for QA/screenshots
│   └── api/
│       ├── scan/route.ts     ← parallel: skin-analysis + aging-generator + face-analyzer
│       ├── makeup/route.ts   ← makeup-vto with the selected look's effects
│       └── health/route.ts   ← API key smoke test
├── components/
│   ├── Hero.tsx              ← landing + selfie capture (uses HTMLInputElement capture="user")
│   ├── Scanning.tsx          ← 3-step progress while APIs run
│   ├── Reveal.tsx            ← cinematic two-futures split-screen
│   ├── Diagnostic.tsx        ← skin scores grid with personalized routine tips
│   └── Looks.tsx             ← 3 curated looks → makeup-vto → before/after + products
└── lib/
    ├── perfectcorp.ts        ← upload → createTask → pollTask wrapper
    ├── looks.ts              ← curated makeup looks (effects + product suggestions)
    ├── types.ts              ← API response shapes
    └── demoData.ts           ← stock data for /demo

Auth: Authorization: Bearer <api-key>. Every task follows the upload-meta → presigned PUT → create-task → poll pattern, abstracted in src/lib/perfectcorp.ts.

• Next.js 16 (App Router) + TypeScript
• Tailwind CSS v4
• Geist + Playfair Display

No database, no auth, no analytics — photos pass through Perfect Corp's 24h-retention pipeline and never touch our servers.