‹ BackHN Continuity

Thread

How our vibe coded website looks like a designer made it

137 points · 77 comments · yakkomajuri

  1. jjcm · · focus · HN ↗
    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:

    <a href="https:&#x2F;&#x2F;html.non.io&#x2F;railcode-animated" rel="nofollow">https:&#x2F;&#x2F;html.non.io&#x2F;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-&gt;1 that doesn&#x27;t result in purple gradients or claude brown is very much possible now.

    1. zeroonetwothree · · focus · HN ↗
      Honestly looks better than the original
      1. seizethecheese · · focus · HN ↗
        Disagree, the colors are harsh
        1. queenkjuul · · focus · HN ↗
          The green is too bright but the animations are way better
          1. spoiler · · focus · HN ↗
            The animation is more dense and busy. Not sure I&#x27;d qualify it as better necessarily.

            But this thread is a bit like the &quot;I could have drawn that&quot; comment you hear from Average Joe saying about a Mondrian painting. Yes, you can mimic something (with or without AI) but you wouldn&#x27;t have made _this_.

            Don&#x27;t get me wrong the 0-&gt;1 copycat site is impressive, but it lacks a lot of attention to detail the original has.

            The art and engineer snob voice in me is also causing a bit of cognitive dissonance about this though. C&#x27;est la vie, funny times we live in

            1. queenkjuul · · focus · HN ↗
              The original animation has people being run over by the roller coaster train... And this one&#x27;s movement attempts to approximate real physics, the original doesn&#x27;t. It was a lack of attention to detail in the original animations that stood out the most to me...
              1. spoiler · · focus · HN ↗
                Ah, I meant the site design as a whole when I talked about attention to detail, not the animation specifically

                As for the animations...

                The second animation is a bit more... High fidelity in some areas? I don&#x27;t know what to even call it. The clash of different pixel art styles is what I find jarring[^1].

                But I guess my point was that neither animation is even _good_... Like both of them barely pass a cursory glance; there&#x27;s lot of nonsense going on in both of them, that wouldn&#x27;t get past any animator. So, I wouldn&#x27;t say one is better or worse; they just different

                [^1]: Edit for context, I used and even made _a lot_ of pixel art in primary school and my teens lol

Open on Hacker News to reply ↗

Unofficial Hacker News client; not affiliated with Y Combinator.