ScenarioTwin Mirror

Turn one outfit photo into scene-ready beauty looks for pitch day, date night, and video interviews.

Comment

Inspiration

Most virtual try-on tools answer a simple question: “How would this look on me?” But in real life, the better question is often contextual: “What should change for this moment?”

The same outfit can feel different on pitch day, at dinner, or on camera. ScenarioTwin Mirror was inspired by that gap. We wanted to build a focused beauty try-on experience that keeps the outfit fixed, then adapts makeup and styling strategy to different real-life scenes.

What It Does

ScenarioTwin Mirror lets a user upload one clear face photo and generate three scene-specific looks:

Pitch Day Date Night Zoom Interview

For each scene, the app shows a Before / After result, a visible Perfect API badge, and an API + Scene Recipe panel.

The core visual transformation is powered by the Perfect Corp Makeup Virtual Try-On API. On top of that, ScenarioTwin adds a scene intelligence layer that explains the makeup direction, skin strategy, accessory recommendation, and lightweight retail value.

How We Built It

We built ScenarioTwin Mirror as a desktop web app using:

React TypeScript Vite Node.js / Express Perfect Corp Makeup VTO API Hyperframes for the final demo video Doubao TTS for narration

The frontend handles upload, scene selection, generation states, Before / After comparison, recipe panels, and the retail demo section.

The backend protects the API key, validates uploaded images, calls the Perfect Corp API, and returns standardized scene results. We also built demo-safe fallback behavior so the experience can still be presented if a remote API call fails, while clearly labeling fallback results.

Challenges

The biggest challenge was keeping the project honest and focused. We intentionally avoided overbuilding features like clothing replacement, attractiveness scoring, real checkout, or unsupported API claims.

We also had to handle real API constraints, including image size limits, upload validation, asynchronous generation, polling, and fallback behavior. Another challenge was making three generated looks feel meaningfully different while still keeping the same outfit and identity as the anchor.

For the demo video, we compressed a real end-to-end app walkthrough into a short submission-friendly format, while keeping the API integration and product value understandable.

What We Learned

We learned that virtual try-on becomes more useful when it is tied to intent, not just appearance. A scene-aware beauty workflow can help consumers make better decisions and help retailers frame products around real occasions.

We also learned the importance of clear technical boundaries in a hackathon project. The strongest version of this demo is not the one that claims the most features, but the one that proves one real API integration and wraps it in a compelling, practical product experience.

What’s Next

Next, ScenarioTwin Mirror could expand in three directions:

Add real Skin Analysis to personalize finish, shine control, and lighting recommendations Add real Accessories or Fashion API integration for deeper retail bundles Turn the scene intelligence layer into a reusable retailer widget: “Try this product in your scenes”

Our long-term vision is a contextual beauty and retail experience where users do not just try on a look, but understand why that look fits the moment.

Built With

Share this project:

Updates