27 ms·

Show HN: Brutalist Hacker News – A HN reader inspired by brutalist web design

101 points by wkyleg 3y ago

I've developed a Hacker News reader that draws inspiration from Brutalist Web Design, the open web, Cyberpunk Aesthetics, and glitch art. The entire project is crafted in Vanilla JavaScript, contained within a single index.html file, eschewing any external libraries. It features support for theming, including the use of third-party themes. Additionally, users have the capability to create and apply their own themes directly within the site. Moreover, the application is designed as a Progressive Web App (PWA), enabling it to be downloaded and used as an app on most devices. I'm eager to receive feedback on both the implementation and design aspects, particularly from the Hacker News community. Mobile device testing remains a priority for further refinement, so insights in this area would be particularly valuable. For more detailed information and to explore further: - Project details are available at https://github.com/wkyleg/brutalist-hacker-news https://github.com/wkyleg/brutalist-hacker-news - To add or experiment with themes, please visit https://github.com/wkyleg/brutalist-hacker-news/blob/main/themes.md https://github.com/wkyleg/brutalist-hacker-news/blob/main/th...

sph 3y ago
I feel the original HN is much more brutalist than this demo. Bold colors and saturated gradients are not at all a part of that artistic movement. "Brutalist buildings are characterised by minimalist constructions that showcase the bare building materials and structural elements over decorative design." says Wikipedia. The closest thing to this definition is the original https://motherfuckingwebsite.com/ https://motherfuckingwebsite.com/ and not one of its later variations. One day I did some contract work at Giorgio Armani's offices in Milan, and, ignorant of brutalism, I thought it was the ugliest building I've ever been in. The entire interior was naked grey concrete. The floor, walls, ceiling. Everything was grey concrete. Now I know that it was brutalist in design, and as an art style it usually is pretty ugly, bare and quite gray.
- hyperorca 3y ago
  I agree. On reading 'brutalist', I thought it would be grey, or purely black and white, more "concrete" and slightly depressing.
  - chatmasta 3y ago
    I’ve always thought of brutalism as the ultimate “function over form.” It’s brutal in the sense that it “brutally” strips away the form until all that’s left is the function. It’s like minimalism without the vanity.
    - tmountain 3y ago
      I have been operating with the same working definition for a long time. I think the author is misusing the term.
      - mikestew 3y ago
        Might want to look it up before getting set on your definition. Sibling comment has it (mostly) right: it’s literally “raw concrete”.
        tmountain 3y ago
        Learning moment. Thanks for the clarification.
    - unavoidable 3y ago
      Brutalism actually comes from the French word for concrete, "beton brut"; not English "brutality". https://en.wiktionary.org/wiki/Brutalism https://en.wiktionary.org/wiki/Brutalism
      - retrac 3y ago
        Unfinished concrete, specifically. I would translate "brut" as "bare" or "unrefined" here. English brutality is related to French brut, but in French it means more like crude, unrefined, raw, blunt, with no particular sense of animalistic or violent.
        omneity 3y ago
- thornewolf 3y ago
  The design style is more accurately labeled "neo-brutalism", which is characterized by these bold colors. gumroad is one of the most popular examples: https://gumroad.com/ https://gumroad.com/
  - vineyardmike 3y ago
    Neo-Brutalism is an accurate way to describe GumRoad's design, but not the OP. Neobrutalism adds color and bold design to brutalism, but maintains the simple focus on structure and function. NB features prominent and simple shapes to delimit UI elements and buttons, and bold and prominent typography. NB is not "Retro" nor "cyberpunk", and it doesn't add in superfluous details and decorative elements. You wouldn't use Emoji in NB when a simple bit of plaintext would do. Good for the OP for working hard to create something very fun and unique, but it is not Brutalism nor NeoBrutalism.
    - deleted 3y ago
      [deleted]
    - wkyleg 3y ago
      I was a little loose with definitions but wanted something aesthetically similar to a site like Gumroad or Tailwind in terms of Neo-brutalism Otherwise, I was more concerned with the approach to software development and bloat
- deleted 3y ago
  [deleted]
- imp0cat 3y ago
  Agreed. And I really wanted to like it. I guess the weird colors are the glitch + cyberpunk influence?
- keepamovin 3y ago
  This is true from the 'looking back' point of view of how the term's been used in the past, but there's currently a re-appropriation of brutalist experience re-interpreted by a younger, forward looking very creative movement producing these types of experiences that incorporate elements of glitch, retro, video-game saturated colors. You can understand it a bit by seeing how compared to modernslick web design, these creations invoke something similar to the spirit of brutalist.
  - drivingmenuts 3y ago
    No, not at all. If anything, the flashy, glitchy BS seems pretty anti-brutalist. Brutalism is about functionality, pure and simple. It doesn’t have decorative elements. It’s not cool,except in temperature. It doesn’t have to be ugly, but the beauty of brutalism is minimalist, at best.
    - maxglute 3y ago
      Label is being re-appropriated, IMO doesn't make a lot of sense when it goes against core tenets. But alot of GenZ aesthetic are fun, but their naming hardly makes sense, or doesn't even try to with the iconography/typography being used. It's mostly vibes or labelling for the sake of categorization. See Frutiger Aero.
      - drivingmenuts 3y ago
        Whatever. It's fine as long as they don't get upset when we ignore their clearly misguided labeling and hand them a dictionary to look up "brutalism".
        deleted 3y ago
        [deleted]
        wkyleg 3y ago
        I think my definition is better and much more inline with what most users want and how open web standards actually work Pure HTML sites with no JavaScript are to archaic and web technologies have improved significantly. A better standard of comparison is current HN mobile and desktop apps, or other popular websites that use large frameworks and obscure their functionality to end users Beyond this, I made a HN reader for the way I personally browse HN with absolute minimal lines of code and maximal cross platform utility so I can use this on desktop, mobile, my iPad, etc. I really don’t care that much about adhering to pedantic definitions of brutalism and a lot more about making something that I like using
- retrac 3y ago
  When it works, it's not ugly but, vaguely inhuman and austere. A kind of modern Gothic, like a medieval cathedral, overwhelming with dread and awe. Perhaps unsurprisingly it's quite a popular style for modern cathedrals, as well as courthouses, etc. My hometown, Toronto, is rather infamous for its fondness of brutalism: https://www.instagram.com/torontobrutalist/ https://www.instagram.com/torontobrutalist/ I personally used to always hate it but some of it has grown on me.
  - julianeon 3y ago
    It's funny that Toronto is a stronghold for brutalism, because if I had to name the most beautiful Canadian city, it would be Toronto.
  - someoldgit 3y ago
    I always liked the UofT Library.
- epolanski 3y ago
  But that's brutalist "web design" not architecture.
- wongarsu 3y ago
  If somebody had asked me what design movement this was inspired by, my first answer would have been that it's an interpretation of Frutiger Aero [1] through the lens of Windows 3.1. But if you change the theme to grayscale I can kind of see the connection to brutalism. The visible div borders around every comment are bare structural elements, and the huge skeuomorphic buttons are certainly closer to brutalism than HN's UI. HN is about the UI being minimalistic and muted, out of the way to the point of being nearly invisible. Brutalism on the other hand is about a kind of in-your-face minimalism, which this version does capture in a way. 1 https://aesthetics.fandom.com/wiki/Frutiger_Aero https://aesthetics.fandom.com/wiki/Frutiger_Aero
  - wkyleg 3y ago
    Yes, I am going to change the default theme to greyscale
    - keepamovin 3y ago
      Do what you want but please don't do it because they're criticizing you: https://www.youtube.com/watch?v=VtvjbmoDx-I https://www.youtube.com/watch?v=VtvjbmoDx-I
