← The UX Guide Vol. 1: Luxury Ecommerce
beauty · Shopify ·
Biologique Recherche
French skincare company founded in Paris in 1978 by the Allouche family, sold largely through trained facialists and known above all for Lotion P50, an exfoliating toner with a long following.
The pages
desktop1440 x 900
mobile390 x 844
Palette
Surfaces, by share of painted area
54.6%
29.4%
11.9%
54.6%
#ffffff
page
29.4%
#0e2243
dark bands
11.9%
#f1f0eb
panels and cards
4.2%
#edeef0
panels and cards
Ink, by share of text set in it
43.9%
30.7%
14.5%
43.9%
#0e2243
body and headings
30.7%
#ffffff
reversed on dark
14.5%
#73767f
secondary
5.7%
#a1a6ae
secondary
4.4%
#6a6d75
secondary
0.7%
#c4c8ce
secondary
Imagery, by share of the page it covers
31.4% photograph, the rest is surface
Typography
sans-serif · everything
Sohne
of all text on the page
100% sans-serif
The icon set
Ecommerce components, rebuilt to spec
Add to cart
- Type
- Sohne 14px / 400 / 0.2px tracking
- Color
- rgb(255, 255, 255) on #0d2243, painted over #ffffff
- Shape
- 24px radius, 473 by 46px
- Label
- center, rebuild matched the photograph at 0.999
SUMMER ESSENTIALS
/
Crème MSR-H
/
LES ESSENTIELS DE SOIN
/
Product card
- Grid
- 4 across, 357px wide
- Image
- 1 : 1 crop, cover
- Line 1
- 17px / 400 / uppercase, rgb(14, 34, 67)
- Line 2
- 11px / 400, rgb(196, 200, 206)
Size and color
ml 30 ml
ml 8 ml
Size selector
- Control
- radio list with text labels, 2 values
- Label
- ml
- Type
- Sohne 11px / 400
- Cell
- 56 by 16px, 14px apart
- Chosen
- 10x10px block, #0e2243
- On load
- one is already chosen