A sketch drawn from the finished page

Sep 29, 20262 min read

The line under this site's name is one thread from the first sketch to the form. A case page can show that instead of saying it: the section frame sits over its first sketch, and as the page is read, the thread wipes the sketch into the finished work.

Forgetting the paint

A script opens the concept page in a headless browser, reads every element's computed style first, and then redraws it. Display type keeps its size and position and loses its fill, so a headline becomes its outline. Reading text turns into a gray bar the length of each line. Anything painted and large enough becomes a crossed box, the old sign for a picture that has not been made yet, and a thick drawn arc comes down to a pencil line. The construction grid stays.

Last, a displacement filter with a little noise makes every line wobble by about a pixel. Without it the result looked like a print of the page, not like a drawing of it.

The same section as its first sketch: the layout in pencil lines on paper, the headings drawn as outlines, the text as gray bars. — Soft Geometry's collection, wiped from its sketch as you read.

The concept’s collection section on paper: the heading "Collection" above flat furniture silhouettes drawn in simple shapes, each with its label. — Soft Geometry's collection, wiped from its sketch as you read.

Why the same page

Because the layout is the part that was decided in week one. Drawing a new sketch after the fact would have been a picture of a process; taking it from the finished page shows that the columns, the rows and the headline's place were there from the start, and that what changed was everything laid on top of them.

All notes