keepamovin 3y ago
I love this, this is so cool. Look at that aesthetic. The colors, gorgeous. Your GIF demo, perfect. A crazy desktop style early UI app for HN? Perfect. Thank you for making this. So cool. I would love to throw a browser in there. I have a retro page for a browser, but it's not quite done: https://browse.cloudtabs.net/roses/macintosh_system.index.html https://browse.cloudtabs.net/roses/macintosh_system.index.ht... I just checkout out your live demo at https://brutalisthackernews.com/top?storyModalIdList=39952826 https://brutalisthackernews.com/top?storyModalIdList=3995282... It's even nice and useable. I love how stuff just opens. It's crazy, it's really cool. I love how you just like "abundant windows". So cool. This is like perfect desktop. The way it works, takes me back. So cool to see HN through the prism of this ancient technology with a modern/glitchy color aesthetic twist. Love it. I hope you keep working on this :)
- wkyleg 3y ago
  Thanks!
zwaps 3y ago
I am confused Brutalist Web Design advocates for some simple rules which this thing doesn't seem to follow. It has more Javascript and the back button doesn't work. So, compared to this, the original Hacker News is actually Brutalist. Maybe I don't get it.
- keepamovin 3y ago
  This is 'technically' true for a strict/literal (antiquated? heh:)) use of the term Brutalist. However, Brutalist as a term of art is being appropriated by a new crowd of retro aesthetic creators who like pixels, old UI styles and colors and glitch. You can be generous with your interpretation by understanding, compared to modern bland slick web design, this stuff can be viewed as invoking a brutalist experience for the viewer/participant, which while differing in the letter of the previous usage, aligns in many ways with the spirit of it. Of course, art is subjective experience and perception as well. I get if you feel differently and that's interesting! I'm sure you "get it" from where you stand. And that's perfectly valid I think. :)
  - drivingmenuts 3y ago
    Can you provide some other examples of artists who are “reinterpreting Brutalism”? Because it seems to me that they are completely missing the point.
  - FdbkHb 3y ago
    Brutalism is about the expression of form follows function. A brutalist building is grey not because people love grey but because that's the color of naked concrete and painting over would be considered adding needless form. Now, a color must be picked when you make a website, and it doesn't have to look grey, as pixels do not have an inherent color, unlike real world materials, such as concrete, wood or metals. But if you add useless animations (that glitchy thing at the top is obnoxious) that exist solely for the purpose of looking cool and not aid with understanding the UI, you are doing the absolute opposite of brutalism: form over function. This HN 'app' is several times worse to actually use over plain HN. It's not more legible, it's distracting, it breaks the back button etc. I wouldn't call this "appropriation of brutalism" but "misunderstanding of brutalism". It is definitely not ""antiquated"" to care about usability and removing distractions.
lemonwaterlime 3y ago
HN is already brutalist. This linked site is not brutalist. This is closer to a punk aesthetic, perhaps even verging on Dadaist.
- deleted 3y ago
  [deleted]
- nittanymount 3y ago
  agreed
  - deleted 3y ago
    [deleted]
  - wkyleg 3y ago
    The glitches hide the fact that every story has to be loaded async just to get the title and that this is very hard to do without some degree of jank OR a performance hit from loading as many requests are on the page in parallel The fact that you think this is entirely intentional is proof that it works!
- YurgenJurgensen 3y ago
  Using scripting to deliberately introduce visual glitches is about as punk as buying pre-distressed jeans from Walmart.
yakshaving_jgt 3y ago
[flagged]
- deleted 3y ago
  [deleted]
Naac 3y ago
Neat! Unfortunately Firefox doesn't allow rendering of the post page inside the Brutalist windows. I get the following error: https://support.mozilla.org/en-US/kb/xframe-neterror-page?as=u&utm_source=inproduct https://support.mozilla.org/en-US/kb/xframe-neterror-page?as...
- deleted 3y ago
  [deleted]
- DEADMINCE 3y ago
  Works fine for me on Firefox.
- icepat 3y ago
  Yep, exactly why this is not brutalist web design. The site behaviour is unclear and rather frustrating to use. The breaking of the back feature is also bothersome.
- wkyleg 3y ago
  Some sites prohibit their content from being displayed in iframes, which his how I show them on the site. When this happens you can click the up arrow to A) open in new tab if in browser or B) open in in browser window if browsing as mobile or desktop app from PWA
snarkconjecture 3y ago
This follows fewer of the principles on the "Brutalist Web Design" link than HN does. In particular, it's slower, has less obvious links, breaks my back button, and has (imo) distracting unnecessary decoration. I would also bet it uses JavaScript for the "hyperlinks" but haven't checked.
- deleted 3y ago
  [deleted]
- wlll 3y ago
  The entire site fails to load unless you have JS enabled, so that's a fair guess.
