Brutalist Design Is the Bad Influence We All Need

https://www.imaginarycloud.com/blog/why-we-need-web-brutalism/

by vanni • 8 years ago

335 164 8 years ago

forkLding2• 8 years ago

Reminds me of the Adbusters Magazine I used to read as a kid. Philosophically and aesthetically brutalist and uncomfortable.

kolpa2• 8 years ago

What does "Philosophically and aesthetically brutalist and uncomfortable." mean?

forkLding2• 8 years ago

Will understand when you pick one up by accident at a local library if they have it, its very aesthetically well done but also usually uncomfortable content

Example: https://adbusters.org/

Chaebixi2• 8 years ago

Adbusters Magazine is the epitome of style over substance.

pkamb• 8 years ago

I was blown away by the new Northwest Film Forum website:

https://nwfilmforum.org/

Also, a link to Brutalism worth protecting of the concrete variety:

http://www.sosbrutalism.org/cms/15802395

jboles• 8 years ago

Sadly the Sirius building is likely to be torn down :-(

nugi• 8 years ago

1st link, 'javascript is required'. Brutal indeed.

tomc19852• 8 years ago

And yet for all its supposed innovation, web brutalistism still looks overly pretentious as it revels in its 'aesthetic' of psuedo-Swiss minimalism.

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.

mnemonicsloth• 8 years ago

Beaucorp! What a great new word. One of the world-spanning megacorporations from William Gibson but decorated in a Beaux-Arts style.

tomc19852• 8 years ago

It's an old word, afaik. Means 'mega' in this context. Also I mispelled it :D

golergka• 8 years ago

Consumer products vs professional products. Time the user is willing to invest in learning your interface. USS Enterprise was designer for people who would learn it for several years in star fleet academy. Airbnb is designed to become more clear and obvious than booking.com in two first minutes the user sees it.

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.

hn0• 8 years ago

Sadly, those space wasters apparently sell better on touch devices, which is why they’re so popular. Most designers also prefer them.

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.

wffurr• 8 years ago

Please no. Branding through UX is bad UX. Simple, reliable, transferrable, easy to understand UX is good UX.

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.

Chaebixi2• 8 years ago

Please no. Branding through UX is bad UX.

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/

TeMPOraL2• 8 years ago

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.

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.

gweinberg• 8 years ago

Sounds to me more like a terrible idea that nobody needs.

master_ant• 8 years ago

I'm starting to get tired of the cookie-cutter Bootstrap and Squarespace templates taking over the web. This is a refreshing read, I like the comparisons it makes to brutalism in architecture.

kolpa2• 8 years ago

It's backwards, though, because Bootstrap and Squarespace are Brutalist (to whatever extent that word really applies to the web at all): cheap, egalitarian, and simple to use.

spking• 8 years ago

Correct. Bootstrap is the IKEA of frontend frameworks. Simple, predictable, cheap/free, and easy enough for almost anyone to pick up and build with.

Rotdhizon• 8 years ago

I was impressed with the brutalist architecture, those plain concrete buildings have something about them that I can't place. Maybe like the old concrete tower hovering over the backdrop of a new, colorful, city? Something about it peeks your senses. As for the web design, it was also interesting. I liked some of the designs, others not so much. The website for zku:

http://www.zku-berlin.org

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.

kaiby2• 8 years ago

I thought the same thing: when I first went to that site, I immediately thought, "I could've sworn I had made a site that looked like this back in the late 90’s..."

mhink• 8 years ago

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.

sporkologist• 8 years ago

It's refreshing seeing a site without a mystery-meat UI.

simplify• 8 years ago

Most web design trends since the 90s have been progressive. Brutalism feels like a step backwards for the sake of being different. Feels like one of those trends that will be very short-lived.

digi_owl• 8 years ago

When i think web-brutalism i do not think of anything illustrated in this article.

I think of (old) Reddit, Craigslist, this very "forum", and similar ones that are mostly text with minimal/no JS or graphics.

hammerandtongs• 8 years ago

Yes this article seems to be redefining "web brutalism" to be a simple recoloring of the same wretched over designed unusable webpages that "web brutalism" was a reaction to.

tzahola2• 8 years ago

This.

Brutalism is inherently utilitarian. Content over presentation.

IETF RFCs are brutalist.

tfranco3• 8 years ago

Won the internet

cpeterso• 8 years ago

The Drudge Report is another good example of a brutalist, content-over-presentation website.

deepakkarki• 8 years ago

The brutalist style works when it is the right design for the job, just shoehorning it for the sake of "design aesthetics" makes no sense. In fact it would work great for HN style webpages.

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.

kaiby2• 8 years ago

I actually really like the usage of borders in these "brutalist" designs. Current design trends seem to minimize or eliminate borders altogether, which makes it hard to visually separate content, which makes it hard for users to find the content they want. I thought I could browse through the text on these new sites faster because the borders were so much more prominent [0].

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/

krrrh• 8 years ago

In the late nineties I had the impression that Shepard Fairey’s original Mozilla logo really set the tone for thick border design. So many influential web designers frequently spent time on the site, and it felt like a thousand thick border stylesheets bloomed across the web for a few years.

https://web.archive.org/web/20000229231038/http://www.mozill...

tzahola2• 8 years ago

These people are conflating brutalism with postmodernism.

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.

smacktoward3• 8 years ago

I'm confused. I don't see what makes most of the examples cited here "Brutalist" in any meaningful fashion.

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.

sagichmal• 8 years ago

Brutalist design encompasses both Craigslist and these examples. There are commonalities there, as well as differences.

throwaway2048• 8 years ago

such as?

dangerbird2• 8 years ago

Also Wikipedia and a certain tech-centric online forum, to an extent.

ianbicking• 8 years ago

The ZK/U site (in one of the thumbnails) is one of the better examples, I thought: http://www.zku-berlin.org/

return13• 8 years ago

i dont get brutalist vibe

smacktoward3• 8 years ago

Yes, that one jumped out at me as an actually good example too!

l9k• 8 years ago

This site is better viewed zoomed out to 60%

agumonkey• 8 years ago

windows 2 is about to sue

return13• 8 years ago

Since they are talking about departure from repetitive, orderly design maybe it should be called modernism. Or maybe they should drop the architecture analogy altogether, their point still stands though that the web is becoming so uniform that you need to look at the address bar to avoid confusion.

niftich3• 8 years ago

As for "exposed structures", I'd include the prominence of the box model underlying the rendered HTML, emphasized by visible borders and/or distinct backgrounds.

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.

smacktoward3• 8 years ago

Ooh, I like that. That's a very useful interpretation! Thanks!

niftich3• 8 years ago

Then again, the label 'brutalist' is fraught with conflated interpretations that to some followed logically, yet in other contexts they appear to be in conflict. From the very beginning, the term sprung out of linguistic confusion between French and English [1], where Le Corbusier's French descriptor for 'raw concrete' was lost in translation and reinterpreted by English commentators as brutal, then art imitated life as later works seized on this attitude and were intentionally designed to be provocative [2].

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

michrassena• 8 years ago

The only thing I can think of as web-brutalist is table-based layouts with the cell borders exposed.

aeneasmackenzie• 8 years ago

Here is an "exposed structures and visible thought processes," website: http://motherfuckingwebsite.com

pbourke• 8 years ago

Came here for this and to also link http://bettermotherfuckingwebsite.com

rhizome• 8 years ago

Brutalism is not about drabness, it's about the use of basic materials. Beyond that, I think a lot of what you ask appears to be an attempt to create a 1:1 relationship between the terms of an architecture (as defined by the article) and web design, which is a big ask.

malvosenior2• 8 years ago

Craigslist is a great example of what actual brutalist design would look like on the web. Not the web, but ncurses and other cli like uis are probably brutalist.

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.

naravara• 8 years ago

Wouldn't motherfuckingwebsite.com be the perfect distillation of the philosophy he's talking about?

nostalgeek• 8 years ago

I'm confused. I don't see what makes most of the examples cited here "Brutalist" in any meaningful fashion.

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.

inostia• 8 years ago

It also used to be called "anti-design". The concept has been around for a while. I really get annoyed when terms like "brutalism" are co-opted as yet another buzzword/trend/fad.

radley• 8 years ago

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.

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.

theoh• 8 years ago

It's a style or a sensibility in other words. Gorgeous rawness—not just accidental rawness. Don't ever try to convince an architect of that, though.

joqje09309• 8 years ago

I think you hit it with "unconventional layouts" bit.

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

saint_fiasco• 8 years ago

The second definition might be a site like 4chan, where signing a post via tripcodes makes the cryptographic signature visible to users, and people quote other posts by referring to the post number, possibly even the same as the post id in the database.

bananarepdev• 8 years ago

And to the other definition, "exposed structures and visible thought processes," I'd point to...

Have you ever got a stacktrace in an http 500 error page? There you have it :)

