I was studying Zurb’s Foundation framework, teaching myself web development, when I saw the column classes in the HTML and something felt familiar. .col-md-4. .col-md-6. .col-md-12. A twelve-column grid with gutter widths and breakpoints. I’d seen this before, but I couldn’t place it.

I went and pulled out my old Swiss design books from SVA. Muller-Brockmann’s Grid Systems in Graphic Design. The page with the twelve-column grid, mathematically derived. Column widths, gutter widths, margins, all from a base unit. The same architecture, different material. The CSS framework was Muller-Brockmann’s grid built for the browser.

At school I thought the grid was about layout. Clean lines, Swiss precision, the aesthetic everyone associates with International Typographic Style. Standing in front of Foundation’s documentation with a Muller-Brockmann book open on the desk, I understood what I’d been looking at for years without seeing it. The grid was governance. A set of constraints that produced coherent output across different practitioners, whether those practitioners were Swiss typographers or web developers who’d never met.


That recognition changed how I approached CSS. Most web developers I encountered thought in rows. Content stacks vertically. You build a header, then a content block, then a footer. The layout is a sequence of horizontal bands.

I started thinking in columns first. The grid as a structural given. The content fits the grid. The grid doesn’t fit the content. That’s a print mindset, and it came from years of studying Swiss layouts before I ever wrote a line of CSS.

I still slogged through the bad years. Table layouts, float hacks, clearfixes, all of it. Years of building websites the way everyone else was building them. But the grid recognition from Foundation and Muller-Brockmann sat underneath that slog, and when I arrived at Encore, it surfaced.

Encore was a Windows Forms application. Desktop-only, no design system whatsoever. There were no web design conventions to inherit because there was no web layer at all. I was bringing the product from a Windows desktop application straight to the modern browser. The design system I built didn’t come from Bootstrap or from the years of table layouts. It came from Muller-Brockmann. Governed variables, enforced constraints, a typographic scale, a spacing system. Print production logic applied to a web application, and a clean slate to apply it to.


The Bauhaus figured this out a hundred years ago. When Gropius opened the school in Weimar in 1919, the premise was integration: fine art and applied craft in one curriculum. The Vorkurs taught every student the same base vocabulary before they specialized. Color theory, material properties, form and composition. A weaver and a furniture designer who both completed the Vorkurs could make objects that belonged to the same world, because the decision-making framework was shared.

That shared vocabulary is a design system. The aesthetic consistency people associate with Bauhaus work came from governance, not from style. Vignelli’s restriction to six typefaces was the same move. When you limit the palette, you eliminate an entire category of subjective debate. The constraint absorbs the decision. What’s left is the work that matters: hierarchy, proportion, how the information is organized.

I think about Vignelli’s restraint every time I open an SCSS variables file. If a color value isn’t in the file, it doesn’t belong. If a font-size isn’t in the scale, it doesn’t ship. The variables file is a governance document. Deviation requires intent. You have to add the variable, name it, justify its existence. The default path produces consistency. The inconsistent path takes effort.


Where the print mindset failed me was in the places where the browser genuinely isn’t paper. Print is fixed. A poster doesn’t resize. A grid that works at one scale works at that scale forever. The browser is fluid, and my early instinct to lock everything to fixed column widths fought that fluidity. I spent time building rigid grid structures that broke on smaller screens because I was treating the browser like a press sheet.

The fix wasn’t abandoning the grid. It was learning which parts of the grid are governance (the proportions, the relationships, the constraints on how elements relate to each other) and which parts are medium-specific (the pixel values, the breakpoints, the responsive behavior). Muller-Brockmann’s proportions transfer to any medium. His millimeter measurements don’t.

That distinction, governance versus measurement, is the thing I keep applying. At Encore, the SCSS design system held for twelve years because it governed proportions and relationships, not pixel values. The color palette, the typographic scale, the spacing rhythm. Those are constraints that produce coherence across hundreds of engineers. The pixel-level implementation changed multiple times. The governance survived because it was structural, not decorative.


FormWork runs on the same principle. Separate the concerns. Give each evaluative dimension its own lens. Govern the defaults so the output stays coherent across sessions, across tools, across AI context windows that forget everything between conversations. The architecture is the same one Gropius set up in Weimar: a shared vocabulary, enforced constraints, a system designed so that different practitioners operating independently produce work that belongs to the same world.

I didn’t plan this lineage. I recognized Foundation’s grid in Muller-Brockmann’s book. I brought print thinking to a Windows Forms application that had no design system. The grid held because governance holds. The specific moment I connected the SVA education to the Encore architecture to the AI skill system, I was already years into each one. The pattern was running before I could name it. I could only see it after the fact, looking at three different projects and realizing the operational logic underneath was identical.

The Bauhaus built it for physical workshops. The Swiss typographers built it for publications. I built it for a twelve-year enterprise platform and then rebuilt it for AI governance. The vocabulary changes every time, but the grid, the structural governance underneath, has been the constant across all of them.