contingencies 3y ago
I was anticipating a WebGL series of built spaces with structural properties derived from the relative comment strength, intuited subject type (from title semantics) and/or intuited per-thread social or technical properties (# links, information density, participation level, controversy level, emotionality, etc.). Perhaps arranged on a faux-street grid arranged through time and eyeballs, with the origin being "front page now".
- deleted 3y ago
  [deleted]
jl6 3y ago
The ultimate brutalist website is a bare Apache directory listing. Functional, raw, ugly, with the structure exposed for all to see.
- deleted 3y ago
  [deleted]
- akaru 3y ago
  That’s a perfect example.
- Barrin92 3y ago
  There's also this one which pops up on HN occasionally https://secretgeek.github.io/html_wysiwyg/html.html https://secretgeek.github.io/html_wysiwyg/html.html
maxglute 3y ago
Pretty cool, I'm a fan of GenZ aethestics, but holy shit do I hate their naming schemes. I know Brutalist is referencing webdesign, but some of these vibes themes are not very readable. Preloading gibberish is neat.
- deleted 3y ago
  [deleted]
082349872349872 3y ago
> It's messy but it's kind of fun to build with a browser the way it was originally indented, which is really more like Self, Smalltalk, LISP, although this aproach doesn't scale very well
- deleted 3y ago
  [deleted]
nico 3y ago
Amazing! Thank you for sharing and making it open source Would love to see a terminal/TUI version of this
- wkyleg 3y ago
  Thanks! This would be a bit hard to render in a terminal but a terminal browser like Lynx (https://en.wikipedia.org/wiki/Lynx_(web_browser) https://en.wikipedia.org/wiki/Lynx_(web_browser)) might work for this site
Retr0id 3y ago
The glitchy effects are cool but I'm not sure I see the connection with brutalism.
- drivingmenuts 3y ago
  I'm not sure I see any connection with readability.
scentoni 3y ago
[flagged]
- cflewis 3y ago
  [flagged]
enterexit 3y ago
It's kitchy, not brutalist.
uxcolumbo 3y ago
This might be great as an art piece, but I doubt it's something most HN users would use on a daily basis. Usability and readability first!
- deleted 3y ago
  [deleted]
fire_lake 3y ago
This is much less readable than classic HN, which is already plenty brutalist.
- deleted 3y ago
  [deleted]
MiscCompFacts 3y ago
I often use this site: https://brutalist.report https://brutalist.report to get a brutalist hacker news filter.
- deleted 3y ago
  [deleted]
PmTKg5d3AoKVnj0 3y ago
Perhaps it works as "brutalism" (from french: 'beton brut', Concrete) if the fundamental Concrete of the web is imagined to be different. I do not think it fits the bill as it is.
- deleted 3y ago
  [deleted]
akkartik 3y ago
To me this seems punk and glitch, but not brutalist. Arguably HN is already pretty brutalist. As a second exemplar, I consider https://brutaldon.org https://brutaldon.org pretty brutalist. It seems plausible that you can't be brutalist and be inaccessible without javascript enabled. It seems plausible that themes are the antithesis of brutalism. The point is to show the underlying structure. Not to add pretend structure.
- toxicunderGroov 3y ago
  I've always liked; https://brutalist.report/ https://brutalist.report/
  - gumby 3y ago
    I don't like brutalism in buildings, but this so-called "brutalist" web site seems pretty user-friendly to me.
    - Terr_ 3y ago
      In terms of buildings, I've always had the impression but brutalism wasn't so much about being unhelpful, but more about making the users feel small and unimportant... ... Which in a weird way describes some rather snazzy websites with inconsistent content policies and Kafkaesque appeals. Since it's hidden, it's a kind of cryptobrutalism, to (perhaps unnecessarily) coin a new term.
      - wkyleg 3y ago
        Yes, I think the main text layout with Links has this effect
      - Arn_Thor 3y ago
        The “purpose” (for lack of a better word) of brutalism was never to make people feel small and unimportant—though individual architects might have had different motivations from time to time. Rather, the style is about making buildings that are true to their purpose, simple and without ornaments, and that show the materials (concrete mostly) they’re made of. This specific website we’re discussing is actually quite full of flourishes, and so not brutalist in the architectural sense.
kjs3 3y ago
[flagged]
- deleted 3y ago
  [deleted]
jdpigeon 3y ago
This is cool! However I think the page is not interacting with the back button functionality correctly, at least on mobile.
- deleted 3y ago
  [deleted]
greatNespresso 3y ago
Interesting! At the same time, HN current design already looks kind of brutalist to me, it's crisp and sharp without fluff. That's what makes it intemporal and easily readable on every devices.
- deleted 3y ago
  [deleted]
andrewstuart 3y ago
Too much graphics for brutalist. Probably more 1990's GeoCities vibe.
- deleted 3y ago
  [deleted]
MrVandemar 3y ago
Wow! It's a peach coloured blank screen! Slow news day? I'd call it minnimalist rather than brutalist. What's that? Why yes, I do browse without Javascript. HN original works fine without it.
- deleted 3y ago
  [deleted]
- deleted 3y ago
  [deleted]
- wkyleg 3y ago
  The is a PWA, which means it is a cross platform app that can be installed on most devices I wasn’t really interested in catering to the 0.00001% of users who disable Javascript. I like the standards of the open web and think they’re worth building on. While imperfect, there’s nothing comparable in building cross platform applications that are also secure, easy to develop for, easy to release, easily capable of being audited
  - MrVandemar 3y ago
    * HTML is the standard of the open web. * It's cross platform and doesn't need to be installed on any device. * It doesn't need to be “audited”. It's secure. It's easy to develop for. It's laughably easy to release. * You weren't interested in accessibility, or people with bandwidth restrictions or connection problems, or who are just tired of the relentless firehose of shit that comes in on the “javascript” channel.
Solvency 3y ago
This doesn't feel brutalist at all. https://klikkentheke.com https://klikkentheke.com is a great directory of minimalist brutalist typographically driven websites. Yours feels a little like a retro hacker UI.
- neilv 3y ago
  https://klikkentheke.com/ https://klikkentheke.com/ is just a plain white page for me. Maybe it requires jQuery to render, but it's loading that from a Google domain (which I block by default). It's also running a couple third-party trackers. By not being minimal, it's it's more "minimal" than they intended.
  - yoyopa 3y ago
    that's one of the most aggravating websites i've ever seen
  - vidarh 3y ago
    To me the introductory text just covers the entire screen. If I scroll fast enough, it glitched enough that I can see the rest of the text scrolling behind some overlay.
- deleted 3y ago
  [deleted]
- bowsamic 3y ago
  The website you linked doesn’t work at all on iOS
nkrisc 3y ago
Arguably this is less brutalist than the current HN site; it has actually added ornamentation. A brutalist site would probably just use the default browser or user styles.
- dleslie 3y ago
  I whole-heartedly agree. This adds animations, hover text, and so forth. It's more kitsch than brutalist.
- aninteger 3y ago
  Kind of like a Craigslist (CSS style / layout) + HN (which actually might be pretty awesome).
- deleted 3y ago
  [deleted]
subjectsigma 3y ago
This website is not a good example of brutalism and doesn’t contain content about brutalism. It’s like if I put up a page called ‘My French Web Site’ and it hosted articles about flowers written entirely in English. Always weird when words just stop meaning things. The real shame though isn’t that the website is misnamed, it’s that it provides an objectively worse browsing experience than the original HN
- deleted 3y ago
  [deleted]
tomcatfish 3y ago
Huh, this looks very neat. I like the effect that happens briefly while you scroll.
- wkyleg 3y ago
  Thanks!
gcj 3y ago
The blinking thin can probably cause me a seizure. No joke
- deleted 3y ago
  [deleted]
- replwoacause 3y ago
  Really? I didn’t realize something like this could cause seizures. I know bright flashing lights and screens can, but a flickering image can too?
loloquwowndueo 3y ago
[flagged]
- deleted 3y ago
  [deleted]
qwerty456127 3y ago
This page even requires to enable DRM - very brutal :-)
- deleted 3y ago
  [deleted]
- wkyleg 3y ago
  This is not correct, what DRM do you believe it requires?
  - qwerty456127 3y ago
    Widevine? What else of a DRM could Firefox possibly ask about enabling after some seconds of using that website?
    - wkyleg 3y ago
      I have no idea what you're talking about. You can see all of the code in the GitHub repo, which is contained in one file. There aren't even any dependencies
diekhans 3y ago
This is awesome!!
- deleted 3y ago
  [deleted]
- wkyleg 3y ago
  Thanks!
wkyleg 3y ago
Thanks for the feedback! I'm planning a few changes pending feedback right now: - Removing the glitch navigation on the top nav bar. People seem to think it's too annoying, and I will concede it's not technically Brutalist although it only takes a few lines of CSS - Changing the default theme to one of the greyscale themes, which are easier to read and arguably more functionally brutalist, and more aligned with the aesthetics of concrete Brutalist architecture - Better handling of back button on Android devices - A color theme inspired by Windows 3.1 To address concerns about whether this design is truly brutalist I recommend first revisiting the principles of Brutalist Web Design, as well as more contemporary usages of the term. The most notable description was set forth by David Bryant Copeland (see https://brutalist-web.design https://brutalist-web.design): - Content is readable on all reasonable screens and devices. - Only hyperlinks and buttons respond to clicks. - Hyperlinks are underlined and buttons look like buttons. - The back button works as expected. - View content by scrolling. - Decoration when needed and no unrelated content. - Performance is a feature. Another common interpretation of brutalism is aesthetic, reacting to overly complicated user interfaces by creating simpler, more direct ones. Tailwind CSS (https://tailwindcss.com https://tailwindcss.com), one of today's most popular CSS libraries, promotes this approach in its component examples. There's also a neat library I've seen recently called "Neobrutalism Components" for React that I like (https://neobrutalism-components.vercel.app https://neobrutalism-components.vercel.app), providing components with a similar look and feel to Gumroad. This might more accurately be called 'Neo-Brutalism,' as noted in the comments. A more engineering-centric interpretation of Brutalism focuses on form, structure, and efficiency, drawing significantly from brutalist architecture principles. Apart from the user interface itself, most mobile, desktop, and web applications are extremely bloated and often perform worse than sites from 10 years ago did. While one HTML file might be "less brutalist" than the original HN site, it is substantially more brutalist than any HN mobile app in existence, and offers nearly identical functionality. A broader interpretation of brutalism, which could be termed 'Meta-Brutalism,' is embodied in the overall experience on this site through UX flows. Yes, in the strictest sense, the original HN site is more Brutalist in many ways, but it only shows 30 articles at a time and does not function as a PWA. For this site, the experience of reading 10 stories is arguably less brutalist, but for quickly browsing through several pages and skimming articles (which is how I read HN) it is a lot faster, and in my opinion, more Brutalist. My primary inspiration was addressing software and tool bloat in UIs rather than strictly adhering to every principle set forth by David Bryant Copeland. I don't find it convincing that this site "isn't brutalist" compared to really any other experience apart from the Main HN site, and I would argue the overall experience is more brutalist in its performance and scrolling behavior. As a side note: I generally don't like Brutalist architecture that much although I believe it is unfairly maligned. I visited the Salk Institute once and enjoyed it though (https://www.archdaily.com/61288/ad-classics-salk-institute-louis-kahn https://www.archdaily.com/61288/ad-classics-salk-institute-l...).
1ilit 3y ago
wow this is horrible, i love it
- deleted 3y ago
  [deleted]
- deleted 3y ago
  [deleted]
aaron695 3y ago
[dead]
ChrisArchitect 3y ago
Classic gen z or whatever ephemeral disdain for history and context, no past, only existing in the now. All the comments here saying this isn't "brutalist", doesn't even surpass HN's own brutalism, and yet the creator applies and mixes the descriptions and terms alongside cyberpunk etc, so that they end with no meaning at all.
- Lacerda69 3y ago
  The past is dead and the future is yet to be. All that exists is now.
  - imnotlost 3y ago
    Sure, if we all had amnesia.. but we don't so we remember and reference the past and dream of a (better?) future..
  - Y_Y 3y ago
    The present is dead, the future is just a reheat of the past. The is nothing new under the sun.
  - namaria 3y ago
    "To be ignorant of what occurred before you were born is to remain always a child" Marcus Tullius Cicero, 1st century BCE
  - vixen99 3y ago
    And I thought this was a piece of irony such that it didn't even need quotes. Silly me.
    - Lacerda69 3y ago
      I never pass up on good bait
  - YurgenJurgensen 3y ago
    Your nervous system isn't pointlike, so all your senses are from the past. The 'now' you believe in is one you can never perceive.
Climato 3y ago
[flagged]
account-5 3y ago
To my mind this it a step back from HN in two respects. One you have to enable JavaScript to view it; Two I need to worry about cloudflare insights getting hold of my data/browsing habits. I like the idea though.
- deleted 3y ago
  [deleted]
- wkyleg 3y ago
  Appreciated I took a different view in the sense I wasn’t trying to emulate the original site so much as I built a PWA that also works as mobile app and desktop app in around ~4400 lines of code
rawoke083600 3y ago
I get a strange flickering ? On the title bar, makes it impossible for me to enjoy/use to be honest
- Biganon 3y ago
  Same. I guess it's on purpose? Ugly = cool or something, I'm too old
  - wkyleg 3y ago
    I tend to agree pend a lot of testing with users to now only the logo flickers
reddalo 3y ago
To be honest, I think Hacker News is already very brutalist :)
- zadler 3y ago
  Old dos and windows interfaces were brutal af.
geon 3y ago
https://brutalist-web.design/ https://brutalist-web.design/ Some kind of manifesto.
- thih9 3y ago
  This looks like actual brutalism, it prioritizes function over the form - as opposed to the submission. I’m guessing the goal of the latter was to look like brutalist works, without caring for the UX.
  - wkyleg 3y ago
    I'm more focused on the bloat of web design and lack of free software. This site is also a PWA and can be used as a mobile or desktop app
zoobab 3y ago
A more brutal design would be news in plaintext.
- deleted 3y ago
  [deleted]
- wkyleg 3y ago
  This would be boring and also not function as a mobile/desktop app you can read the source code of
AnonHP 3y ago
I dislike the constant flickering on the top line/menu. I don’t think it adds any value since it’s quite distracting. I also dislike those (seemingly ASCII 0x80 to 0xFF) weird characters that take a noticeable while to render to the actual text. Style wise, I don’t see enough line spacing to distinguish between topics.
Kwpolska 3y ago
I never thought you could make HN substantially worse designed, but apparently, here we are.
- CalRobert 3y ago
  HN seems well designed to me, what do you mean?
  - Kwpolska 3y ago
    Small fonts, very wide lines, small and non-obvious links for actions, bright backgrounds. I use https://www.modernhn.com/ https://www.modernhn.com/ to improve HN readability.
rpgbr 3y ago
Came here expecting something like http://motherfuckingwebsite.com/ http://motherfuckingwebsite.com/ and was surprises (and almost blinded).
ttepasse 3y ago
Since everyone is debating what brutalism could mean in web design, I'd like to throw the "Prof. Dr. Style" into the debate: http://contemporary-home-computing.org/prof-dr-style/ http://contemporary-home-computing.org/prof-dr-style/
- wkyleg 3y ago
  Interesting!
hardlianotion 3y ago
why does it keep winking at me?
deleted 3y ago
[deleted]
fl0ki 3y ago
If the flickering is intentional it should come with a warning. If it's not intentional it should perhaps have been tested before being widely announced.
keepamovin 3y ago
I think there's also the understandable response that's going on: there's the idea that people who have created brutalist works in their own work, and are proud of their participation in art history as a result of that, and proud of their work's expression of those principles (say, in the particular design they've used in a piece of UI, an app, a product, has been discussed, gauged and aimed for internally to be brutalist), will feel this work "Brutalist Hacker News" challenges the pride that they have in their own brutalist works because they feel it calls into question their achievement, and the definitions they base that on. But it doesn't call it into question! It only expands the historical tapestry of what they're already a part of. It enriches it! But perhaps it enriches it in ways they don't like? That's ok. You don't have to like every work. It's not a flag you march under, but a big house. But perhaps so big as to be unmanageably incomprehensible, at a glance. So there's confusion - but where isn't there? But what can be said to be different of any encompassing human endeavour? The multitudes, highly differentiated, multi faceted. And would you really want to call yourself part of something that doesn't have that richness and that depth? Works like this, that stretch the historical tapestry, only enrich your own works that are part of the same. They don't diminish them, they only make them part of something bigger. You may not like them, but nevertheless you benefit from them. By trying to restrict the living definition of brutalism to something less, you end up only diminishing your own work. Celebrate the differences, even if you dislike them, I suppose. Tho it may be jagged little bitter and colorful pill to swallow. Hahaha! :)
- wkyleg 3y ago
  Thank you!
meatjuice 3y ago
Cool, but I want those titles to be distinguishable

101 points by wkyleg 3y ago

sph 3y ago

I feel the original HN is much more brutalist than this demo. Bold colors and saturated gradients are not at all a part of that artistic movement. "Brutalist buildings are characterised by minimalist constructions that showcase the bare building materials and structural elements over decorative design." says Wikipedia. The closest thing to this definition is the original https://motherfuckingwebsite.com/ https://motherfuckingwebsite.com/ and not one of its later variations. One day I did some contract work at Giorgio Armani's offices in Milan, and, ignorant of brutalism, I thought it was the ugliest building I've ever been in. The entire interior was naked grey concrete. The floor, walls, ceiling. Everything was grey concrete. Now I know that it was brutalist in design, and as an art style it usually is pretty ugly, bare and quite gray.

hyperorca 3y ago
I agree. On reading 'brutalist', I thought it would be grey, or purely black and white, more "concrete" and slightly depressing.
- chatmasta 3y ago
  I’ve always thought of brutalism as the ultimate “function over form.” It’s brutal in the sense that it “brutally” strips away the form until all that’s left is the function. It’s like minimalism without the vanity.
  - tmountain 3y ago
    I have been operating with the same working definition for a long time. I think the author is misusing the term.
    - mikestew 3y ago
      Might want to look it up before getting set on your definition. Sibling comment has it (mostly) right: it’s literally “raw concrete”.
      - tmountain 3y ago
        Learning moment. Thanks for the clarification.
  - unavoidable 3y ago
    Brutalism actually comes from the French word for concrete, "beton brut"; not English "brutality". https://en.wiktionary.org/wiki/Brutalism https://en.wiktionary.org/wiki/Brutalism
    - retrac 3y ago
      Unfinished concrete, specifically. I would translate "brut" as "bare" or "unrefined" here. English brutality is related to French brut, but in French it means more like crude, unrefined, raw, blunt, with no particular sense of animalistic or violent.
      - omneity 3y ago
thornewolf 3y ago
The design style is more accurately labeled "neo-brutalism", which is characterized by these bold colors. gumroad is one of the most popular examples: https://gumroad.com/ https://gumroad.com/
- vineyardmike 3y ago
  Neo-Brutalism is an accurate way to describe GumRoad's design, but not the OP. Neobrutalism adds color and bold design to brutalism, but maintains the simple focus on structure and function. NB features prominent and simple shapes to delimit UI elements and buttons, and bold and prominent typography. NB is not "Retro" nor "cyberpunk", and it doesn't add in superfluous details and decorative elements. You wouldn't use Emoji in NB when a simple bit of plaintext would do. Good for the OP for working hard to create something very fun and unique, but it is not Brutalism nor NeoBrutalism.
  - deleted 3y ago
    [deleted]
  - wkyleg 3y ago
    I was a little loose with definitions but wanted something aesthetically similar to a site like Gumroad or Tailwind in terms of Neo-brutalism Otherwise, I was more concerned with the approach to software development and bloat
deleted 3y ago
[deleted]
imp0cat 3y ago
Agreed. And I really wanted to like it. I guess the weird colors are the glitch + cyberpunk influence?
keepamovin 3y ago
This is true from the 'looking back' point of view of how the term's been used in the past, but there's currently a re-appropriation of brutalist experience re-interpreted by a younger, forward looking very creative movement producing these types of experiences that incorporate elements of glitch, retro, video-game saturated colors. You can understand it a bit by seeing how compared to modernslick web design, these creations invoke something similar to the spirit of brutalist.
- drivingmenuts 3y ago
  No, not at all. If anything, the flashy, glitchy BS seems pretty anti-brutalist. Brutalism is about functionality, pure and simple. It doesn’t have decorative elements. It’s not cool,except in temperature. It doesn’t have to be ugly, but the beauty of brutalism is minimalist, at best.
  - maxglute 3y ago
    Label is being re-appropriated, IMO doesn't make a lot of sense when it goes against core tenets. But alot of GenZ aesthetic are fun, but their naming hardly makes sense, or doesn't even try to with the iconography/typography being used. It's mostly vibes or labelling for the sake of categorization. See Frutiger Aero.
    - drivingmenuts 3y ago
      Whatever. It's fine as long as they don't get upset when we ignore their clearly misguided labeling and hand them a dictionary to look up "brutalism".
      - deleted 3y ago
        [deleted]
      - wkyleg 3y ago
        I think my definition is better and much more inline with what most users want and how open web standards actually work Pure HTML sites with no JavaScript are to archaic and web technologies have improved significantly. A better standard of comparison is current HN mobile and desktop apps, or other popular websites that use large frameworks and obscure their functionality to end users Beyond this, I made a HN reader for the way I personally browse HN with absolute minimal lines of code and maximal cross platform utility so I can use this on desktop, mobile, my iPad, etc. I really don’t care that much about adhering to pedantic definitions of brutalism and a lot more about making something that I like using
retrac 3y ago
When it works, it's not ugly but, vaguely inhuman and austere. A kind of modern Gothic, like a medieval cathedral, overwhelming with dread and awe. Perhaps unsurprisingly it's quite a popular style for modern cathedrals, as well as courthouses, etc. My hometown, Toronto, is rather infamous for its fondness of brutalism: https://www.instagram.com/torontobrutalist/ https://www.instagram.com/torontobrutalist/ I personally used to always hate it but some of it has grown on me.
- julianeon 3y ago
  It's funny that Toronto is a stronghold for brutalism, because if I had to name the most beautiful Canadian city, it would be Toronto.
- someoldgit 3y ago
  I always liked the UofT Library.
epolanski 3y ago
But that's brutalist "web design" not architecture.
wongarsu 3y ago
If somebody had asked me what design movement this was inspired by, my first answer would have been that it's an interpretation of Frutiger Aero [1] through the lens of Windows 3.1. But if you change the theme to grayscale I can kind of see the connection to brutalism. The visible div borders around every comment are bare structural elements, and the huge skeuomorphic buttons are certainly closer to brutalism than HN's UI. HN is about the UI being minimalistic and muted, out of the way to the point of being nearly invisible. Brutalism on the other hand is about a kind of in-your-face minimalism, which this version does capture in a way. 1 https://aesthetics.fandom.com/wiki/Frutiger_Aero https://aesthetics.fandom.com/wiki/Frutiger_Aero
- wkyleg 3y ago
  Yes, I am going to change the default theme to greyscale
  - keepamovin 3y ago
    Do what you want but please don't do it because they're criticizing you: https://www.youtube.com/watch?v=VtvjbmoDx-I https://www.youtube.com/watch?v=VtvjbmoDx-I

keepamovin 3y ago

I love this, this is so cool. Look at that aesthetic. The colors, gorgeous. Your GIF demo, perfect. A crazy desktop style early UI app for HN? Perfect. Thank you for making this. So cool. I would love to throw a browser in there. I have a retro page for a browser, but it's not quite done: https://browse.cloudtabs.net/roses/macintosh_system.index.html https://browse.cloudtabs.net/roses/macintosh_system.index.ht... I just checkout out your live demo at https://brutalisthackernews.com/top?storyModalIdList=39952826 https://brutalisthackernews.com/top?storyModalIdList=3995282... It's even nice and useable. I love how stuff just opens. It's crazy, it's really cool. I love how you just like "abundant windows". So cool. This is like perfect desktop. The way it works, takes me back. So cool to see HN through the prism of this ancient technology with a modern/glitchy color aesthetic twist. Love it. I hope you keep working on this :)

wkyleg 3y ago
Thanks!

zwaps 3y ago

I am confused Brutalist Web Design advocates for some simple rules which this thing doesn't seem to follow. It has more Javascript and the back button doesn't work. So, compared to this, the original Hacker News is actually Brutalist. Maybe I don't get it.

keepamovin 3y ago
This is 'technically' true for a strict/literal (antiquated? heh:)) use of the term Brutalist. However, Brutalist as a term of art is being appropriated by a new crowd of retro aesthetic creators who like pixels, old UI styles and colors and glitch. You can be generous with your interpretation by understanding, compared to modern bland slick web design, this stuff can be viewed as invoking a brutalist experience for the viewer/participant, which while differing in the letter of the previous usage, aligns in many ways with the spirit of it. Of course, art is subjective experience and perception as well. I get if you feel differently and that's interesting! I'm sure you "get it" from where you stand. And that's perfectly valid I think. :)
- drivingmenuts 3y ago
  Can you provide some other examples of artists who are “reinterpreting Brutalism”? Because it seems to me that they are completely missing the point.