someoneelse987• 8 years ago

I like the word "brutal" in this context.

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.

pnathan2• 8 years ago

brutalism as an architectural concept does not connote violence. le brutalisme comes from the word "raw" in french; "raw concrete", that is.

arkh• 8 years ago

I'm not sure there is any web site that would qualify as Brutalist by this definition.

http://danluu.com/

keithpeter2• 8 years ago

Almost

Uses javascript at various point though.

ReverseCold• 8 years ago

Looks good in lynx

tejon• 8 years ago

+1 to this analysis. The very first thing I thought of when I saw the title was [1]. Most of the examples in the article just confused me.

[1] http://mlreference.com/

lainga• 8 years ago

Also anything to do with Linux kernel development, I've noticed, especially lwn.net and lkml.org.

On your last paragraph, I'm afraid that "web Brutalism" is already a parking lot. Anti-bourgeois? Really?

GuB-42• 8 years ago

I thought the same thing. Actually I thought "no css", make it the way pages look when only the html loads.

ggg9990• 8 years ago

I find JIRA also pretty “brutalist” in the style of Craigslist.

dec0dedab0de• 8 years ago

I'm not sure there is any web site that would qualify as Brutalist by this definition.

maybe a page created on something like jsfiddle.

Heck, sincewe compile js now, you could say anything that still has readable source counts.

