Brutalist Design Is the Bad Influence We All Need
imaginarycloud.com
imaginarycloud.com
Brutalism is, of course, a fuzzy (and contentious) label to begin with. But the article cites two interpretations of the term that we could use to evaluate how Brutalist a given design is:
honest, unpretentious and anti-bourgeois
and
a sense of roughness, exposed structures and visible thought processes
The problem is, I'm not seeing a lot of either of these in the examples provided.
If you asked me to name a site whose design is "honest, unpretentious and anti-bourgeois," for instance, examples that would leap to my mind are Craigslist and HN -- both of which focus on simple (even drab) layouts dominated by plain old text. But the examples are full of vibrant colors, big images and irregular, unconventional layouts! They're refreshing and interesting to look at, but that doesn't make them Brutalist.
And to the other definition, "exposed structures and visible thought processes," I'd point to... well, I'm not sure what I'd point to. I'm not sure there is any web site that would qualify as Brutalist by this definition. Are there any sites that let their plumbing hang conspicuously out on the sides? Bloomberg and Dropbox and the Outline certainly don't. I'd think of this more as a site where you interact with it via an API or the developer console or some heavy, overwhelming user interface than as a news site that happens to have decided to use giant fonts and screaming neon colors.
If we want to have Brutalism as a valid design approach for the web, we first need to decide on what exactly the word means. Otherwise it will just become a parking lot for whatever trends happen to be fashionable at the moment, which is not a great way to build something that will make a lasting impact.
As others are mentioning, the border-heavy http://www.zku-berlin.org (included in the article's examples) qualifies, and so do 1990s-style websites that appear to be authored with tables and don't try to cloak the inner workings of the layout.
So no one knows whether brutalism is concrete-heavy minimalism, or concrete-heavy bizarro-showoffism, but the core of it is the use of a drab but versatile, non-organic material, so one could venture to guess that any website that features excessive use of color and vibrancy, and cloaking the existence of edges between disparate functional blocks would automatically be disqualified on aesthetics alone.
[1] https://news.ycombinator.com/item?id=12685595#12689331 [2] https://news.ycombinator.com/item?id=12685595#12688364
The UK was littered with Brutalist "statement" buildings. Most have been pulled down now, and - with a few high profile exceptions, which have escaped the low-budget ghetto most of the movement settled in - the style is generally considered a mistake.
I have no idea why anyone would want to copy the aesthetic in web design. But then the designs on show don't look Brutalist so much as "edgy" 80s magazine kitsch, which in turn influenced a certain kind of minimal web style which has actually been around since the 90s.
It's true that web design lacks real creativity and diversity, but that's partly because web pages that are trying to sell you something - as opposed to making an artistic statement - are optimised to balance content delivery with behaviour modification with cognitive load. There are only so many ways to do that, and the affordable ones are already in use.
What makes the brutalist buildings in the Pacific Northwest beautiful is that many of them are now covered in vegetation, with mosses or vines muting their harshness.
That said, this so-called "brutalist web design" is bullshit. It's just avant-garde design of the 80s applied to web pages.
Buildings that dominate areas, make them feel unsafe and unfriendly. Buildings that create dark spaces for petty crime, spaces that smell of urine.
Buildings with no human warmth at all.
I always thought that argument as flimsy, since the word brute exists in French and has exactly the same meaning as in English.
[1] https://news.ycombinator.com/item?id=12685595#12689331 [2] https://f50collective.com/2016/09/19/brutalist-architecture/ [3] https://books.google.com/books?id=b-OUxSelykIC&lpg=PA18&ots=...
There is a difference between "Une brute" (a brute) and, as mentioned, "béton brut" (raw/rough concrete).
It's similar to the way 'crude' can be used to refer to a person or oil that hasn't been through a refining process.
I suspect this is partly due to the “True Tone” feature, where the OS automatically adjusts the display’s color temperature to match ambient light. This makes the “white” background color appear less harsh (less blue) than in most displays, lessening the need for a lighter foreground color to soften the appearance.
Or maybe you could just say that it reduces the perceived contrast, lessening the need for further contrast reduction. I’m not sure if that’s actually true, though. The actual contrast ratio between anything other than black and black should be infinity on an OLED display, or even if you account for a tiny amount of diffuse reflection of incoming light, it would just be a (large) value dependent on the brightness setting.
The examples in the blog post don't strike me as brutalist at all. More like Swiss modern, which at this point has been done to death.
I think designers like the "clean" look but I find it to antiseptic and antihuman. Myspace was an example of a human (but not brutalist imho) design. Working in a hyper sterile environment as these designs all seem to me doesn't encourage creativity or jive with reality.
Because these examples have nothing to do with "brutalism" in architecture. It's just another buzzword misappropriated by (web) designers. 5 years ago everything was "flat" now everything is "brutalist" including what was "flat".
Designers shouldn't pick a style because it's trendy, they should do their job as designers and actually design for their intended audience and medium.
HN is no more "brutalist" than Craiglist. Effective web design should be optimized for fast loading times, readability, easy information retrieval and responsiveness. These issues are far more challenging than trying to fit a style du jour.
Along with native and real time.
It's already been defined in the design community. Further, the post is well over a year behind common discussions on the return (not beginning) of Brutalism in web design.
Brutalism in web design has been around since the beginning. Professional designers, influenced by artists popular during the 70s & 80s (Warhol, Laurie Anderson, Sex Pistols) used this approach deliberately as a way to challenge the bland markup style of early Yahoo et al... and now today's modern flat design.
They're not neatly segregated along, with navigators aligned across the top or stacked on the left.
Visual artifacts are all over, controls are all over.
It's "brutalist" relative to the norm
Have you ever got a stacktrace in an http 500 error page? There you have it :)
> If we want to have Brutalism as a valid design approach for the web, we first need to decide on what exactly the word means. Otherwise it will just become...
What's brutal about that though? Instead of "design by committees", do it brutally.
Instead of A/B testing: throw it onto the screen.
Instead of slick: rough.
People will find the link that you want them to click, even when you are using design principles that are uncommon or "not like Google".
A long as you are honest. And perhaps also brutal.
Uses javascript at various point though.
On your last paragraph, I'm afraid that "web Brutalism" is already a parking lot. Anti-bourgeois? Really?
maybe a page created on something like jsfiddle.
Heck, sincewe compile js now, you could say anything that still has readable source counts.
Web pages, and really everything on the computer screen are a rendering of something. They don't have materials or material properties, they only represent or imitate them. So really they can never be honest to the materials. They can only imitate or evoke 'ideas' of brutalism.
Bare HTML with no styling (inline or CSS).
It’s as close as anything I can think of. All function and little, if any, attempt at style.
Brutalism is stupid, anti-beauty, and destructive of mental health; which is why people who are just smart enough, and can afford too much beauty, thirst so much for it.
If you press F12, it turns any website to a brutalist one
I'm sick of the garbage that designers these days pass off as 'form'. It ruins computing. Sci-fi showed us the future was large screens full of data and smart humans doing meaningful shit with it... but reality is we pay beaucorp bucks to waste 98% of a 4K, 9-megapixel display on a royal purple background with a couple of words in white.
It's about an 800 year old word in French. Wiktionary claims that it was imported to US English primarily by GIs returning from the Vietnam War. I'd assume that it would come more directly from French, in other forms of English.
Example in context: “They’re making buku bucks over there.”
From my perspective, for a long time it was just another one of those weird-sounding words that only Dad used (which turned out to be French, German, and Spanish).
The same user that might be routinely using software like Emacs or Ableton Live or Final Cut Pro or 3ds max studio or AutoCad in his professional life.
The alternative of information dense interfaces is generally prefered by hackers, which are accustomed to scary things like tables and lines of code that will make the average user run for the hills. We want magazine covers and picture books, not War and Peace.
I think the random placement of links is a tricky thing though. One one hand it brings identity to your brand, but on the other hand, it’s not intuitive for the user.
[0] http://www.zku-berlin.org/, pkamb below also linked https://nwfilmforum.org/
https://web.archive.org/web/20000229231038/http://www.mozill...
As for the bit about brutalism being "honest, unpretentious and anti-bourgeois" - LOL - the only people who actually rave about it as an aesthetic are the most pretentious people I know (not that there's anything wrong w/ that).
This whole thing uses Brutalism as a clickbait buzzword; it has nothing to do with the principles.
A web site inspired by Brutalism would consist of the elements that the designer considered core to building it and avoid anything else. If CSS is not core, don't use it and instead rely on the browser styles. If JavaScript is core to function, use it. Etc.
The examples in the article seem more punk, if anything. Which, that's cool too, but different. They actually require a lot of images and really tricky CSS to create that look, even if it's intentionally chaotic.
Brutalism was about focusing on function, with no consideration given to making it pretty for the sake of prettiness. If you treat this as a design style, you're missing the point.
Some of the websites linked in the article remind me of dada collages (Hausmann's "ABCD" for example[1]), which are a usually lot more chaotic and free-form than brutalist architecture.
[1] "ABCD" by Raoul Hausmann (1920). https://i.imgur.com/ksHst2C.jpg
On my phone, I don't have much data for my plan. I have to be careful just visiting websites. Literally just visiting a few websites can cause me to download hundreds of megs...
Something about that just feels comforting, if not nostalgic, like what you'd expect to see from an early 2000s webpage before things got fancy. I think what makes these sites pop for me is the contrast of colors, too much white ruins the effect. Having out of place, darker colors thrown in feels like its breaking the rules, in a good way.
To me, the page feels like a Geocities site that "grew up"- in a good way. The "chunkiness" of the element borders reminds me of the traditional default styling of <table> elements.
You're also spot on with the contrast: I just checked, and this site's design is based on only three colors: #fff, #000, and #ff0. That's a pretty bold design statement, and they pull it off.
Not everything has to be a billboard. I don't want a hammer where the handle is an iron rod embossed with the maker's logo. I just want an ergonomic wooden handle that does the job.
I agree.
> Simple, ..., transferrable, easy to understand UX is good UX.
I disagree. I think the first part of OP raised some good points. The copy everyone's copying and that everyone understand may just be an inferior local maxima.
I think this podcast gets at some of the lost potential: https://99percentinvisible.org/episode/of-mice-and-men/
Yup. But the way out of those inferior local maxima is by focusing on making UX more "simple, reliable, easy to understand". By focusing on being different and expressing your brand identity, you go towards even worse state than the local maximum you're trying to escape.
A brutalist website would be one without a stylesheet, or a simple txt file rendered in monospace.
These are just websites that go out of their way to be ugly and unusable. Nothing to do with brutalism, and more to do with pretentious art school graduates ruminating on the critical theory of intersectional webdesign or some other bullshit.
It reminds conceptually more of Emigre magazine [1] or Ray Gun [2], where the design didn't have to be "readable".
[1] https://www.emigre.com/Magazine
[2] http://www.davidcarsondesign.com/t/tag/raygun/I think of (old) Reddit, Craigslist, this very "forum", and similar ones that are mostly text with minimal/no JS or graphics.
Brutalism is inherently utilitarian. Content over presentation.
IETF RFCs are brutalist.
It’s expensive and challengjng to build a culture around design (Airbnb, Apple...) and build new patterns. It’s probably cheaper to just go Wild on the UI, not sure if that would stick though.
the materials don't show through. the websites are ridiculously pretentious.
roughness & exposed structures are likely to be problems in function.
visible thought processes - logorrhea is the other term for that. or brainstorming. Neither should be put up for public view.
the websites the article castigates are identical in style, but not bad, per se. they exemplify a certain aesthetic, and a cookie cutter way of design that is driven by, I think, the north European minimalism trends of the 1960s via Rams and Ives at Apple.
if you want to go for a bad influence that is useful, I suggest pondering LaTeX. Textfiles. http://motherfuckingwebsite.com/ . Hacker News. Possibly even the NYT or the WaPo.
design that is aimed at information transmission: not ads, not branding, not razz ma tazz to tickle the eye and neglect knowledge & understanding.
Alexander's concepts on architecture have much to commend themselves when considered for information transmission as well.
I get that there's a point to individualism, being trendy, hip, new and having a brand. But to be brutally honest, brands these days are created through spoken narratives with their actions, their storytelling, and their advertising. I think most skilled designers learned that long ago - it's much more efficient to speak through the traditional mediums of color, graphics, stories, and text. You have to do a ton of work to create your own look and feel framework (most of it involving robust layouting, consistency, and thinking through a ton of edge cases - read the material docs from cover to cover to get a sense of how much decision making it is). While doing this, you have to balance both branding AND UX decisions(!). Sticking to using graphics, color, and text separates a lot of the branding vs UX concerns, and is much simpler to reason.
Unless you're a rock band or a creative agency, creating a novel new page styling is simply an inefficient use of time and money.
Brutalist UX is the apache webserver 404 page.
box-shadow: black is less bits of information than box-shadow: 2px 4px 0.5em 0.2em rgba(100,55, 45, 0.9)
Brutalist architecture is intended to reflect the functional structure of the building. That concrete is there for functional reasons; it is sized for functional reasons such as holding up the wall. Concrete is used because it’s a functionally versatile material. All that functional purpose is exposed.
Brutalist web design might be something like showing the DOM without styling it. In a Lisp context, it’s be like showing raw s-expressions as output.
I think you’re being too literal about what constitutes material. You think only something the level of hardware or a programming language is “material” and everything above that is arbitrary, but I would argue ALL of the layers of the stack constitute material properties.
How about this: form submission. You don’t need it... you can use Ajax. But forms that can be submitted will work in more environments (no JavaScript, forward and back navigation, etc)
You can fight that current, but the underlying technology wants you to use forms.
I’m not really arguing about Brutalism though, so much as modernism. A modern web page would contain a minimum of changes to what the basic simplest HTML would yield. You start from the raw material with all its idiosyncrasies and you only add a dimension of “designed stuff” when you have a specific articulable rationale for it.
(This is totally different from the colloquial definition of “modern web applications” which are anything but respectful of their materials)
Also, a link to Brutalism worth protecting of the concrete variety:
For many business minded people, it’s about what’s most useful and pleasant for our USERS, not about satisfying their collective art fetishes.
PS: I miss skeumorphism and the ability to quickly differentiate content areas from controls.
It makes sense in architecture, but a similar style in web design doesn't: all web design proudly embraces high tech by its nature, even the simplest examples; ornament can only be simulated, without craftsmanship and actual complication (compare a CSS box border, represented by a few number and implicitly existing even when invisible, with a plaster frame around a door); structures are always simple and evident, differing only in taste.
The point the article tries to make (escaping horribly homogeneous industry trends, with the advantage of having some identity) is valid but unrelated to brutalist architecture.
Looking at http://brutalistwebsites.com/ I see an inconsistent roundup of web design that, since it departs from the mainstream style ("mobile-first", short text, rectangles, centering,...) can be automatically considered relatively cool.
In reality, there are many styles represented: actually mainstream, but accidentally good; glitchy and rough and strange, as traditional for designers showing off; revival of the "Swiss" typographic style that went hand in hand with middle-late brutalist architecture and is somewhat contrary to current trends (close spacing, balanced and regular 2D layout, non-hipster fonts); camp or spiteful imitations of antique and/or aberrant ugly web pages; not self conscious, merely simple and functional.
I run something similar - DiscoverDev ( https://discoverdev.io ) and got a lot of compliments on the "brutalist design". Then again it is a minimilist site, I really doubt this would work well for larger applications.
Here's the problem with web design: Nobody actually designs anything. They mindlessly copy the look of things, without giving thought to how things actually work. Examples:
1. Apple made the first iOS have references to real world items (the dropdown menus looked like rolling dials.) Makes sense because touch mobile interfaces were new, and the references gave users a clue how to interact with them. The takeaway for hack designers was to cover everything in fake wood and leather textures.
2. Some designers rightly avoided this trend, and made designs with less references to physical textures. Hack designers declared this the "flat design" trend, and proceeded to strip as much depth from their designs as possible. Now buttons were just squares, with no indication whether they could be pressed or not. There were no borders to break up featureless blobs of content. Icons were redesigned to be as minimal and abstract as possible, to the point where you couldn't tell what the icon was supposed to be.
3. Google created their own design guidelines (material design) that tried to keep the flat look while adding back some much needed affordance by way of slight shadows and animations. Hack designers mistook material design for a new trend, and made their own copy cat interfaces. A style intended to give one company a visual identity, in the hands of poor designers, made every company have the same identity.
The same thing keeps happening. It will happen to web brutalism (whatever that is.)
It won't change until web designers and the people who hire them start seeing the role of designers differently.
1. Brutalist design means having huge-ass boxes floating around, with cool animations, sans-serif fonts, all powered by 500MB of JS libraries
2. Dropbox is exactly the same as it has been for the last 10 years, they just conformed to the ubiquitous standard of modern web design, and redid their logo to be EXACTLY like the logos of all the other tech companies in the world: sans-serif font, simple stylized icon
Good read.
As a side node, I think that this experiment I did on my blog a while back accidentally matches the definition of brutalism better than the examples in the article: https://danielegrattarola.github.io/metaverse/
These are really cool, did you come up with that function for the mandelbrot set? Do you have an explaination of how it works??
My favorite of the entire set is the ZK/U site, as it has strong borders and contrast and other elements of this new langauge, but not at the expense of being easy to use and navigate.
[1] http://osscreenshots.s3-us-west-2.amazonaws.com/bruatalist1.... [2] http://osscreenshots.s3-us-west-2.amazonaws.com/brutalist2.p...
I did not go all the way, however. The site is still 11kB plus a 16kB non-essential image. It has quite a bit more than 7 CSS declarations. I did not minify the markup like Better M* Website.
Any feedback is welcome, however!
...I take it you have tried local style sheets (or w3m)
Its submission from 2 years ago: https://news.ycombinator.com/item?id=11517491
Example: https://adbusters.org/
And I'm fine with that. Generally I'd trust Apple's guidelines a lot more than J. Random Designer's, so for those that are not willing to do a lot of work, I'd really prefer if they chose a decent guideline rather than trying to fake it themselves. Yes, I know that there are those who are great with design, and I'm not discounting them: they should be free to do what they want, but I'd like for there to be a barrier to entry. If you really know what you're doing, sure, go on ahead; otherwise, stick to the default.
Brutalist architecture is only rarely not ugly while simple buildings are often beautiful.
Here’s to more variety and diversity on the web!
[1]: http://s3.amazonaws.com/simpleuseful/index.html [2]: https://www.simongriffee.com/notebook/web-design-where-to-be...
There isn't really an argument for brutalism except laziness and the usual contempt the design community has for its end users. Minimalism has its place, as does maximalism, depending on the context within the application. But that requires actual thinking and then both taste and skill, respectively. Much easier to just wallow in contempt with occasional outbursts of sarcastic novelty, as architecture has done for the last sixty years.
A raised material design button is not ornate, it is plain and simple way to propose an action to a user.
Take the following couple of sites as examples:
https://www.designbetter.co https://dropbox.design
I wholeheartedly agree that we should resist homogeny in product design.
Graphic designers have, in fact, shrugged off individuality in favor of convention in the name of usability.
Is the design universe bent toward homogeny? I mean, look at cars or houses. Is everything destined to come in 4 colors, 3 models and a trim package?
https://web.archive.org/web/20180413180014/https://www.imagi...
The web used have identities, you KNEW you were in Vimm's lair. Now it's all the same bootstrappified muck.
The question is, how do you convince management to allow this direction?