- FdbkHb 3y ago
  Brutalism is about the expression of form follows function. A brutalist building is grey not because people love grey but because that's the color of naked concrete and painting over would be considered adding needless form. Now, a color must be picked when you make a website, and it doesn't have to look grey, as pixels do not have an inherent color, unlike real world materials, such as concrete, wood or metals. But if you add useless animations (that glitchy thing at the top is obnoxious) that exist solely for the purpose of looking cool and not aid with understanding the UI, you are doing the absolute opposite of brutalism: form over function. This HN 'app' is several times worse to actually use over plain HN. It's not more legible, it's distracting, it breaks the back button etc. I wouldn't call this "appropriation of brutalism" but "misunderstanding of brutalism". It is definitely not ""antiquated"" to care about usability and removing distractions.

lemonwaterlime 3y ago

HN is already brutalist. This linked site is not brutalist. This is closer to a punk aesthetic, perhaps even verging on Dadaist.

deleted 3y ago
[deleted]
nittanymount 3y ago
agreed
- deleted 3y ago
  [deleted]
- wkyleg 3y ago
  The glitches hide the fact that every story has to be loaded async just to get the title and that this is very hard to do without some degree of jank OR a performance hit from loading as many requests are on the page in parallel The fact that you think this is entirely intentional is proof that it works!
