
- Client
- The Ordinary
- Role
- Frontend engineering
- Stack
- Next.js 16, React 19, TypeScript, Lenis, JSON-LD
- Year
- 2026
01Challenge
Skincare marketing is noisy. The page had to feel scientific and honest while still moving product.
Typography and restraint had to carry the argument, not stock claims.
02Approach
Slow masked-line headline reveals and clip-path image wipes are driven by a single IntersectionObserver, keeping the motion quiet and consistent.
A working cart with a count badge, a search bar, and drawer panels for menu, account, and cart — all with scroll lock — handle the commerce side.
Product-level JSON-LD with real pricing and a generated Open Graph image make the page richer in search results.
03Outcome
A landing page that reads as credible first, promotional second.
The science earns the sale.