Hacker News Reader

Comment by czhu12 | Hacker News Reader

At least some of these are just for lack of caring. I vibe coded this landing page recently https://tui2web.com/ and fought off a lot of the defaults the LLM came up with after a few hours of iteration. Feel free to roast it, I'm not really attached, but I thought it did a reasonably good job.

View on HN

I find this style of "heavy dark borders/shadows" one of the ugliest recent trends on the web. It's rarely done well.

But otherwise the website looks pretty great. Vibe coded websites usually transmit the feeling of: "nobody even bothered to look at this", and that's not the case with yours at all.

In your lists where elements are separated by horizontal lines, I would remove the horizontal line after the last element. That's quite easy in CSS.

You could be right, I haven't seen too many like this yet, but it did some out with this staggeringly fast. The style I've seen the most are the gradients + font changes mentioned in the article.

What's interesting to me, is how it selected this heavy dark shadows brutalist style, which is a sort of stylized skeuomorphism , and then it decided to add a background different from page bg, breaking whatever illusion there was.

It's not too readable. It would benefit from a columnated layout. The fold is also too long. It should be an introductory block.

Overall, the "rhythm" is a bit off. The user should know what they're seeing even before they see it, at least conceptually. The design/layout doesn't section off dense sections from skim material. Front pages in general should be built for skimming rather than deep consumption (scanning). Scanning should appear optional visually.

There's a lot of "scan" material, but users who visit your site mostly just want to know what they're looking at - at least at first. So the deep material kinda just gets in the way of actual comprehension.

Another critique: too much visual uniformity. Every major section looks the same (poor "rhythm"). This leads the eyes to glaze over much of the site.

It sounds dumb, but our eyes don't "read" a webpage, we "see/feel" it instead. We see structure, layout, differences in colors, font sizes, patterns, bold headings, etc. We ignore the actual textual content. We only do actual reading when we're hunting for something specific (eg, a specific nav link).

The aesthetic itself is fine, but the layout and structure need work.

All caps text is a roadblock for reading speed/comprehension. Accessibility experts were finally convincing major company design standards to stop doing it when LLMs made it a default again [0] for headers and incidental text.

Not to mention that all caps text is also generally associated with shouting and just feels rude to some readers.

[0] Or more accurately trained on all the bad examples before experts started catching them and has stuck to the mistake.

This appears to be pretty close to the "brutalist" aesthetic mentioned in the article. Things like drop shadows on boxes are the opposite of the "fingernail" boxes and you very rarely saw them pre-AI. However I think your site looks fine and well crafted, nice work. (the article also said that this kind of design language is less grating)

Drop shadows on boxes were a common TUI element in the Norton Commander days.

It's been a trend for years before AI... I remember the Balenciaga website being one of the first big names doing it in like... 2018?

Right, AI had to get it from somewhere.

Yeah brutalist is exactly right, that is basically what I prompted for. I didn't realize a bunch of other people were doing this. Actually the only inspiration I had for this was watching the movie (Brutalist) a few years back.

Even before AI, brutalist style is not that popular compared to flat, glassmorphism, skeuomorphism etc. Two popular website that use brutalist that I remember is Gumroad and Figma.

I don’t know man, still looks exactly like a million vibe coded sites.

Good aesthetic, just overused.

It looks nice. I wouldn’t roast it as much as admit that I can tell from some of the content phrasing that an LLM was used. The h1 feels cliche, for example. That comma doesn’t really need to be there.

Claude gave me a similar aesthetic back in December: https://github.com/shepherdjerred/monorepo/tree/main/sandbox...

Though, as you can see, I didn't really polish it

It's a bit funny that the projects are also very similar in goals

It's fine, but if you spent hours telling it what not to do, at that point you are the one doing the designing.

I actually had momentary startle reflex when I opened that page. I don't know web design at all well but I know "design elements are [edited] supposed to be invisible". My first impression is this is the opposite of that.

> design is supposed to be invisible

I don't know who told you that but that's a terrible take. Design can have personality. Design can convey emotions. Design can give you emotions and reactions by itself.

Not everything needs to be bland like a user manual

I edited above. I didn't recall the statement correct - design elements are supposed invisible even design itself is noticeable as a feeling or personality or aesthetic. But I think in this case, what hits users is the elements - the huge text, reverse text and black box.

You might be thinking about "Good design is as little design as possible", one of the 10 principles for good design by Dieter Rams.

I don't know what that's really trying to say, but it sounds wrong. That's how we end up with contextual interfaces that randomly shift around on a whim. Disappearing elements because some mysterious criteria has not been met. Atrocious for user discovery because the designer hid everything they thought the user didn't need.

Not to be a slopologist, but did you come up with the smartphone render? Cause I kinda love it, ngl

It's like, not obviously android or iOS and retro-y

as soon as the page popped up, i got very heavy vibe coded vibes. You think you pushed back, you didn't

This has the most obvious AI slop tell of all, in my opinion… SO MUCH TEXT. Just sections and sections of header + subheader + bullet list composed of header + subheader + paragraphs.

I’m reading max 2 sentences on any landing page. Most people probably less. Having to scroll and scroll through walls of text is a clear sign of AI.

Not bad but the section numbering gives it away now. Also something cloudflare has. I don’t know if I’d call that slop though. It’s really just the stuff people don’t care about and let whatever the llm comes up with ship.

it's perfectly fine

I’m sorry but this is ugly in my eyes.

Just goes to show how large the dynamic range is re. Taste. This is junk.

Reply on news.ycombinator.com