How our vibe coded website looks like a designer made it

chmod775

Answer: because a human designed it in an iterative process. LLMs just wrote the code.

ananmays

A designer did make it! The process you undertook is called design!

uncivilized

Yes, if the designer was named Claude or Astra, then it does indeed look like that designer created it.

thefourthchime

I love this because, it reminds me that when people hate AI, They hate low effort AI slop. This website demonstrates a tremendous amount of human effort, and it walks through the iterative design process that led to the final result. Taking inspiration, trying out ideas, tinkering—that's design.

slopinthebag

So because of the article's premise, I'm going to be a bit of a dickhead. I hope nobody takes this the wrong way, because it's not a judgement on the developers. I have also shipped way worse vibecoded frontends and this is coming from a UI guy, so it's not about being an AI hater or anything. Your site looks like an AI made it. Now there is an actually easy fix: just replace the glass panels and tabs with something that actually fits the rest of the aesthetic. And then I could buy that it was human-designed, at which point, it basically was. And just AI-coded. Otherwise it's quite cool, and well done.

fiatpandas

OP, you accidentally invented the design process that they teach in design school. You can officially call yourself a designer. 1) have a high level functional goal 2) be inspired and think of a motif 3) go wide within that motif and explore 4) narrow in on a single direction and iterate 5) fine tune the details until you are creatively satisfied and the design meets your goals from step 1.

bardackx

it feels vibecoded though, it still has LLMisms

jjcm

It looks like a lot of their early attemps are early gpt outputs or claude design outputs, which have a lot of the same smell. People are discounting how good image->html flows are these days though. I had gemini describe this webpage as prompts, then fed it into an image -> code pipeline. Note that this is with 0 input from me: https://html.non.io/railcode-animated This is with Opus 5.5 building it out on low effort, and yes the spec was already made from the original site, but 0->1 that doesn't result in purple gradients or claude brown is very much possible now.

quicklywilliam

Best tip in here: when tweaking details like colors and fonts, just ask Claude to make you throwaway picker tools right in the site. This is totally obvious in retrospect but I never thought of it (probably because of 25 years of thinking about tools in terms of reusable components). Thanks for writing!

an0malous

This is the kind of creative work that I think will always need to be guided by human taste and vision but can be vastly enabled by AI. I really hope to see more people using AI to improve quality instead of velocity.

queenkjuul

Cute but why are the people on the coaster standing and why are there people standing on the tracks

lofaszvanitt

a dime a dozen

assimpleaspossi

26 info warnings though I'm impressed there are no up front errors but the warnings are of potential problems. It's the same blunder I see many people who don't read the standards don't understand or bother with until it actually becomes a problem. But AI learned from them. That's why the problem exists within AI, too. https://validator.w3.org/nu/?doc=https%3A%2F%2Frailcode.dev%...

cush

Turns out you you just need taste and the time to iterate

blt

Oof, an unbanked turn right after the first drop. Claude must be a big fan of lateral g's.

Wazzymandias

this is awkward - the site definitely still looks vibe coded / LLMs helped make it

shikck200

Looking at the source i was not surprised. A shell html page, that uses a shittonne of javascript, and obviously does not even include the static content per page load. Its sad that this is the status quo of the AI slop you see.

Zaraif13

You're proving that even with all the tools at our disposal now, taste really does matter. I love your website! Even when building with AI, I find it very useful to be picky about the details. Sometimes picky enough to go down to the code. I feel like people who get the most out of AI tools are the ones who actually use it as a tool, and don't treat AI as the decision maker.

tjansen

I had a similar experience with my landing page for downread.com. I don't know whether the design looks vibe-coded, but I don't think anyone would put that much effort into a hand-coded homepage: the landing page (as well as the feature page) uses interactive, partially animated 'screenshots' that simulate aspects of the app. All buttons either do something or open a pop-up explaining what the button does.