00
WorkStudioJournalContact
studio@onyx.agency

Translating texture to screen: lessons from the atelier

Craft2025.098 min read

Luxury is tactile. The weight of a Bottega Veneta clutch, the grain of Tom Ford leather, the drape of a Celine coat — these qualities exist in the hand, not the eye. And yet digital is a purely visual medium. The screen has no texture. The cursor has no weight.

This gap is the central challenge of luxury digital design. Not aesthetics — those are solvable with typography and photography. The challenge is communicating a sensory quality through a medium that only serves one sense.

Our approach borrows from architecture, not graphic design. Architects have always designed for senses they cannot directly control. A stone floor implies coolness. A vaulted ceiling implies echo. The material does not need to be touched to be felt — it needs to be presented in a way that triggers sensory memory.

On screen, this translates to what we call material behaviours. A button that yields slightly on press — compressing by 2 pixels with a 200ms ease-out — feels like pressing leather. An image that responds to cursor movement with a displacement filter feels like touching the surface of water. A page transition that carries momentum feels like turning a heavy page.

Photography is the most direct tool. Product images shot on raw materials — stone, linen, wet concrete, brushed metal — transfer the texture of the surface to the product. The viewer's eye reads the grain of the stone and attributes that tactile quality to the object resting on it.

Motion is the second tool. Natural materials do not move uniformly — they have weight, elasticity, friction. Digital motion that references these physics feels material. A card that swings into view with slight overshoot feels like it has mass. A scroll that decelerates with friction feels like dragging across a surface.

Colour contributes more than we credit. Flat, saturated colours feel digital. Desaturated, warm-shifted palettes with subtle noise feel analogue. Adding 2% grain to a background transforms a CSS colour into a surface. The eye reads it as paper, not screen.

The goal is not to trick the user into thinking they are touching something. The goal is to create a sensory resonance — a feeling that the digital experience was crafted with the same attention as the physical product. When that resonance is achieved, the screen disappears and the brand remains.