Skip to main content

← The UX Guide for Luxury Ecommerce Vol. 1

footwear · Shopify ·

Aubercy

The Aubercy storefront measured page by page: homepage, collection and product at desktop and mobile, every color weighted by the share of the page it paints, with photography covering 41.1 percent of the page, typeset in Garamond.

The pages

desktop1440 x 900

Aubercy homepage on desktop, Shopify luxury footwear storefront captured at 1440 x 900
Homepage
Aubercy collection: ligne mesure on desktop, Shopify luxury footwear storefront captured at 1440 x 900
Collection: Ligne Mesure
Aubercy product page on desktop, Shopify luxury footwear storefront captured at 1440 x 900
Product page

mobile390 x 844

Aubercy homepage on mobile, Shopify luxury footwear storefront captured at 390 x 844
Homepage
Aubercy collection: ligne mesure on mobile, Shopify luxury footwear storefront captured at 390 x 844
Collection: Ligne Mesure
Aubercy product page on mobile, Shopify luxury footwear storefront captured at 390 x 844
Product page

Palette

Surfaces, by share of painted area

84.6%
15.3%
84.6% #ffffff page
15.3% #151515 dark bands

Ink, by share of text set in it

73.9%
25.1%
73.9% #151515 body and headings
25.1% #ffffff reversed on dark
1% #ee3b45 emphasis

Imagery, by share of the page it covers

41.1% photograph, the rest is surface

Typography

serif · everything

Garamond

of all text on the page

100% serif

Ecommerce components, rebuilt to spec

Add to cart
Type
Garamond 14px / 700 / 0.28px tracking / uppercase
Color
rgb(21, 21, 21) on rgba(0, 0, 0, 0)
Shape
0px radius, 7px 30px padding, 48px tall
Width
383px as rendered
Le Lupin Découvrir
Le Lupin Découvrir
Le Lupin Découvrir
Product card
Grid
3 across, 360px wide
Image
0.9 : 1 crop, cover
Line 1
16px / 700 / uppercase, rgb(255, 255, 255)
Line 2
15px / 400, rgb(255, 255, 255)