YurgenJurgensen 3y ago
Using scripting to deliberately introduce visual glitches is about as punk as buying pre-distressed jeans from Walmart.

yakshaving_jgt 3y ago

[flagged]

deleted 3y ago
[deleted]

Naac 3y ago

Neat! Unfortunately Firefox doesn't allow rendering of the post page inside the Brutalist windows. I get the following error: https://support.mozilla.org/en-US/kb/xframe-neterror-page?as=u&utm_source=inproduct https://support.mozilla.org/en-US/kb/xframe-neterror-page?as...

deleted 3y ago
[deleted]
DEADMINCE 3y ago
Works fine for me on Firefox.
icepat 3y ago
Yep, exactly why this is not brutalist web design. The site behaviour is unclear and rather frustrating to use. The breaking of the back feature is also bothersome.
wkyleg 3y ago
Some sites prohibit their content from being displayed in iframes, which his how I show them on the site. When this happens you can click the up arrow to A) open in new tab if in browser or B) open in in browser window if browsing as mobile or desktop app from PWA

snarkconjecture 3y ago

This follows fewer of the principles on the "Brutalist Web Design" link than HN does. In particular, it's slower, has less obvious links, breaks my back button, and has (imo) distracting unnecessary decoration. I would also bet it uses JavaScript for the "hyperlinks" but haven't checked.

