honest materials, on a screen

The club chair Marcel Breuer made in 1925 is a drawing in steel tube. The tube is plated and left bare, the fabric is stretched and left plain, and you can see at a glance which part holds you up and which part holds you in. The building he made it in has a wall of glass that shows the workshops to the street. Nothing is covered. Nothing pretends to be something else.

That was a principle before it was a look. The school called it truth to materials, and it meant that a thing should be made of what it appears to be made of, and should let its structure show. Brandt's teapot is a hemisphere because a half sphere holds the most tea for the least metal. The shape is the economy, made visible.

the material is light

On a screen there is no steel. The material is light in a grid, and the honest version of it is flat color, type and edges. The dishonest versions are easy to list, because for a decade they were everywhere: leather textures, linen backgrounds, buttons with bevels that pretended to be keys, cards with shadows that pretended to float above a desk, and gradients that pretended a lamp was shining on the glass.

Those effects are drawings of other materials. They are the digital equivalent of painting plaster to look like marble, and the school's answer to painted marble was to leave the plaster alone.

but a flat lie is still a lie

Honesty cuts the other way too. A flat button that does nothing when you hover and nothing when you press is pretending to be a picture. Feedback has to be honest to the medium: a change of color, because color is what pixels have; a change of state, because the pressed button is a different thing from the resting one; and motion kept to about 120 milliseconds, which is how long a change takes to register and no longer, because nothing on a screen has mass to decelerate.

So the hover is yellow and the press is ink, and there is no shadow that lifts, no glow that spreads and no bounce at the end.

the rules, read as honesty

• No gradients. Light does not fall on a screen from one side.
• No shadows. Nothing floats.
• Rules of 3 pixels. An edge is drawn, not implied.
• Flat color. A pixel is a color, not a surface.
• Motion of 120 milliseconds, linear. Nothing has weight.

the grain

The material does have a grain, and it is the pixel. Honest to it means whole pixels: a 3-pixel rule, never two and a half; sizes on the 8-point scale; icons whose edges land on unit lines; no hairlines that render as a grey smear on one display and vanish on another.

Steel wanted to bend in arcs and the chair let it. Pixels want to sit in a grid and the interface lets them. The principle did not change when the material did. Only the material did.