YBK Cosmetics Indonesia - Landing Page for Skincare Brand
A bilingual, conversion-focused landing page for **YBK Cosmetics Indonesia**, a clean-beauty Korean skincare brand. At its heart is a 60-second "Skin Finder" quiz that matches each visitor to one of three product series and hands them off to marketplace checkout.
The problem
The website transforms casual browsers into confident, matched buyers by guiding every visitor through a structured conversion journey: **curiosity → diagnosis → matched series → purchase**. At the center of the experience is a **7-question Skin Finder quiz** that analyzes user responses and recommends a single skincare series tailored to their needs, supported by an animated **Skin Compatibility Score** and a clear explanation of why the match fits them. To reinforce trust at every stage, the experience integrates **credibility modules** such as award highlights, media mentions, ingredient-origin badges, and customer testimonials that continuously communicate YBK’s clinical and brand authority. The messaging strategy also directly addresses Indonesia’s environmental realities — **heat, humidity, and pollution** — positioning YBK as skincare intentionally designed to solve those conditions. Beyond conversion, the platform creates long-term brand value by **capturing email leads** at quiz completion before directing users to Shopee or TikTok Shop through tracked purchase buttons, enabling the growth of a first-party customer funnel. Supported by a built-in **Bahasa Indonesia / English toggle** and optimized through **Next.js performance and SEO best practices**, the experience is designed to feel fast, discoverable, and premium across every touchpoint.
Purpose
The site turns browsers into matched, confident buyers by guiding every visitor through a structured funnel of curiosity → diagnosis → matched series → purchase. At the center of the experience is a 7-question Skin Finder quiz that directs each user to a single recommended skincare series, supported by an animated Skin Compatibility Score and a clear explanation of why that specific match fits their skin profile. Throughout the page, trust modules such as award highlights, press mentions, ingredient-origin badges, and customer testimonials consistently reinforce the brand’s clinical credibility. The hero messaging and quiz questions also directly frame heat, humidity, and pollution as core skin concerns that the product line is designed to solve. After completing the quiz, the owned platform captures user emails before redirecting them to Shopee or TikTok Shop through tracked purchase links, enabling a stronger first-party marketing funnel. A built-in **ID/EN language toggle**, combined with **Next.js performance optimization and SEO best practices**, ensures the experience feels fast, discoverable, and positioned as a premium digital product.
Features
- Skin Finder Quiz: 7 questions, client-side scoring, routes to one of three series.
- Skin Compatibility Score gauge: signature animated SVG showing match strength.
- Three series detail pages: Relief Hydration, Pore, and Glow Brightening, each with ingredients, products, and a how-to-use routine.
- Email capture: at quiz completion (Resend, with graceful dry-run fallback).
- Bilingual ID/EN toggle: across all copy.
- Marketplace hand-off buttons: tracked Shopee & TikTok Shop CTAs.
- Trust modules: awards row, press strip, testimonials.
- SEO suite: Metadata API, JSON-LD (Organization + Product), `sitemap.xml`, `robots.txt`.
- Accessibility: `prefers-reduced-motion`, `aria-live` quiz announcements, WCAG-minded contrast.
- Collaboration / contact form: for KOL and B2B inquiries.
Want something like this?