In “A City Is Not A Tree”, Christopher Alexander describes a living, natural city as a semilattice of interconnected, overlapping elements. In opposition, he proposes that artificial cities lack richness because they design away suppossedly unneccessary interconnections, reducing them to tree structures. The diagram below shows this relationship.
As an example, let's imagine Melbourne's laneways. Over a long period of time they have become naturally rich nooks and crannies such that when you walk them you discover hidden surprises at almost every corner. The essential character of Melbourne's laneways is the accumulation of many overlapping details that each feedback and influence each-other over time.
Put it this way: if you tried to recreate Melbourne's laneways from scratch, all “Melbourne-ness” would be lost. By contrast, if you tried to recreate Canberra, Australia's capital city, you'd do a better job. Canberra is high-modernist urban architecture devoid of rich experience because, as Christopher Alexander says:
…no piece of any unit is ever connected to other units, except through the medium of the unit as a whole.
Natural semilattices and User Interface design
The “natural semi-lattice” metaphor is a good way to understand how complex processes can't be reduced to simple templates. Delineating the skillsets involved into distinct, separate domains cuts their interconnections and creates artificial order. The result lacks character.
The same holds true for the complexities of User Interface design. Why, for example, do most websites look the same these days? It probably has something to do with the rise of "magic bullet" UI frameworks such as Bootstrap. The reduction of complexity accidentally eliminates richness.
Self-sufficient UI creators
Hi! I'm a designer who really enjoys coding. I'm self-taught, and I started more than a decade into a graphic design career. Here's a few reasons why I think designers should code:
- If you work with others, learning to code will help you understand the web as the medium you're working within, as well as helping you understand the other skillsets required within the web domain and how they overlap your design work.
- If you work by yourself, learning to code gives you agency and self-sufficiency. This gives you more options in the current work climate, for more reasons than just getting paid.
How, might you ask? Working self-sufficiently as a web creator, I can execute what I've designed without asking or paying another person.
Not asking someone is more important than not paying. As soon as more than one person is involved in a project, I have to communicate to them a tangible vision of what my design is. This can be difficult. In this way, asking is more expensive than paying. Nor does paying prevent asking. (This doesn't apply if you're in a shit-hot “pizza team” who finishes each-other's sentences. But most of us aren't.)
If I can code the design myself, I don't have to communicate the nuance of aesthetic or interaction choices. Nor do I have to roll out every instance of those choices as approximate “design” mockups to use to communicate with. Productivity and quality is increased when a craftsperson is self-sufficient enough to understand something of all the medium's necessary overlaps and gotchas that make up rich web experiences.
Designing with code is the most immediate connection
A cook sips the broth. A pilot feels G-forces. A painter paints, and sees mistakes become new ideas. As Bret Victor says:
Creators need an immediate connection to what they're creating.
Not only is designing with code far more immediate than using design tools, if you're a designer who codes, your design is the code. The degree of separation between your design work and the programmed interface is zero.
But wait, it's pretty hard
There's no doubt that doing both UI design and development is hard. Progress in design tools and modern frontend development is rapid and ceaseless, which is both a help and a hindrance. So when you're simulating a computer in your minds—as developers do—it's taxing to take a client call about strategy.
But if it's an all-you-can eat buffet, do you dig in all night? You can't master everything, and you shouldn't try to. You can, however, embrace VUCA, go taste-testing and make informed decisions about what interests you. In this situation, I'd prefer the problem of abundance over that of scarcity. The trick is to reframe the problem as not one of input, but of throughput. Jump in. See what sticks.
The trick, William Potter, is not minding that it hurts. Peter O'Toole as Lawrence of Arabia
If you can let go of your identity, expose yourself to strange, new ways and give yourself “the freedom to search in the darkness where the problems lie”, you'll come out the other side with some mutant pollen stuck to your skin. Those mutant pollen are “one-percenters” waiting to compound. And that's why designers should code.
When designers code
When designers code they understand surprising and contradictory insights are part of the trials of writing software. This is crucial knowledge that will increase a designer's agency and makes better outcomes. If you're a designer who codes within in a team, you'll have higher-resolution information you can use to communicate with, and make better decisions. If you're a designer who codes by yourself, you will have greatly enhanced your ability to implement your vision.
The hallmark of craftsmanship is to understand "both the limits and the possibilities of your medium". Within the craftsmanship of web experiences, learning to code helps designers to see and understand the necessary overlaps that create characteristically rich web experiences.