doomlaser• 8 years ago

Wikipedia is the closest thing that comes to mind. Anything that lets you form edit through html in raw html, or liberal markdown.

kevin_thibedeau• 8 years ago

Seems more Bauhaus to me.

stephen_g• 8 years ago

Yeah, I think it's impossible for a web page or application to really be brutalist.

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.

taneq• 8 years ago

Yeah, I think it's impossible for a web page or application to really be brutalist

Bare HTML with no styling (inline or CSS).

mr_toad• 8 years ago

https://cran.r-project.org

It’s as close as anything I can think of. All function and little, if any, attempt at style.

microcolonel• 8 years ago

The problem is that the people who complain the most about the "bourgeoisie" are the bourgeoisie themselves. Everyone else is content to live their lives without denigrating people for actually knowing what they're doing.

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.

return13• 8 years ago

exposed structures and visible thought processes

If you press F12, it turns any website to a brutalist one

cschmidt• 8 years ago

I guess I'm missing the connection on those websites to Brutalist architecture. It seems more like they're bored with regular design, and want to be more experimental.

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/

quantumofmalice• 8 years ago

Archived link since the site has been, ahem, brutalized:

https://archive.fo/3W7yY

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.

tfranco3• 8 years ago

Whas the site down?

robeastham• 8 years ago

Original article currently offline for me and so I found it here:

https://web.archive.org/web/20180413180014/https://www.imagi...

SlapHappy• 8 years ago

I think HN is better example of "brutalist" web design than most of the examples. Plain typefaces and colors, rigid lines and block-y structures.

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).

Semiapies• 8 years ago

And "challenging" people or making them "uncomfortable" was never what the Brutalists were trying to do. They were utopians trying to build useful, life-improving structures unhampered by convention and superficial decoration. Any aesthetics had to come from the fundamental design and undisguised materials. Their designs often had a lot of practical problems, but they were never trying to be weird or off-putting for the sake of artiness. Hell, a lot of Brutalist buildings were the most functional, utilitarian structures you can picture.

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.

eeZah7Ux• 8 years ago

Describing a startup-happy billionaire-loving site like HN as "anti-bourgeois" is comical.

cwkoss4• 8 years ago

Describing any CSS style or design pattern as "anti-bourgeois" is comical.

bobsondugnutt2• 8 years ago

A lot of those sites appear Brutalist, but open up their source and you can see they are still quite bloated. So they are just going for the look. Someone posted https://wiby.me on here regarding an article about old websites. This is an example of web brutalism, the site itself is basic but not ugly and there is practically nothing in the source that is going to slow down my machine. Hacker News is also a perfect example. Now one example from that article (https://theoutline.com/ which I picked randomly) has a 284kb CSS file in it. This is the norm, not the exception for most contemporary sites.

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...

jamestimmins• 8 years ago

That sort of makes sense though, if the design trend (whether you wanna call if 'brutalism' or just the form du jour), is more focused on the aesthetic rather than how it gets built. I suspect the adherents to this type of design would consider themselves designers, not developers, and thus are less concerned with bloat and file size.

