Skip to main content

← The UX Guide Vol. 1: Luxury Ecommerce

beauty · Shopify ·

Boy Smells

Los Angeles fragrance company started in 2016 by Matthew Herman and David Kien, which began with candles poured at home and grew into perfume and body care sold without gender divisions.

The pages

desktop1440 x 900

Boy Smells homepage on desktop, Shopify luxury beauty storefront captured at 1440 x 900
Homepage
Boy Smells collection: all candles (expect l, sb, cbk, g, cs, hf) on desktop, Shopify luxury beauty storefront captured at 1440 x 900
Collection: ALL CANDLES (EXPECT L, SB, CBK, G, CS, HF)
Boy Smells product page on desktop, Shopify luxury beauty storefront captured at 1440 x 900
Product page

mobile390 x 844

Boy Smells homepage on mobile, Shopify luxury beauty storefront captured at 390 x 844
Homepage
Boy Smells collection: all candles (expect l, sb, cbk, g, cs, hf) on mobile, Shopify luxury beauty storefront captured at 390 x 844
Collection: ALL CANDLES (EXPECT L, SB, CBK, G, CS, HF)
Boy Smells product page on mobile, Shopify luxury beauty storefront captured at 390 x 844
Product page

Palette

Surfaces, by share of painted area

68%
18%
68% #ffffff page
18% #e8d1ff secondary surface
5.5% #fff8f5 panels and cards
4.3% #bd826f accent
2.9% #f2f2f2 panels and cards
1.1% #ceb6e6 accent

Ink, by share of text set in it

53.6%
29%
10.4%
53.6% #030303 body and headings
29% #000000 emphasis
10.4% #757575 secondary
4.7% #ffffff reversed on dark
1.5% #373330 emphasis
0.8% #bebebe secondary

Imagery, by share of the page it covers

41.2% photograph, the rest is surface

Typography

sans-serif · everything

Neuzeit Grotesk

sans-serif · accent

Ano W05

of all text on the page

100% sans-serif

The icon set

cart
search
account
menu
close
wishlist

Ecommerce components, rebuilt to spec

Boy Smells add to cart button photographed on its product page
photographed on boysmells.com
Add to cart
Type
Ano W05 14px / 700
Color
rgb(255, 255, 255) on #020202, painted over #ffffff
Shape
100px radius, 382 by 64px
Label
between, rebuild matched the photograph at 0.916
Product card
Grid
4 across, 304px wide
Image
1 : 1 crop, contain

The email sign up popup

Boy Smells email sign up popup, centred centre, offering 15% off
Email capture
Placement
centred centre, 390 x 601
Asks for
email
Offers
15% off
Shown on
both
Dismissible
no close control found