See work Book a call
Work

Alta

NDA

A Shopify theme for a Calcutta colour-cosmetics label: a storefront that draws every shade on the shopper's own skin, in the finish she picks, before it asks for money.

Built for a client under NDA. We can't reveal the brand, so the name and identity you see here stand in for theirs.

  • NDA
  • Makeup
  • Online Store 2.0

Alta, Calcutta theme preview: the home page, starting with the video banner.

Challenge

Alta makes lipsticks, a kajal, a pressed blush and a powder, in small batches in a Calcutta studio, at ₹900 to ₹2,600. Colour is bought without a mirror, and an opened lipstick cannot go back. The old store sold it like everything else online: one pale arm of swatches, a grid of forty shades with names that said nothing, and the finish tucked into a dropdown.

  • Every shade was swatched on a single arm, and hardly any shopper's skin was that one
  • Red was forty tiles in a grid, named by number, with no way to find the one meant for her
  • Matte, satin and glass sat in a dropdown, after the shade was already chosen
  • Trying a shade meant buying a full size, or a quiz that ended in an email address

The brief was a theme that draws each shade on the shopper's own skin, puts the finish beside it, and lets her try before she pays for a full size.

How we worked

01 Discover: What a shopper needs to see before she buys a red she cannot try on

02 Define: Three proto-personas and the journey from a swatch on someone else's arm to a shade that is hers

03 Design: Wireframes first, then the storefront, section by section

04 Optimise: The product page, the shade finder and how we'd test them

A woman in a black blouse sits at a dressing-room mirror ringed with bulbs, her reflection turned in profile

01 · Discover

The brief

Call sheet

Alta, Calcutta

The night's job

Sell lipstick at full price online, to women whose skin is almost never the one in the swatch photo.

  1. The shade is judged on the shopper's own skin: every shade is drawn on six photographed forearms before it is a name.
  2. Finish is a choice beside the shade, not a dropdown: matte, satin and glass are one tap each.
  3. Trying comes before buying: a ₹200 shade card, credited on the first full size, sits beside the button, with no quiz and no email wall.
Has never seen a red lipstick swatched on skin like hers, only on one pale arm.
Wants a matte that lasts the day and has been sold a gloss named matte, with the finish hidden in a dropdown.
Is buying a red for a wedding on Saturday and has no time to return a wrong one.

02 · Define

From a swatch on someone else's arm to a shade that is hers

  1. 01The deep-skin shopper

    Discover

    Another page of reds on one pale arm?

    A masthead that promises six skins, not one, and a film that starts on a face.

  2. 02The finish sceptic

    Browse

    Is it matte, or only called matte?

    Twelve shades named for the city, each with its finish line and a six-dot strip of the shade on six skins.

  3. 03The deep-skin shopper

    Choose

    Will it look like this on me?

    Pick a skin, and the shade is drawn on it in matte, satin or glass in under half a second.

  4. 04The wedding-season buyer

    Commit

    What if it is the wrong red?

    A ₹200 shade card beside the button, credited on the first full size, and the exchange said where the doubt is.

  5. 05The wedding-season buyer

    Wear

    Will it hold, and can it go back if it doesn't suit?

    Wear notes on the page, and an unopened shade exchanges within 14 days.

03 · Design

Wireframe to storefront

Ten sections, from the six-skins bar to the footer, each one the team can move, edit or switch off in the theme editor. Wireframes first, then the design.

Hands turning a lipstick up out of its case

Home page, Online Store 2.0 · 10 sections. The home page as ten pockets of a brush roll, opened one at a time in storefront order: each section is pulled out and goes from wireframe to finished page.

Pocket 1 of 10

  1. Swatched on six skins, not one: the promise first, with no countdown and no code.

  2. Five links, ALTA centred, and Shade finder where a sale link used to be.

  3. A dressing room and a woman in the glass, with one line: On your skin.

  4. Three edits, day, night and wedding, in place of a grid of categories.

  5. Six shades, each with a six-dot strip: the shade drawn on six skins.

  6. A forearm with four swatches, and the shade card explained in one paragraph.

  7. Matte, satin and glass, one line each, so the finish is known before the shade.

  8. Journal: why we swatch on six arms, a Tollygunge dressing room, what alta is.

  9. Letters from the dressing room, once a month, with no code attached.

  10. Shop, shades, care and help, with exchanges and privacy in their own column.

04 · Optimise

The product page, decision by decision

A lipstick is bought without a mirror, on a photograph taken on someone else's arm. Each number marks a decision on the product page and the reason for it.

  1. The name is the piece. Shade and finish sit under it with the price, so one lipstick is one page, never thirty-six.

  2. Twelve round swatches in the flat shade colours, and Cool, Neutral, Warm beside them: the undertone reorders the twelve and never hides one.

  3. Matte, Satin and Glass are three buttons, and six skin chips under them redraw the shade on a real forearm in the finish you picked.

  4. Not sure? All twelve on a card for ₹200, credited on the first full size, in a card of its own above the button.

  5. An unopened shade exchanges within 14 days, and what is in it is said once, where the doubt is, not in a policy page.

  6. Add to Bag is the only filled button; the Mini is an outline button with its own price, and the concierge is a plain link.

Alta, Calcutta product page buy box on a dressing-room mirror, with 6 numbered decisions: 1. Shade, finish and price under the name; 2. Twelve shades, sorted by undertone; 3. Finish, then the shade on your skin; 4. The shade card, before the full size; 5. The exchange, said plainly; 6. One filled button, the mini beside it.

04 · Optimise

On your skin

Three steps from the theme, in order: pick your skin, pick an undertone, pick the shade. Every shade is drawn on the skin you chose, in the finish you chose, and the price follows.

Rendered on photographed skin · the shade card is ₹200, credited on your first full size

Skin3 Medium

UndertoneNeutral

Finish

Flat, no transfer

The shade12

Matte

Alta

₹1,900 · Also as a mini ₹900

Shade card first, if you like: ₹200, credited on your first full size.

Exchange an unopened shade within 14 days.

Design tokens

The compact

Type

  • Headings & wordmark · Cormorant Garamond Light

    On your skin.

  • Interface · DM Sans

    The shades · Shade card first

  • Products & prices · DM Sans Medium

    The Lipstick ₹1,900

Colour

Components

Add to Bag · ₹1,900; Add to Bag

₹1,900 Swatched on six skins · Shade card first

04 · Optimise

How we'd test it

These are the first three experiments we'd run after launch, and what each one has to prove.

  1. Call sheetNight 1

    If
    every shade is drawn on six photographed skins and the shopper picks hers
    Then
    more lipsticks are kept
    Because
    the shade is judged on skin like hers, not on one arm
    Metric
    Keep rate on lipsticks
    Guardrail
    Add-to-bag rate

  2. Call sheetNight 2

    If
    finish is a three-way control beside the shade, not a dropdown
    Then
    fewer exchanges are asked for on finish
    Because
    matte, satin or glass is chosen on purpose, with its wear note beside it
    Metric
    Finish-related exchange requests
    Guardrail
    Conversion rate

  3. Call sheetNight 3

    If
    the ₹200 shade card, credited on the first full size, sits beside Add to Bag
    Then
    more first orders from unsure shoppers include a full size within 30 days
    Because
    they can try twelve shades before paying ₹1,900
    Metric
    Full-size orders from shade-card buyers
    Guardrail
    Add-to-bag rate
Next case study Sondhi A Shopify theme for a Kannauj attar house: a storefront that finds the smell from a memory, says how long it lasts and sends the vials before it asks for a bottle. Read the case study

Ship it Built
for Shopify.

Book a call