deleted 3y ago
[deleted]
wlll 3y ago
The entire site fails to load unless you have JS enabled, so that's a fair guess.

contingencies 3y ago

I was anticipating a WebGL series of built spaces with structural properties derived from the relative comment strength, intuited subject type (from title semantics) and/or intuited per-thread social or technical properties (# links, information density, participation level, controversy level, emotionality, etc.). Perhaps arranged on a faux-street grid arranged through time and eyeballs, with the origin being "front page now".

deleted 3y ago
[deleted]

jl6 3y ago

The ultimate brutalist website is a bare Apache directory listing. Functional, raw, ugly, with the structure exposed for all to see.

deleted 3y ago
[deleted]
akaru 3y ago
That’s a perfect example.
Barrin92 3y ago
There's also this one which pops up on HN occasionally https://secretgeek.github.io/html_wysiwyg/html.html https://secretgeek.github.io/html_wysiwyg/html.html

maxglute 3y ago

Pretty cool, I'm a fan of GenZ aethestics, but holy shit do I hate their naming schemes. I know Brutalist is referencing webdesign, but some of these vibes themes are not very readable. Preloading gibberish is neat.

deleted 3y ago
[deleted]

082349872349872 3y ago

> It's messy but it's kind of fun to build with a browser the way it was originally indented, which is really more like Self, Smalltalk, LISP, although this aproach doesn't scale very well

deleted 3y ago
[deleted]

nico 3y ago

Amazing! Thank you for sharing and making it open source Would love to see a terminal/TUI version of this

wkyleg 3y ago
Thanks! This would be a bit hard to render in a terminal but a terminal browser like Lynx (https://en.wikipedia.org/wiki/Lynx_(web_browser) https://en.wikipedia.org/wiki/Lynx_(web_browser)) might work for this site

Retr0id 3y ago

The glitchy effects are cool but I'm not sure I see the connection with brutalism.

drivingmenuts 3y ago
I'm not sure I see any connection with readability.

scentoni 3y ago

[flagged]

cflewis 3y ago
[flagged]

enterexit 3y ago

It's kitchy, not brutalist.

uxcolumbo 3y ago

This might be great as an art piece, but I doubt it's something most HN users would use on a daily basis. Usability and readability first!

deleted 3y ago
[deleted]

fire_lake 3y ago

This is much less readable than classic HN, which is already plenty brutalist.

deleted 3y ago
[deleted]

MiscCompFacts 3y ago

I often use this site: https://brutalist.report https://brutalist.report to get a brutalist hacker news filter.

deleted 3y ago
[deleted]

PmTKg5d3AoKVnj0 3y ago

Perhaps it works as "brutalism" (from french: 'beton brut', Concrete) if the fundamental Concrete of the web is imagined to be different. I do not think it fits the bill as it is.

deleted 3y ago
[deleted]

akkartik 3y ago

To me this seems punk and glitch, but not brutalist. Arguably HN is already pretty brutalist. As a second exemplar, I consider https://brutaldon.org https://brutaldon.org pretty brutalist. It seems plausible that you can't be brutalist and be inaccessible without javascript enabled. It seems plausible that themes are the antithesis of brutalism. The point is to show the underlying structure. Not to add pretend structure.

toxicunderGroov 3y ago
I've always liked; https://brutalist.report/ https://brutalist.report/
- gumby 3y ago
  I don't like brutalism in buildings, but this so-called "brutalist" web site seems pretty user-friendly to me.
  - Terr_ 3y ago
    In terms of buildings, I've always had the impression but brutalism wasn't so much about being unhelpful, but more about making the users feel small and unimportant... ... Which in a weird way describes some rather snazzy websites with inconsistent content policies and Kafkaesque appeals. Since it's hidden, it's a kind of cryptobrutalism, to (perhaps unnecessarily) coin a new term.
    - wkyleg 3y ago
      Yes, I think the main text layout with Links has this effect
    - Arn_Thor 3y ago
      The “purpose” (for lack of a better word) of brutalism was never to make people feel small and unimportant—though individual architects might have had different motivations from time to time. Rather, the style is about making buildings that are true to their purpose, simple and without ornaments, and that show the materials (concrete mostly) they’re made of. This specific website we’re discussing is actually quite full of flourishes, and so not brutalist in the architectural sense.

kjs3 3y ago

[flagged]

deleted 3y ago
[deleted]

jdpigeon 3y ago

This is cool! However I think the page is not interacting with the back button functionality correctly, at least on mobile.

deleted 3y ago
[deleted]

greatNespresso 3y ago

Interesting! At the same time, HN current design already looks kind of brutalist to me, it's crisp and sharp without fluff. That's what makes it intemporal and easily readable on every devices.

deleted 3y ago
[deleted]

andrewstuart 3y ago

Too much graphics for brutalist. Probably more 1990's GeoCities vibe.

deleted 3y ago
[deleted]

MrVandemar 3y ago

Wow! It's a peach coloured blank screen! Slow news day? I'd call it minnimalist rather than brutalist. What's that? Why yes, I do browse without Javascript. HN original works fine without it.

deleted 3y ago
[deleted]
deleted 3y ago
[deleted]
wkyleg 3y ago
The is a PWA, which means it is a cross platform app that can be installed on most devices I wasn’t really interested in catering to the 0.00001% of users who disable Javascript. I like the standards of the open web and think they’re worth building on. While imperfect, there’s nothing comparable in building cross platform applications that are also secure, easy to develop for, easy to release, easily capable of being audited
- MrVandemar 3y ago
  * HTML is the standard of the open web. * It's cross platform and doesn't need to be installed on any device. * It doesn't need to be “audited”. It's secure. It's easy to develop for. It's laughably easy to release. * You weren't interested in accessibility, or people with bandwidth restrictions or connection problems, or who are just tired of the relentless firehose of shit that comes in on the “javascript” channel.

Solvency 3y ago

This doesn't feel brutalist at all. https://klikkentheke.com https://klikkentheke.com is a great directory of minimalist brutalist typographically driven websites. Yours feels a little like a retro hacker UI.

neilv 3y ago
https://klikkentheke.com/ https://klikkentheke.com/ is just a plain white page for me. Maybe it requires jQuery to render, but it's loading that from a Google domain (which I block by default). It's also running a couple third-party trackers. By not being minimal, it's it's more "minimal" than they intended.
- yoyopa 3y ago
  that's one of the most aggravating websites i've ever seen
- vidarh 3y ago
  To me the introductory text just covers the entire screen. If I scroll fast enough, it glitched enough that I can see the rest of the text scrolling behind some overlay.
deleted 3y ago
[deleted]
bowsamic 3y ago
The website you linked doesn’t work at all on iOS

nkrisc 3y ago

Arguably this is less brutalist than the current HN site; it has actually added ornamentation. A brutalist site would probably just use the default browser or user styles.

dleslie 3y ago
I whole-heartedly agree. This adds animations, hover text, and so forth. It's more kitsch than brutalist.
aninteger 3y ago
Kind of like a Craigslist (CSS style / layout) + HN (which actually might be pretty awesome).
deleted 3y ago
[deleted]

subjectsigma 3y ago

This website is not a good example of brutalism and doesn’t contain content about brutalism. It’s like if I put up a page called ‘My French Web Site’ and it hosted articles about flowers written entirely in English. Always weird when words just stop meaning things. The real shame though isn’t that the website is misnamed, it’s that it provides an objectively worse browsing experience than the original HN

deleted 3y ago
[deleted]

tomcatfish 3y ago

Huh, this looks very neat. I like the effect that happens briefly while you scroll.

wkyleg 3y ago
Thanks!

gcj 3y ago

The blinking thin can probably cause me a seizure. No joke

deleted 3y ago
[deleted]
replwoacause 3y ago
Really? I didn’t realize something like this could cause seizures. I know bright flashing lights and screens can, but a flickering image can too?

loloquwowndueo 3y ago

[flagged]

deleted 3y ago
[deleted]

qwerty456127 3y ago

This page even requires to enable DRM - very brutal :-)

deleted 3y ago
[deleted]
wkyleg 3y ago
This is not correct, what DRM do you believe it requires?
- qwerty456127 3y ago
  Widevine? What else of a DRM could Firefox possibly ask about enabling after some seconds of using that website?
  - wkyleg 3y ago
    I have no idea what you're talking about. You can see all of the code in the GitHub repo, which is contained in one file. There aren't even any dependencies

diekhans 3y ago

This is awesome!!

deleted 3y ago
[deleted]
wkyleg 3y ago
Thanks!

wkyleg 3y ago

Thanks for the feedback! I'm planning a few changes pending feedback right now: - Removing the glitch navigation on the top nav bar. People seem to think it's too annoying, and I will concede it's not technically Brutalist although it only takes a few lines of CSS - Changing the default theme to one of the greyscale themes, which are easier to read and arguably more functionally brutalist, and more aligned with the aesthetics of concrete Brutalist architecture - Better handling of back button on Android devices - A color theme inspired by Windows 3.1 To address concerns about whether this design is truly brutalist I recommend first revisiting the principles of Brutalist Web Design, as well as more contemporary usages of the term. The most notable description was set forth by David Bryant Copeland (see https://brutalist-web.design https://brutalist-web.design): - Content is readable on all reasonable screens and devices. - Only hyperlinks and buttons respond to clicks. - Hyperlinks are underlined and buttons look like buttons. - The back button works as expected. - View content by scrolling. - Decoration when needed and no unrelated content. - Performance is a feature. Another common interpretation of brutalism is aesthetic, reacting to overly complicated user interfaces by creating simpler, more direct ones. Tailwind CSS (https://tailwindcss.com https://tailwindcss.com), one of today's most popular CSS libraries, promotes this approach in its component examples. There's also a neat library I've seen recently called "Neobrutalism Components" for React that I like (https://neobrutalism-components.vercel.app https://neobrutalism-components.vercel.app), providing components with a similar look and feel to Gumroad. This might more accurately be called 'Neo-Brutalism,' as noted in the comments. A more engineering-centric interpretation of Brutalism focuses on form, structure, and efficiency, drawing significantly from brutalist architecture principles. Apart from the user interface itself, most mobile, desktop, and web applications are extremely bloated and often perform worse than sites from 10 years ago did. While one HTML file might be "less brutalist" than the original HN site, it is substantially more brutalist than any HN mobile app in existence, and offers nearly identical functionality. A broader interpretation of brutalism, which could be termed 'Meta-Brutalism,' is embodied in the overall experience on this site through UX flows. Yes, in the strictest sense, the original HN site is more Brutalist in many ways, but it only shows 30 articles at a time and does not function as a PWA. For this site, the experience of reading 10 stories is arguably less brutalist, but for quickly browsing through several pages and skimming articles (which is how I read HN) it is a lot faster, and in my opinion, more Brutalist. My primary inspiration was addressing software and tool bloat in UIs rather than strictly adhering to every principle set forth by David Bryant Copeland. I don't find it convincing that this site "isn't brutalist" compared to really any other experience apart from the Main HN site, and I would argue the overall experience is more brutalist in its performance and scrolling behavior. As a side note: I generally don't like Brutalist architecture that much although I believe it is unfairly maligned. I visited the Salk Institute once and enjoyed it though (https://www.archdaily.com/61288/ad-classics-salk-institute-louis-kahn https://www.archdaily.com/61288/ad-classics-salk-institute-l...).

1ilit 3y ago

wow this is horrible, i love it

deleted 3y ago
[deleted]
deleted 3y ago
[deleted]

aaron695 3y ago

[dead]

ChrisArchitect 3y ago

Classic gen z or whatever ephemeral disdain for history and context, no past, only existing in the now. All the comments here saying this isn't "brutalist", doesn't even surpass HN's own brutalism, and yet the creator applies and mixes the descriptions and terms alongside cyberpunk etc, so that they end with no meaning at all.

Lacerda69 3y ago
The past is dead and the future is yet to be. All that exists is now.
- imnotlost 3y ago
  Sure, if we all had amnesia.. but we don't so we remember and reference the past and dream of a (better?) future..
- Y_Y 3y ago
  The present is dead, the future is just a reheat of the past. The is nothing new under the sun.
- namaria 3y ago
  "To be ignorant of what occurred before you were born is to remain always a child" Marcus Tullius Cicero, 1st century BCE
- vixen99 3y ago
  And I thought this was a piece of irony such that it didn't even need quotes. Silly me.
  - Lacerda69 3y ago
    I never pass up on good bait
- YurgenJurgensen 3y ago
  Your nervous system isn't pointlike, so all your senses are from the past. The 'now' you believe in is one you can never perceive.

Climato 3y ago

[flagged]

account-5 3y ago

To my mind this it a step back from HN in two respects. One you have to enable JavaScript to view it; Two I need to worry about cloudflare insights getting hold of my data/browsing habits. I like the idea though.

deleted 3y ago
[deleted]
wkyleg 3y ago
Appreciated I took a different view in the sense I wasn’t trying to emulate the original site so much as I built a PWA that also works as mobile app and desktop app in around ~4400 lines of code

rawoke083600 3y ago

I get a strange flickering ? On the title bar, makes it impossible for me to enjoy/use to be honest

Biganon 3y ago
Same. I guess it's on purpose? Ugly = cool or something, I'm too old
- wkyleg 3y ago
  I tend to agree pend a lot of testing with users to now only the logo flickers

reddalo 3y ago

To be honest, I think Hacker News is already very brutalist :)

zadler 3y ago
Old dos and windows interfaces were brutal af.

geon 3y ago

https://brutalist-web.design/ https://brutalist-web.design/ Some kind of manifesto.

thih9 3y ago
This looks like actual brutalism, it prioritizes function over the form - as opposed to the submission. I’m guessing the goal of the latter was to look like brutalist works, without caring for the UX.
- wkyleg 3y ago
  I'm more focused on the bloat of web design and lack of free software. This site is also a PWA and can be used as a mobile or desktop app

zoobab 3y ago

A more brutal design would be news in plaintext.

deleted 3y ago
[deleted]
wkyleg 3y ago
This would be boring and also not function as a mobile/desktop app you can read the source code of

AnonHP 3y ago

I dislike the constant flickering on the top line/menu. I don’t think it adds any value since it’s quite distracting. I also dislike those (seemingly ASCII 0x80 to 0xFF) weird characters that take a noticeable while to render to the actual text. Style wise, I don’t see enough line spacing to distinguish between topics.

Kwpolska 3y ago

I never thought you could make HN substantially worse designed, but apparently, here we are.

CalRobert 3y ago
HN seems well designed to me, what do you mean?
- Kwpolska 3y ago
  Small fonts, very wide lines, small and non-obvious links for actions, bright backgrounds. I use https://www.modernhn.com/ https://www.modernhn.com/ to improve HN readability.

rpgbr 3y ago

Came here expecting something like http://motherfuckingwebsite.com/ http://motherfuckingwebsite.com/ and was surprises (and almost blinded).

ttepasse 3y ago

Since everyone is debating what brutalism could mean in web design, I'd like to throw the "Prof. Dr. Style" into the debate: http://contemporary-home-computing.org/prof-dr-style/ http://contemporary-home-computing.org/prof-dr-style/

wkyleg 3y ago
Interesting!

hardlianotion 3y ago

why does it keep winking at me?

deleted 3y ago

[deleted]

fl0ki 3y ago

If the flickering is intentional it should come with a warning. If it's not intentional it should perhaps have been tested before being widely announced.

keepamovin 3y ago

I think there's also the understandable response that's going on: there's the idea that people who have created brutalist works in their own work, and are proud of their participation in art history as a result of that, and proud of their work's expression of those principles (say, in the particular design they've used in a piece of UI, an app, a product, has been discussed, gauged and aimed for internally to be brutalist), will feel this work "Brutalist Hacker News" challenges the pride that they have in their own brutalist works because they feel it calls into question their achievement, and the definitions they base that on. But it doesn't call it into question! It only expands the historical tapestry of what they're already a part of. It enriches it! But perhaps it enriches it in ways they don't like? That's ok. You don't have to like every work. It's not a flag you march under, but a big house. But perhaps so big as to be unmanageably incomprehensible, at a glance. So there's confusion - but where isn't there? But what can be said to be different of any encompassing human endeavour? The multitudes, highly differentiated, multi faceted. And would you really want to call yourself part of something that doesn't have that richness and that depth? Works like this, that stretch the historical tapestry, only enrich your own works that are part of the same. They don't diminish them, they only make them part of something bigger. You may not like them, but nevertheless you benefit from them. By trying to restrict the living definition of brutalism to something less, you end up only diminishing your own work. Celebrate the differences, even if you dislike them, I suppose. Tho it may be jagged little bitter and colorful pill to swallow. Hahaha! :)

wkyleg 3y ago
Thank you!

meatjuice 3y ago

Cool, but I want those titles to be distinguishable