← The UX Guide Vol. 1: Luxury Ecommerce
fashion · Shopify ·
Antonio Marras
Sardinian designer from Alghero known for collaged layering, embroidery and references to island dress. He was artistic director of Kenzo between 2003 and 2011.
The pages
desktop1440 x 900
mobile390 x 844
Palette
Surfaces, by share of painted area
33.7%
32.6%
29.1%
33.7%
#f8f8f8
page
32.6%
#ffffff
panels and cards
29.1%
#f4f2eb
panels and cards
4.5%
#000000
dark bands
Ink, by share of text set in it
88.9%
88.9%
#000000
body and headings
6.9%
#646464
emphasis
3.7%
#ffffff
reversed on dark
0.5%
#a60d1a
emphasis
Imagery, by share of the page it covers
38.9% photograph, the rest is surface
Typography
sans-serif · everything
neue-haas-grotesk-display
of all text on the page
100% sans-serif
The icon set
Ecommerce components, rebuilt to spec
Add to cart
- Type
- ui-sans-serif 16px / 400
- Color
- rgb(255, 255, 255) on #bdbdbd, painted over #f8f8f8
- Shape
- 4px radius, 330 by 42px
- Label
- between, rebuild matched the photograph at 0.948
Product card
- Grid
- 3 across, 136px wide
- Image
- 0.75 : 1 crop, cover
Size and color
S
M
L
Size selector
- Control
- buttons, 3 values
- Label
- Size
- Type
- neue-haas-grotesk-display 16px / 400
- Cell
- 34 by 36px, 8px apart
- Chosen
- filled #000000 (unselected #ffffff)
- On load
- nothing is chosen
Color selector
- Control
- buttons, 2 swatches
- Swatch
- rounded square, 24 by 24px, 12px apart
- Chosen
- nothing marked as chosen