When a Design Becomes a Measurable Build
A committed direction is still an intention until an implementation can be compared with it. Impeccable treats that transition as a choice between two build paths: comp-led work, where an approved image becomes a measured spatial contract, and code-led work, where ambition is carried by an explicit first-viewport and interaction contract. This chapter follows both paths through their states, showing what each can prove, what each costs, and why a finished screenshot is not the same thing as a finished build.
Comp-led turns an image into evidence
Impeccable's comp-led path begins with an approved visual reference, but it does not treat the reference as a mood board. A mood board sets an atmosphere. A comp-led build asks where the important regions are, how large they are, which colors and materials occupy them, what type is doing the work, and what must remain visible at the relevant viewport. The image becomes a measurement surface.
The build path is therefore a lifecycle rather than a single generation step. The documented state machine moves from comps to spec, plates, hero, sections, motion, responsive behavior, and review. Each transition closes a different uncertainty. The spec names the visible regions and their medium. The plate stage produces usable raster assets for illustrations, textures, or objects instead of asking CSS or a large inline SVG to impersonate them. The hero stage tests the first viewport before the rest of the page can hide a mismatch. Sections, motion, and responsive behavior extend the committed system after that first proof survives.
The spec is where a visual reference becomes an interface model. A region that the page draws, such as text or a control, is treated differently from a region that must be produced as an image or texture. The system measures boxes, sampled colors, detail, and type characteristics. A text region can be measured for cap height, width, and weight, then ranked against available faces. This is more demanding than telling an agent to “use a similar font,” because the comparison is attached to a specific region of a specific reference.
That specificity also controls what the builder is allowed to invent. If the reference shows a quiet field, adding a border, decorative rule, or floating label changes the measured composition even if the new element seems harmless. If a painted object occupies a region, replacing it with a CSS approximation changes the medium rather than merely changing the implementation. The spec gives the builder a vocabulary for saying, “this is a region the page must draw,” “this is a plate that must survive to the screen,” and “this reference does not authorize an extra surface.” Without that vocabulary, visual fidelity becomes an argument from memory.
Font matching illustrates the same principle. The goal is not to worship a particular typeface or to pretend that a browser can reproduce every pixel. The goal is to measure the role the lettering plays in the composition and choose the closest usable face under that evidence. A readable substitute that preserves the region's scale and width can be a justified concession.