Skip to main content

← The UX Guide Vol. 1: Luxury Ecommerce

fashion · Shopify ·

Donna Karan

The New York label Donna Karan launched in 1984 with a wardrobe built around jersey, the bodysuit and interchangeable separates, and spun off the younger DKNY line five years later.

The pages

desktop1440 x 900

Donna Karan homepage on desktop, Shopify luxury fashion storefront captured at 1440 x 900
Homepage
Donna Karan collection: all products on desktop, Shopify luxury fashion storefront captured at 1440 x 900
Collection: All Products
Donna Karan product page on desktop, Shopify luxury fashion storefront captured at 1440 x 900
Product page

mobile390 x 844

Donna Karan homepage on mobile, Shopify luxury fashion storefront captured at 390 x 844
Homepage
Donna Karan collection: all products on mobile, Shopify luxury fashion storefront captured at 390 x 844
Collection: All Products
Donna Karan product page on mobile, Shopify luxury fashion storefront captured at 390 x 844
Product page

Palette

Surfaces, by share of painted area

47.3%
40.2%
9.9%
47.3% #ffffff page
40.2% #000000 dark bands
9.9% #d8bd89 secondary surface
2.5% #f4eee8 panels and cards

Ink, by share of text set in it

43.6%
37.7%
43.6% #212121 body and headings
37.7% #ffffff reversed on dark
7.3% #000000 emphasis
6.3% #999999 secondary
3.2% #515151 emphasis
2% #be0113 emphasis

Imagery, by share of the page it covers

29.9% photograph, the rest is surface

Typography

sans-serif · everything

HelveticaNeueLTStd-LtEx

sans-serif · accent

HelveticaNeueLTStd-Ex

of all text on the page

100% sans-serif

The icon set

cart
Search
search
account
Menu
menu
close

Ecommerce components, rebuilt to spec

Donna Karan add to cart button photographed on its product page
photographed on donnakaran.com
Add to cart
Type
HelveticaNeueLTStd-Ex 13px / 400 / 1px tracking / uppercase
Color
rgb(255, 255, 255) on #636363, painted over #ffffff
Shape
0px radius, 200 by 48px
Label
center, rebuild matched the photograph at 0.958
Product card
Grid
4 across, 326px wide
Image
0.67 : 1 crop, cover

Size and color

XS S M L XL
Size selector
Control
radio list with text labels, 5 values
Label
Size
Type
HelveticaNeueLTStd-Ex 13px / 400
Cell
77 by 37px, 8px apart
Chosen
border 1px solid rgb(81, 81, 81) (unselected 1px solid rgb(224, 224, 224))
On load
nothing is chosen

The email sign up popup

Donna Karan email sign up popup, centred centre, offering 10% off
Email capture
Placement
centred centre, 360 x 465
Asks for
email
Offers
10% off
Shown on
both
Dismissible
no close control found