_bxg1• 8 years ago

Brutalism seems like the wrong comparison to make with this new wave of design. The way I see it, brutalist websites would be websites with little or no CSS (see: http://www.motherfuckingwebsite.com/). They expose the "concrete of the web".

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.

underwater• 8 years ago

I think there is a difference between design that is deliberately raw, and something that hasn’t been designed at all.

TeMPOraL2• 8 years ago

In this sense, brutalism is not designing at all.

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.

DavidVoid• 8 years ago

The examples in the article seem more punk, if anything.

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

scott113341• 8 years ago

This is a fun website to peruse every once in a while: http://brutalistwebsites.com/

Its submission from 2 years ago: https://news.ycombinator.com/item?id=11517491

tgb• 8 years ago

In what ways are these "brutalist"? The first two I clicked on had (in one) music auto-playing over a video with your mouse pointer a Terminator-style claw and (in the other) a 3D animated leg that you could spin before hitting 'access' to get to the actual site. These aren't brutalist, they're the trying-too-hard-to-be-cool teenager phase.

[1] http://gregroque.com/#/home [2] https://heel.zone

ttoinou• 8 years ago

"honest, unpretentious and anti-bourgeois" and then cites Habitat 67 in Montreal.. I thought Habitat 67 were high end

krapp• 8 years ago

Sorry, but unless your site is an open directory full of plain text files, it's not "brutalist."

tfranco3• 8 years ago

Like an RFC?

tw1010• 8 years ago

Convince me this isn't just a ploy by designers to justify their existence over templates.

cwkoss4• 8 years ago

"Hey, looks like your website isn't using the most cutting-edge design theory, because look at this one that I just made up"

leoc• 8 years ago

I'd rather that someday someone started a social-media discussion about beautiful International Style buildings https://www.bauhaus-dessau.de/im/1128x0/4521fb85f94dd85172f2... https://www.bauhaus100.de/en/past/works/architecture/chicago... instead of another round of clickbaiting with self-consciously gimmicky buildings from the fag-end of modernism.

pnathan2• 8 years ago

this isn't brutalist, this is pretentious.

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.

solidhal• 8 years ago

The Humanities building at the University of Wisconsin Madison is a great example of Brutalist design in my opinion. And its beautiful.

code_duck2• 8 years ago

I grew up admiring the brutalist inspired buildings at UNM (the style blends nicely with adobe and Pueblo architecture). There are many in Albuquerque. The style also reminds me of late 70s science fiction art depicting spaceships and vast buildings.

saagarjha• 8 years ago

Naturally, a lot of graphical and aesthetic principles ended up dictated by languages such as Google’s Material Design or Apple’s Human Interface Guidelines.

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.

jopuwep12489• 8 years ago

No no no. No more. No more isms.

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.

toddmorey• 8 years ago

Is this just a new type of monotony though? Look at the sites in these two rows from the Brutalist Websites collection (1 & 2 below).

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...

rayiner3• 8 years ago

The idea of web pages as Brutalist is ironic. Brutalism was a movement meant to not hide structural concrete or make it look like something else. The concept has no meaningful analogy on the web, where no style that showstopper the raw structure (because there is no visible structure, it’s all equally arbitrary.)

cwkoss4• 8 years ago

If the user can't see the UUIDs of every object rendered on the page and you are using a non-standard font, your design probably is not very Brutalist.

Brutalist UX is the apache webserver 404 page.

erikpukinskis3• 8 years ago

That’s just not true, HTML has natural spacing, fonts, etc. What’s the least amount of code you could possibly write that functions? That’s going to be the most “minimalist“ design.

box-shadow: black is less bits of information than box-shadow: 2px 4px 0.5em 0.2em rgba(100,55, 45, 0.9)

rayiner3• 8 years ago

But those are arbitrary design choices too, just default ones. They don’t reflect the underlying functional structure of the page.

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.

eecc• 8 years ago

So it's all about tossing around magenta printing plates and calling it a day. Meh... it looks like mocks to me, but I'm an old geezer

EGreg• 8 years ago

Designers have fads. Why should the rest of us care and go along with their designs trends and counter reactions?

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.

iambateman• 8 years ago

The author made a few points I thought were odd (“web design is now brutalist, which is Neoflat but also good”) but one point that seems helpful:

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?

_fh5n• 8 years ago

Key points that we can take away from this article:

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/

offbytwo• 8 years ago

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??

thedirt0115• 8 years ago

Larry Wall (creator of Perl) was ahead of the curve on brutalist design :) http://www.wall.org/~larry/

