Big Boss Studio, for COTY, 2021

Kylie Cosmetics

Point-of-sale app: virtual try-on, foundation finder and Kylie’s picks.

Role: Lead developer
Stack: React Native, React, Laravel, Perfect Corp
Expertise: Mobile, Web

01<Specs />

HEADER

PRODUCT

SHADES

TEXT

CTA

TABS

820 × 1180 · 8 col.

02<Wireframe />

KylieCosmeticsScreen.tsx
1export function KylieCosmeticsScreen() {
const items = useFeed();
return (
  <Screen>
    <Product image={shade.photo} />
    <Shades list={range} />
    <Price value={product.price} />
    <Button>Add</Button>
  </Screen>
);
11}

03<Code />

9:41

‹

Kylie Cosmetics

Add

04<Interface />

1try

2choose

3add

05<Interactions />

ease-out · 350 ms

06<Animations />

01 · Context

Turn the in-store Kylie Cosmetics experience into a three-step journey on a dedicated point-of-sale app.

02 · The problems to solve

[The first problem to solve.]
[The second.]
[The third.]

03 · Features

Virtual Try-On

Try products on virtually, with Perfect Corp technology.

Foundation Finder

Find your foundation shade in a flash.

Kylie’s Favorites

Kylie’s favourite products, for a signature look.

Three steps

Test, explore, adopt: the whole in-store journey fits in three steps.

04 · The technical solution

[The technical solution, in one strong sentence.]

React Native app, with a React web version, connected to a Laravel back office. Virtual makeup try-on with Perfect Corp technology, Foundation Finder to match your shade, and a Kylie’s Favorites module for signature products.

[Building block]: [Its role in the solution.]
[Building block]: [Its role in the solution.]
[Building block]: [Its role in the solution.]

05 · Results

[Figure]

[What it measures]

[Figure]

[What it measures]

[Figure]

[What it measures]

Next project · 10 / 14Neofa