crb002• 8 years ago

Homogenized is OK. Better UX that is evidence based than betting the farm on an art project.

purplezooey• 8 years ago

Personally I miss Brutalist buildings. We build very cheaply and flimsy now, especially in the west, with 2x4 construction where you can hear everything happening in the building. Brutalist buildings made extensive use of concrete which we should use more of.

cwkoss4• 8 years ago

This article reads like it was written by a web designer who coined the usage of brutalism in the web space and uses it to try to sell themselves and differentiate their design work, even though their design isn't particularly unusual.

syndacks• 8 years ago

Perhaps a bit off topic, meta even, but the design of the copy here (which borrows from Medium) ruins the experience for me. One shouldn't have to bold text or use quote type styling to make something stand out. Write engaging prose.

lwansbrough• 8 years ago

I think it's possible to create visually stunning and unique designs without relying on (IMO) low quality brutalism.

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.

sergiotapia• 8 years ago

Anything to get away from this boring, corporate sanctioned influence of web design! Please!

The web used have identities, you KNEW you were in Vimm's lair. Now it's all the same bootstrappified muck.

https://vimm.net/

The question is, how do you convince management to allow this direction?

kroltan• 8 years ago

As a shameless self-plug, I was inspired by http://bettermotherfuckingwebsite.com/ for my personal website: https://kroltan.github.io/

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!

bobsondugnutt2• 8 years ago

Nice work. I see you used your CSS sparingly.

blhack• 8 years ago

No, the "bad influence" we all need is COLOR. I am so fed up with all of this meaningless "flat" design. It's awful. Our monitors are capable of making millions of colors. An icon can be more than white. This isn't paper and you aren't paying per color.

avinium• 8 years ago

I've been in love with the Bloomberg redesign since it was launched, not sure I'd call it "brutalist" though. Strong/high-contrast, yes.

daleco• 8 years ago

The article isn’t drawing a clear line between visual design and design patterns. Many people confuse UI and UX design. One is artistic (UI), the other one is based on cognitive science (UX). UI will define the looks, the interface may be pretty or bold, but not necessarily usable and intuitive. UX design will reduce the gap between human and machine by efficiently implementing design patterns, and user centered methodologies (human factors).

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.

justonepost• 8 years ago

Brutalism was usually pretty functional. To compare mediocre web design to a widely respected (at least for the time) architectural movement is reaching.

spyckie2• 8 years ago

Here's a novel thought: maybe we're following Google and Apple's design frameworks because those frameworks provide the best ease of use, consistency, predictability, and usability to designers, which is the point of good UX? People who don't appreciate these things don't understand user experience applies to the process of design too?

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.

bitexploder• 8 years ago

Not gonna sugar coat it. HTML and CSS are basically Bootstrap for me. I know how to tweak it and make responsive design with it. It is functional for my own projects. It is easy to tweak it to at least give a little distinction to my UI. I know the basics of UX and it's easy enough to do. Why spin my wheels dealing with going deeper when I just want UI that works as a non-designer.

HelloNurse• 8 years ago

Brutalist architecture mainly involves raw concrete, proudly exhibiting the modern construction technology of its time instead of pretending to be something else, and more generally avoiding pointless ornament and complication.

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.

tree_of_item• 8 years ago

I want everything to look the same. Terminal apps all look the same, Emacs "apps" all look the same. When things look different it's hard to tell what the hell is going on, and for what? So your stupid brand can advertise more efficiently? I don't care, I want to do whatever it is the app is supposed to do. So I'll pass on this brutal nonsense, thanks.

keithpeter2• 8 years ago

We lost that when the gopher protocol went away. I was hopefull about RSS for a bit but then they started just pushing a tag line or summary...

...I take it you have tried local style sheets (or w3m)

hypertexthero• 8 years ago

I agree with the premise of the article, but maybe [simple][1] is a better term than brutalist for [good web design][2].

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...

thomastodon• 8 years ago

These websites are not of a brutalist style. Habitat 67 and the like, while having a plain aesthetic, never did so at any expense of their user's ability to find their way around. These websites are relatively incomprehensible, and categorically closer to deconstructivist than brutalist.

A raised material design button is not ornate, it is plain and simple way to propose an action to a user.

Brutalist Design Is the Bad Influence We All Need

Related Stories