17 ms·
I failed to recreate the 1996 Space Jam website with Claude
- stwsk 10mo ago>Look, I still need this Space Jam website recreated. Now that's a novel sentence if I've ever read one.
- yieldcrv 10mo agoSkill issue
- deleted 10mo ago[deleted]
- stonecharioteer 10mo agoI'm curious. Did you ask it to use tables and no CSS? In 1996, We had only css1. Ask it to use tables to do this, perhaps.
- lagniappe 10mo agoWe actually had a myriad of competing specs. CSS proper wasn't released until december 1996.
- thecr0w 10mo agoAny names for the competing specs? Maybe i could try re-prompting with that direction.
- lagniappe 10mo agoModels are trained with content scraped from the net, for the most part. The availability of content pertaining to those specs is almost nil, and of no SEO value. Ergo, models for the most part will only have a cursory knowledge of a spec that your browser will never be able to parse because that isn't the spec that won. Nonetheless, here is a link to a list of the specs you asked for: https://www.w3.org/Style/History/Overview.en.html https://www.w3.org/Style/History/Overview.en.html
- boie0025 10mo agoThanks for sharing that. I read through a lot of this. Interesting to read those perspectives in the context of today.
- lagniappe 10mo agoMuch obliged. Have a good weekend. Your new gray hairs are en route :)
- mxfh 10mo agoAlmost nil? Websites that started before 2000 tend to stick around and comparably quite well archived. What has model training to do with SEO, that's outright detrimental to it for the most part. This is the spec it can guarantee you that's in every large language model thats actually large. https://www.rfc-editor.org/rfc/rfc1866 https://www.rfc-editor.org/rfc/rfc1866 https://www.w3.org/TR/2018/SPSD-html32-20180315/ https://www.w3.org/TR/2018/SPSD-html32-20180315/ Why even bring up CSS this was before that. You can just also learn with the knowledge of 1996 Selfhtml exits it pretty easy to limit the scope of authoring language to a given HTML version and target browser. Your LLM should have no problem with german. https://wiki.selfhtml.org/wiki/Museum https://wiki.selfhtml.org/wiki/Museum some other docs: https://rauterberg.employee.id.tue.nl/publications/WWW-Design.pdf https://rauterberg.employee.id.tue.nl/publications/WWW-Desig... Just spec the year and target browser and target standard and you will get something better than just asking for visual accuracy. The OG prompt is simply poor and loose: "Your job is to recreate the landing page as faithfully as possible, matching the screenshot exactly."
- wanderingstan 10mo agoThere were specs competing for adoption, but only tables (the old way) and CSS were actually adopted by browsers. So no point trying to use some other positioning technique.
- thecr0w 10mo agoYes yes great question! I tried your suggestion and also tried giving it various more general versions of the limitations presented by earlier generations. Claude's instinct initially was actually to limit itself to less modern web standards. Unfortunately, nothing got those planets to be in the right place.
- Wowfunhappy 10mo agoClaude is not very good at using screenshots. The model may technically be multi-modal, but its strength is clearly in reading text. I'm not surprised it failed here.
- fnordpiglet 10mo agoEspecially since it decomposes the image into a semantic vector space rather than the actual grid of pixels. Once the image is transformed into patch embeddings all sense of pixels is entirely destroyed. The author demonstrates a profound lack of understanding for how multimodal LLMs function that a simple query of one would elucidate immediately. The right way to handle this is not to build it grids and whatnot, which all get blown away by the embedding encoding but to instruct it to build image processing tools of its own and to mandate their use in constructing the coordinates required and computing the eccentricity of the pattern etc in code and language space. Doing it this way you can even get it to write assertive tests comparing the original layout to the final among various image processing metrics. This would assuredly work better, take far less time, be more stable on iteration, and fits neatly into how a multimodal agentic programming tool actually functions.
- mcbuilder 10mo agoYeah, this is exactly what I was thinking. LLMs don't have precise geometrical reasoning from images. Having an intuition of how the models work is actually.a defining skill in "prompt engineering"
- thecr0w 10mo agoYeah, still trying to build my intuition. Experiments/investigations like this help me. Any other blogs or experiments you'd suggest?
- fnordpiglet 10mo agoAsking your favorite LLM actually helps a lot. They generally are well trained on LLM papers unsurprisingly. In this case though it’s important to realize the LLM is incapable of seeing or hearing or reading. Everything has to be transformed into a vector space. Images are generally cut into patches (like 16x16) which are themselves transformed by several neural networks to convert them into a semantic space represented by the models parameters. But this isn’t hugely different than your vision. You don’t see the pixel grid either. You have to use tools to measure things. You have the ability over time to iteratively interact with the image by perhaps counting grid lines but the LLM does not - it’s a one shot inference against this highly transformed image. They’ve gotten better at complex visual tasks including types of counting, but it’s not able to examine the image in any analytical way or even in its original representation. It’s just not possible. It can however make tools that can. It’s very good at working with PIL and other image processing libraries or even writing image processing code de novo, and then using those to ground itself. Likewise it can not do math, but it can write a calculator that can do highly complex mathematics on its behalf.
- throwaway314155 10mo agoSomehow I suspect Claude Code (in an interactive session with trial, error, probing, critiquing, perusing, and all the other benefits you get) would do better. This example seems to assume Claude can do things in "one shot" (even the later attempts all seem to conceal information like it's a homework assignment). That's not how to successfully use LLM's for coding in my experience. It is however perhaps a good demonstration of Claude's poor spatial reasoning skills. Another good demonstration of this is the twitch.tv/ClaudePlaysPokemon where Claude has been failing to beat pokemon for months now.
- thecr0w 10mo agoNot a homework assignment, and no deliberate attempt to conceal information, just very long and repetitive logs. A lot of the same "insights" so I just didn't provide them here. > That's not how to successfully use LLM's for coding in my experience. Yeah agree. I think I was just a little surprised it couldn't one-shot given the simplicity.
- CharlesW 10mo agoUsing https://github.com/anthropics/claude-code/tree/main/plugins/frontend-design https://github.com/anthropics/claude-code/tree/main/plugins/... with style-supporting instructions and context would've improved the outcome as well.
- thecr0w 10mo agothank you! I'll try this
- aidos 10mo agoIs the skill effectively just adding a little extra context here though? Doesn’t strike me as the sort of context that would improve the outcome. https://github.com/anthropics/claude-code/blob/main/plugins/frontend-design/skills/frontend-design/SKILL.md https://github.com/anthropics/claude-code/blob/main/plugins/...
- 999900000999 10mo agoSpace Jam website design as an LLM benchmark. This article is a bit negative. Claude gets close , it just can't get the order right which is something OP can manually fix. I prefer GitHub Copilot because it's cheaper and integrates with GitHub directly. I'll have times where it'll get it right, and times when I have to try 3 or 4 times.
- thecr0w 10mo agoya, this is true. Another commenter also pointed out that my intention was to one-shot. I didn't really go too deeply into trying to try multiple iterations. This is also fairly contrived, you know? It's not a realistic limitation to rebuild HTML from a screenshot because of course if I have the website loaded I can just download the HTML.
- Retric 10mo agoIt’s not unrealistic to want to revert to an early version of something you only have a screenshot of.
- swatcoder 10mo ago> rebuild HTML from a screenshot ??? This is precisely the workflow when a traditional graphic designer mocks up a web/app design, which still happens all the time. They sketch a design in something like Photoshop or Illustrator, because they're fluent in these tools and many have been using them for decades, and somebody else is tasked with figuring out how to slice and encode that design in the target interactive tech (HTML+CSS, SwiftUI, QT, etc). Large companies, design agencies, and consultancies with tech-first design teams have a different workflow, because they intentionally staff graphic designers with a tighter specialization/preparedness, but that's a much smaller share of the web and software development space than you may think. There's nothing contrived at all about this test and it's a really great demonstration of how tools like Claude don't take naturally to this important task yet.
- thecr0w 10mo agoYou know, you're totally right and I didn't even think about that.
- supern0va 10mo agoHonestly, if you had showed this article to me even eighteen months ago, I would have been blown away at how good of a job Claude did. It's remarkable how high our expectations have been steadily creeping.
- WhyOhWhyQ 10mo agoThis comment is missing the point. The real goal of all this is not to amaze. It's to create better software. Let's graduate past the amazement phase into the realism phase as soon as possible. What parts of my project is the LLM for? That is the real question worth asking.
- supern0va 10mo agoOh, to be clear, this isn't a criticism. I think it's super cool that we're moving onto the nitpick/refinement phase of this tech. :)
- dreadnip 10mo agoWhy involve an LLM in this? Just download the site?
- deleted 10mo ago[deleted]
- ChrisArchitect 10mo agoYeah, Internet Archive has lots of copies https://web.archive.org/web/20250000000000*/https://www.spacejam.com/1996/ https://web.archive.org/web/20250000000000*/https://www.spac... also What's with the panicked pleas and need to preserve the site, assuming locally...?
- GeoAtreides 10mo agoThe post is clearly about something else than preserving https://www.spacejam.com/1996/ https://www.spacejam.com/1996/ It seems to me the post is about how Claude fails to recreate a very simple website from 1996.
- sigseg1v 10mo agoCurious if you've tested something such as: - "First, calculate the orbital radius. To do this accurately, measure the average diameter of each planet, p, and the average distance from the center of the image to the outer edge of the planets, x, and calculate the orbital radius r = x - p" - "Next, write a unit test script that we will run that reads the rendered page and confirms that each planet is on the orbital radius. If a planet is not, output the difference you must shift it by to make the test pass. Use this feedback until all planets are perfectly aligned."
- turnsout 10mo agoYes, this is a key step when working with an agent—if they're able to check their work, they can iterate pretty quickly. If you're in the loop, something is wrong. That said, I love this project. haha
- monsieurbanana 10mo agoI'm trying to understand why this comment got downvoted. My best guess is that "if you're in the loop, something is wrong" is interpreted as there should be no human involvement at all. The loop here, imo, refers to the feedback loop. And it's true that ideally there should be no human involvement there. A tight feedback loop is as important for llms as it is for humans. The more automated you make it, the better.
- turnsout 10mo agoYes, maybe I goofed on the phrasing. If you're in the feedback loop, something is wrong. Obviously a human should be "in the loop" in the sense that they're aware of and reviewing what the agent is doing.
- Aurornis 10mo agoThis is my experience with using LLMs for complex tasks: If you're lucky they'll figure it out from a simple description, but to get most things done the way you expect requires a lot of explicit direction, test creation, iteration, and tokens. One of the keys to being productive with LLMs is learning how to recognize when it's going to take much more effort to babysit the LLM into getting the right result as opposed to simply doing the work yourself.
- zitterbewegung 10mo agoIn actual workflows someone would accept a very close reproduction and fix the small issues. Generally I use systems to get close enough to a scaffolding and / or make small incremental improvements and direct its design
- micromacrofoot 10mo agoI wouldn't call it entirely defeated, it got maybe 90% of the way there. Before LLMs you couldn't get 50% of the way there in an automated way. > What he produces I feel like personifying LLMs more than they currently are is a mistake people make (though humans always do this), they're not entities, they don't know anything. If you treat them too human you might eventually fool yourself a little too much.
- deleted 10mo ago[deleted]
- thecr0w 10mo agoAs a couple other comments pointed out, it's also not fair to judge Claude based on a one shot like this. I sort of assume these limitations will remain even if we went back and forth but to be fair, I didn't try that more than a few times in this investigation. Maybe on try three it totally nails it.
- micromacrofoot 10mo agoVery true, I would also caution this with test projects with real humans in the hiring process. Comparing one-shots from actual people is unfair too, and often the most valid assessment comes with giving them feedback and seeing how they respond to it. Aside from that point: if you are reading this and making people do a project as part of the hiring process, you should absolutely be paying them for their time (even a token amount).
- bdcravens 10mo agoA comparison would Codex would be good. I haven't done it with Codex, but when working through problems using ChatGPT, it does a great job when given screenshots.
- daemonologist 10mo agoInteresting - these models are all trained to do pixel-level(ish) measurement now, for bounding boxes and such. I wonder if you could railroad it into being accurate with the right prompt.
- Lerc 10mo agoWhat models are good at this? I have tried passing images to models and asking them for coordinates for specific features, then overlaid dots on those points and passed that image back to the model so it has a perception of how far out it was. It had a tendency to be consistently off by a fixed amount without getting closer. I don't doubt that it is possible eventually, but I haven't had much luck. Something that seemed to assist was drawing a multi coloured transparent chequerboard, if the AI knows the position of the grid colours it can pick out some relative information from the grid.
- daemonologist 10mo agoI've found Qwen3-VL to be fairly accurate at detection (though it doesn't always catch every instance). Note that it gives answers as per-mille-ages, as if the image was 1000x1000 regardless of actual resolution or aspect ratio. I have also not had luck with any kind of iterative/guess-and-check approach. I assume the models are all trained to one-shot this kind of thing and struggle to generalize to what are effectively relative measurements.
- ryoshu 10mo agoI can't do that either without opening up an image editing tool. Give the model a tool and goal with "vision". Should work better.
- sdenton4 10mo agoFeels like the "right" approach would be to have it write some code to measure how far off the elements are in the original vs recreated image, and then iterate using the numerical output of the program...
- koreanguy 10mo ago[dead]
- johncoatesdev 10mo agoYou last-minute cancelled coffee with your friends to work on this? I'm not sure how I would feel if a friend did that to me.
- deleted 10mo ago[deleted]
- fishtoaster 10mo agoBased on the later life updates, I suspect this was being humorous. > After these zoom attempts, I didn't have any new moves left. I was being evicted. The bank repo'd my car. So I wrapped it there.
- syassami 10mo agoWe've lost the capability to build such marvels. https://knowyourmeme.com/memes/my-father-in-law-is-a-builder-we-cant-we-dont-know-how-to-do-it https://knowyourmeme.com/memes/my-father-in-law-is-a-builder...
- barfoure 10mo agoLost it at wooden structures at the playground.
- a-dub 10mo agomaybe ask it to use 1990s table based layout approaches?
- al_borland 10mo agoInteresting. I just looked at the page source and it is in fact using a table layout. I always assumed it was an image map, which I assume would be even more obscure for the LLM.
- thecr0w 10mo agoWe should check the Wayback Machine, but in my memory this was built with an image map. Maybe like, 10 years ago or something. I was googling around when writing this post and saw that there are folks still tasked with making sure it's up and running. I wonder if they migrated it to tables at some point in the last decade.
- sitharus 10mo agoThe January 1997 version used a server-side image map served via CGI: https://web.archive.org/web/19970124032137/http://spacejam.com/index.cgi https://web.archive.org/web/19970124032137/http://spacejam.c... This was soon moved to a static table layout with higher quality images: https://web.archive.org/web/19970412180040/http://www.spacejam.com/jam.htm https://web.archive.org/web/19970412180040/http://www.spacej...
- smoghat 10mo agoOk, so here is an interesting case where Claude was almost good enough, but not quite. But I’ve been amusing myself by taking abandoned Mac OS programs from 20 years ago that I find on GitHub and bringing them up to date to work on Apple silicon. For example, jpegview, which was a very fast and simple slideshow viewer. It took about three iterations with Claude code before I had it working. Then it was time to fix some problems, add some features like playing videos, a new layout, and so on. I may be the only person in the world left who wants this app, but well, that was fine for a day long project that cooked in a window with some prompts from me while I did other stuff. I’ll probably tackle scantailor advanced next to clean up some terrible book scans. Again, I have real things to do with my time, but each of these mini projects just requires me to have a browser window open to a Claude code instance while I work on more attention demanding tasks.
- egeozcan 10mo agoSide note: As a person who started using a mac since march, I found phoenix slides really good.
- smoghat 10mo agoIt is! I was really just curious if I could update this old codebase without getting my hands dirty.
- skrebbel 10mo ago> Ok, so here is an interesting case where Claude was almost good enough, but not quite. You say that as if that’s uncommon.
- jonplackett 10mo agoThis should be the strap line for all AI (so far)
- smoghat 10mo agoThat's fair. But I always think of it as an intern I am paying $20 a month for or $200 a month. I would be kind of shocked if they could do everything as well as I'd hoped for that price point. It's fascinating for me and worth the money. I am lucky that I don't depend on this for work at a corporation. I'd be pulling my hair out if some boss said "You are going to be doing 8 times as much work using our corporate AI from now on."
- deleted 10mo ago[deleted]
- pluc 10mo agoI like how the author calls a script on the internet "him".
- thecr0w 10mo agolol
- NooneAtAll3 10mo agobetter than using a plural for a single entity
- shwaj 10mo ago“it”
- lillesvin 10mo agoCome on, just stop. "They" have been used to refer to singular antecedents since the 14th century. (Source: https://www.oed.com/discover/a-brief-history-of-singular-they https://www.oed.com/discover/a-brief-history-of-singular-the...)
- ga_to 10mo agoTo each their own.
- inquirerGeneral 10mo ago[dead]
- docheinestages 10mo ago> Note: please help, because I'd like to preserve this website forever and there's no other way to do it besides getting Claude to recreate it from a screenshot. Why not use wget to mirror the website? Unless you're being sarcastic. $ wget --mirror --convert-links --adjust-extension --page-requisites --no-parent http://example.org http://example.org Source: https://superuser.com/questions/970323/using-wget-to-copy-website-with-proper-layout-for-offline-browsing https://superuser.com/questions/970323/using-wget-to-copy-we...
- thecr0w 10mo agoThe stuff about not being able to download it is a bit of a joke and I don't think the tone landed with everybody haha. This was just an experiment to see if Claude could recreate a simple website from a screenshot, of course to your point you could download it if you wanted.
- malfist 10mo agoBecause that wasn't the goal of this exercise
- 486sx33 10mo ago[dead]
- hestefisk 10mo agoWould be interesting to see whether Gemini could crack this problem.
- th0ma5 10mo agoI personally don't understand why asking these things to do things we know they can't do is supposed to be productive. Maybe for getting around restrictions or fuzzing... I don't see it as an effective benchmark unless it can link directly to the ways the models are being improved, but, to look at random results that sometimes are valid and think more iterations of randomness will eventually give way to control is a maddening perspective to me, but perhaps I need better language to describe this.
- thecr0w 10mo agoI think this is a reasonable take. I think for me, I like to investigate limitations like this in order to understand where the boundaries are. Claude isn't impossibly bad at analyzing images. It's just pixel perfect corrections that seem to be a limitation. Maybe for some folks it's enough to just read that but for me, I like to feel like I have some good experiential knowledge about the limitations that I can keep in my brain and apply appropriately in the future.
- th0ma5 10mo agoYes but follow this forward, what about current models would be informative about future models. We've seen waves of "insight" come and go, to the point where there are endless waves of people at different points in the journey, there's a cohort of people that would be upset at the statement that prompt engineering is useless, and others that would support that as exactly right, and still more that would have a redefinition of the word prompt to include many other things. This is my exact complaint. You would want it work like how you want it to work, that our collective discoveries will turn into education and learning, but the content in the models and the subsequent inference based on that information have all not behaved like the physical sciences with regards to discoveries providing universal and reliable knowledge.
- iwontberude 10mo agoApropos given Warner Brothers Discovery just sold to Netflix
- soared 10mo agoI got quite close with Gemini 3 pro in AI studio. I uploaded a screenshot (no assets) and the results were similar to OP. It failed to follow my fix initially but I told it to follow my directions (lol) and it came quite close (though portrait mode distorted it, landscape was close to perfect. “Reference the original uploaded image. Between each image in the clock face, create lines to each other image. Measure each line. Now follow that same process on the app we’ve created, and adjust the locations of each image until all measurements align exactly.” https://aistudio.google.com/app/prompts?state=%7B%22ids%22:%5B%221O7xgsnQ5l96m1a61WhT90RE00rvj_aMt%22%5D,%22action%22:%22open%22,%22userId%22:%22110467242301970218864%22,%22resourceKeys%22:%7B%7D%7D&usp=sharing https://aistudio.google.com/app/prompts?state=%7B%22ids%22:%...
- jacobsenscott 10mo ago> here's no other way to do it besides getting Claude to recreate it from a screenshot And > I'm an engineering manager I can't tell if this is an intentional or unintentional satire of the current state of AI mandates from management.
- thecr0w 10mo agolololol
- dmd 10mo agoi can’t tell if your comment is satire or not
- chilmers 10mo agoYou really can’t tell? Perhaps the bar for AGI is lower than I thought.
- master_crab 10mo agoHonest question: does he know about F5? Or was it intentional to use screenshots when source is available?
- Mashimo 10mo agoWhat is F5? Beside refresh in the browser?
- thuttinger 10mo agoClaude/LLMs in general are still pretty bad at the intricate details of layouts and visual things. There are a lot of problems that are easy to get right for a junior web dev but impossible for an LLM. On the other hand, I was able to write a C program that added gamma color profile support to linux compositors that don't support it (in my case Hyprland) within a few minutes! A - for me - seemingly hard task, which would have taken me at least a day or more if I didn't let Claude write the code. With one prompt Claude generated C code that compiled on first try that: - Read an .icc file from disk - parsed the file and extracted the VCGT (video card gamma table) - wrote the VCGT to the video card for a specified display via amdgpu driver APIs The only thing I had to fix was the ICC parsing, where it would parse header strings in the wrong byte-order (they are big-endian).
- littlecranky67 10mo ago> Claude/LLMs in general are still pretty bad at the intricate details of layouts and visual things Because the rendered output (pixels, not HTML/CSS) is not fed as data in the training. You will find tons of UI snippets and questions, but they rarely included screenshots. And if they do, the are not scraped.
- Wowfunhappy 10mo agoInteresting thought. I wonder if Anthropic et al could include some sort of render-html-to-screenshot as part of the training routine, such that the rendered output would get included as training data.
- KaiserPro 10mo agothats basically a VLM, but the problem is that describing the world requires a better understanding of the world. Hence why LeCunn is talking about world models (Its also cutting edge for teaching robots to manipulate and plan manipulations)
- btown 10mo agoEven better, a tool that can tell the rendered bounding box of any set of elements, and what the distances between pairs of elements are, so it can make adjustments if relative positioning doesn't match its expectation. This would be incredible for SVG generation for diagrams, too.
- pfix 10mo agoI checked the source of the original (like maybe many of you) to check how they actually did it and it was... simpler than expected. I drilled myself so hard to forget tables as layout... And here it is. So simple it's a marvel.
- COAGULOPATH 10mo agoAnd they do hacky things like space elements vertically using <br> tags.
- fortyseven 10mo agoLook at that stupid dog. It's reading a book, but it's really trashy YA. It's not even Shakespeare. Dogs are stupid.
- vmg12 10mo agoWe don't know how to build it anymore
- nickdothutton 10mo agoI have recently been working on something "fun" in the terminal that mingles plain ASCII, ANSI "graphics", actual bitmaps (Sixel), and Nerdfonts in a TUI framework (Charm etc). After a week of smashing Claude's head against a wall, which is better than smashing my own, I've had to significantly alter my hopes and expectations.
- isoprophlex 10mo agoI have a very weird tangential nit to pick: gendering LLMs. I swear I'm not pushing any sort of gender agenda/discussion that can be had anytime anywhere else in the current age, but to me there is something quintessentially a-gendered about the output of a computer program. Calling Claude (or GPT-5 or Gemini or my bash terminal for that matter) a "he" seems absurd to the point of hilarity. In my mind, they've always firmly been "it"s.
- bojan 10mo agoThis felt quirky to me as well, possibly because my native language is strictly gendered.
- DocTomoe 10mo agoHm, Claude is a common male surname, especially in Europe. That plays into it. Also many people - including me - have personalised their AI chats, have given it names, even something resembling a personality (it's easy with prefix prompts). Why others do it, who knows, I do it because I find it a lot less frustrating when ChatGPT fucks up when it pretends to be a young adult female klutz.
- fragmede 10mo agoSounds like the setup for a sexist comedian's routine. "Y'know, ChatGPT is totally a woman because she reminds me of my wife. She thinks it knows everything and is convinced she's right, when she's totally full of shit! And what's the deal with airline food?" Swap the gender depending on your target audience. In other languages, chairs have a gender, along with other everyday items like scissors and it doesn't especially make logical sense, although you can squint and tell a story as why something is the gender that's been assigned. Thus making the gender of AI simply a matter"that's just how things are".
- retsibsi 10mo agoDoes it happen much with non-Claude models? If someone genders ChatGPT, it makes me worry that they're taking the character it's playing too literally. But if someone genders Claude, that seems pretty normal, given that it has a man's name.
- johnfn 10mo agoContext is king. The problem is that you are the one currently telling Claude how close it is and what to do next. But if you give it the tools to do that itself, it will make a world of difference. Give Claude a way to iteratively poke at what it created (such as a playwright harness), and screenshot of what you want, and maybe a way to take a screenshot in Playwright and I think you will get much closer. You might even be able to one shot it. I’ve always wondered what would happen if I gave it a screenshot and told it to iterate until the Playwright screenshot matched the mock screenshot, pixel perfect. I imagine it would go nuts, but after a few hours I think it would likely get it. (Either that or minor font discrepancies and rounding errors would cause it to give up…)
- alexandre_m 10mo agoThe key is always feedback loop. If you give the AI the ability to verify itself, then it's able to iterate faster. Sure, it may take many iterations, but at least the iteration spans will be shorter than waiting for a human to validate each time. I'd be curious to see how Antigravity compares for the same task with its automatic browser agentic validation logic.
- sqircles 10mo ago> The Space Jam website is simple: a single HTML page, absolute positioning for every element... Absolute positioning wasn't available until CSS2 in 1998. This is just a table with crafty use of align, valign, colspan, and rowspan.
- DocTomoe 10mo agoWhich would also render differently on every machine, based on browser settings, screen sizes, and available fonts. Like the web was meant to be. An interpreted hypertext format, not a pixel-perfect brochure for marketing execs.
- jeanlucas 10mo ago>Like the web was meant to be. what?
- DocTomoe 10mo agoDo you not remember the good old days when people who focussed on graphics design rather than content put 'Best used with Netscape/IE5.5' on their pages?
- alternatex 10mo agoPresumably written by a person who wasn't a web developer back then or were developing solely for Internet Explorer.
- masswerk 10mo agoHum, table cells provide the max-width and images a min-with, heights are absolute (with table cells spilling over, as with CCS "overflow-y: visible"), aligns and maybe HSPACE and VSPACE attributes do the rest. As long as images heights exceed the effective line-height and there's no visible text, this should render pixel perfect on any browser then in use. In this case, there's also an absolute width set for the entire table, adding further constraints. Table layouts can be elastic, with constraints or without, but this one should be pretty stable. (Fun fact, the most amazing layout foot-guns, then: Effective font sizes and line-heights are subject to platform and configuration (e.g., Win vs Mac); Netscape does paragraph spacing at 1.2em, IE at 1em (if this matters, prefer `<br>` over paragraphs); frames dimensions in Netscape are always calculated as integer percentages of window dimensions, even if you provide absolute dimensions in pixels, while IE does what it says on the tin (a rare example), so they will be the same only by chance and effective rounding errors. And, of course, screen gamma is different on Win and Mac, so your colors will always be messed up – aim for a happy medium.)
- shortformblog 10mo agoClaude can't properly count the number of characters in a sentence. It's asking a lot to assume it can get pixel perfect.
- hu3 10mo agoLLMs can, for example, write a script to calculate all permutations of the levenshtein distances between words in a sentence and deliver it before the average programmer even understands what this means. Trivialy. You're just holding it wrong if you're asking it to simply count the characters in a sentence.
- simonw 10mo agoI wonder if Gemini 3 Pro would do better at this particular test? They're very proud of its spatial awareness and vision abilities.
- music4airports 10mo ago>They're very proud of its spatial awareness and vision abilities. Suuuuuuuuure they are. I haven't found a single multimodal model, vision LLM, or any model at all that can segment and extract music charts/infographics. Can Gemini 3 Pro, in one shot, turn charts like these into lists of "artist - album" without choking on the visuals? https://reddit.com/r/citypop/comments/10fu1t5/city_pop_albums_infographic_a_guide_for_getting/ https://reddit.com/r/citypop/comments/10fu1t5/city_pop_album... https://reddit.com/r/indieheads/comments/173o33z/the_new_indieheads_essential_chart_version_40/ https://reddit.com/r/indieheads/comments/173o33z/the_new_ind...
- simonw 10mo agoMight work if you set media resolution to high: https://ai.google.dev/gemini-api/docs/media-resolution https://ai.google.dev/gemini-api/docs/media-resolution I tried it on one of the images, how did it do? https://aistudio.google.com/app/prompts?state=%257B%2522ids%2522:%255B%252217RN57M3oZUQhq4FXgHz1g9B8kpGuvTNe%2522%255D,%2522action%2522:%2522open%2522,%2522userId%2522:%2522106366615678321494423%2522,%2522resourceKeys%2522:%257B%257D%257D&usp=sharing,%20https://drive.google.com/file/d/1L0T8BAVcFWg6-YwqlaTJji35odM645eU/view?usp=sharing https://aistudio.google.com/app/prompts?state=%257B%2522ids%...
- simonw 10mo agoI don't trust the AI Studio "share" links so here's the image I used: https://www.reddit.com/media?url=https%3A%2F%2Fpreview.redd.it%2Fthe-new-indieheads-essential-chart-version-4-0-september-v0-3cg7d97g53tb1.png%3Fwidth%3D1080%26format%3Dpng%26auto%3Dwebp%26s%3D228c284af14e06fb15a2239cf8b555da7affcea0 https://www.reddit.com/media?url=https%3A%2F%2Fpreview.redd.... And the prompt: Turn this into a list of artist - album I ran that against Gemini 3 Pro Preview with media resolution set to "high" Here's the result: Based on the image provided, here is the list of artists and albums in order from left to right, top to bottom: **Row 1** * **100 gecs** – 1000 gecs * **Alex G** – House of Sugar * **Angel Olsen** – My Woman * **The Beths** – Future Me Hates Me * **Big Thief** – U.F.O.F. * **black midi** – Schlagenheim * **Candy Claws** – Ceres & Calypso in the Deep Time * **Cloud Nothings** – Attack on Memory **Row 2** * **Courtney Barnett** – Sometimes I Sit and Think, and Sometimes I Just Sit * **D'Angelo & The Vanguard** – Black Messiah * **Danny Brown** – Atrocity Exhibition * **Deafheaven** – Sunbather * **Deerhunter** – Halcyon Digest * **Destroyer** – Kaputt * **FKA twigs** – Magdalene * **Flying Lotus** – Cosmogramma **Row 3** * **Frank Ocean** – Blonde * **Hop Along** – Bark Your Head Off, Dog * **The Hotelier** – Home, Like Noplace Is There * **Japanese Breakfast** – Soft Sounds from Another Planet * **Jeff Rosenstock** – Worry. * **Julia Holter** – Have You in My Wilderness * **Julien Baker** – Sprained Ankle * **King Gizzard & The Lizard Wizard** – Nonagon Infinity **Row 4** * **Mac DeMarco** – Salad Days * **Oneohtrix Point Never** – Replica * **Parquet Courts** – Wide Awake! * **Perfume Genius** – No Shape * **Phoebe Bridgers** – Stranger in the Alps * **Sidney Gish** – No Dogs Allowed * **SOPHIE** – Oil of Every Pearl's Un-Insides * **St. Vincent** – Strange Mercy **Row 5** * **Sufjan Stevens** – Carrie & Lowell * **Tame Impala** – Lonerism * **Tim Hecker** – Virgins * **Titus Andronicus** – The Monitor * **Vampire Weekend** – Modern Vampires of the City * **The War on Drugs** – Lost in the Dream * **Weyes Blood** – Titanic Rising * **Yves Tumor** – Safe in the Hands of Love
- thenumpaduser 10mo agoWe are actually spoiled at this point.
- echelon 10mo ago[flagged]
- dang 10mo agoCould you please stop posting this sort of indignant-sensational comment? It's not what this site is for, as you know (or should know). https://news.ycombinator.com/newsguidelines.html https://news.ycombinator.com/newsguidelines.html
- echelon 10mo agoDang, can you explain how this is indignant or sensational? Anthropic's leadership and researchers continue to this day to post messages saying engineering will be fully automated. I can go find recent messages on X if you'd like. This forum is comprised mostly of engineers, who will be the most impacted if their vision of the world pans out. YC depends on innovation capital to make money. If the means of production are centralized, how does YC make any money at all from engineers? Such a world will be vertically and horizontally integrated, not democratically spread for others to take advantage of. Now I don't think that's what's going to happen, but that's what the messaging has been and continues to be from Anthropic's leadership, researchers, and ICs. Why should we support companies like this? We shouldn't we advocate for open models where any market participants can fully utilize and explore the competitive gradients? I don't think I'm saying anything controversial here. Furthermore, if this pans out like it seems it will - a set of three or four AI hyperscalers - we'll also be in the same situation we have today with the big tech hyperscalers. Due to a lax regulatory environment, these companies put a ceiling on startup exits by funding internal competition, buying competitors, etc. I don't see how the situation will improve in an AI world. If you're a capitalist, you want competition to be fierce and fair. You don't want concentration of power. I can see how an Anthropic IC might not like this post, but this should be fairly reasonable for everyone else who would like to see more distribution of power.
- DocTomoe 10mo agoI keep wondering ... is this a good benchmark? What is a practical use-case for the skills Claude is supposed to present here? And if the author needs that particular website re-created with pixel-perfect accuracy, woulnd't it me simpler to just to it yourself? Sure, you can argue this is some sort of modern ACID-Test - but the ACID tests checked for real-world use-cases. This feels more like 'I have this one very specific request, the machine doesn't perfectly fullfill it, so the machine is at fault.'. Complaining from a high pedestal. I'm more surprised at how close Claude got in its reimagined SpaceJam-site.
- sema4hacker 10mo ago> The total payload is under 200KB. Just out of curiosity, how big was what you considered Claude's best attempt to be?
- tehjoker 10mo agoHmm you note that the problem is the LLM doesn’t have enough image context, but then zoom the image more? Why not downscale the image and feed it as a second input so that entire planets fit into a patch and instruct it to use the doensampled image for coarse coordinate estimation
- 960design 10mo agoClaude argued with me about the quadratic equation the other day. It vehemently felt a -c was required whereas a c was the correct answer. I pointed this out showing step by step and it finally agreed. I tried Grok to see if it could get it right. Nope, the exact same response as Claude, but Grok never backed down; even after the step by step explanation of the maths.
- kristofferc 10mo agoCan you link to the conversation log?
- pbhjpbhj 10mo agoIn the generalised solution there is a '-c' term with coefficient '4a'...? I'm not well at the moment, perhaps your ML model has flu?!!
- rickcarlino 10mo agoI look forward to an alternative reality where AI vendors race to have the model with the best Space Jam Bench scores.
- jacquesm 10mo agoIt beats pelicans by a considerable margin.
- computersuck 10mo agoWhy not just host a copy from waybackmachine?
- Madmallard 10mo agoI wrote a 20,000 line multiplayer battle-arena game in XNA back in 2015 with manually coded physics (so everything is there in the code) and have tried several times with Claude, Gemini, Grok, DeepSeek, and GPT to translate it to JavaScript. They all fail massively 100% of the time. Even if I break it down into chunks once they get to the chunks that matter the most (i.e. physics, collision detection and resolution, event handling and game logic) they all break down horribly and no amount of prompting back and forth will fix it.
- RagnarD 10mo agoWhy not just feed it the actual instructions that create the site - the page source code, the HTML, CSS, JS if any?
- masswerk 10mo agoThis may be an even greater challenge: analysing a table layout and recreating it in CSS with absolute positioning.
- computersuck 10mo agothis is just AI brainrot disease Help, I can't recreate a website with AI! There's no other way, no way I could fix up some HTML code! Believe me, I'm an engineering manager with a computer science degree! Absolutely disgusting.
- derektank 10mo agoI’m pretty confident the author was being sarcastic
- victorbuilds 10mo agoBuilding something similar - using Claude API to generate mini games from text descriptions (https://codorex.com https://codorex.com, still pretty rough). Can confirm: Claude is weirdly good at generating functional game logic from vague prompts, but spatial precision is a constant battle. Anything involving exact pixel positions needs validation/correction layers on top. The suggestion upthread about having it write its own measurement tools seems promising - haven't tried that approach yet.
- victorbuilds 10mo agoActually, here's a relevant example - had Claude generate an interactive solar system with circular orbits and moons: https://codorex.com/shared/yeABdJWvRHAKqHs2kxpRnZNZPWmqWSu9 https://codorex.com/shared/yeABdJWvRHAKqHs2kxpRnZNZPWmqWSu9 Interesting that it handles this fine (functional orbital mechanics, animation) but would probably struggle to recreate the exact pixel positions of the Space Jam layout. Confirms the pattern: good at "make something like X" but bad at "recreate X exactly."
- thecr0w 10mo agoThis is really cool.
- anorwell 10mo agoThe article does not say at any point which model was used. This is the most basic important information when talking about the capabilities of a model, and probably belongs in the title.
- thecr0w 10mo agoWhoops, I'm very dumb. It's Opus 4.1. I updated the blog post and credited you for the correction. Thank you!
- dweekly 10mo agoThat model does not exist. Do you mean Opus 4.5?
- hu3 10mo agoOpus GPT 4.1 Pro Maverick DeepK2
- retsibsi 10mo ago> That model does not exist. It does (unless the previous comment was edited? Currently it says Opus 4.1): https://www.anthropic.com/news/claude-opus-4-1 https://www.anthropic.com/news/claude-opus-4-1. You can see it in the 'more models' list on the main Claude website, or in Claude Console.
- ErrantX 10mo agoI just feel this is a great example of someone falling into the common trap of treating an LLM like a human. They are vastly less intelligent than a human and logical leaps that make sense to you make no sense to Claude. It has no concept of aesthetics or of course any vision. All that said; it got pretty close even with those impediments! (It got worse because the writer tried to force it to act more like a human would) I think a better approach would be to write a tool to compare screenshots, identity misplaced items and output that as a text finding/failure state. claude will work much better because your dodging the bits that are too interpretive (that humans rock at and LLMs don't)
- sallveburrpi 10mo ago> vastly less intelligent than a human I would more phrase it like that they are a completely alien “intelligence” that cant really be compared to human intelligence
- oncallthrow 10mo agoYes, currently they are both smarter and dumber than humans.
- ErrantX 10mo agoI meant that frame very deliberately. Use of the word AI is misleading people that LLMs are intelligent. They model what looks like intelligence but with very hard limits. The two advantages they have over human brains are perfect recall and data storage. They are also faster. But the brain is vastly more intelligent: - It can learn concepts (e.g. language) with an order of magnitude less information - It responds in parallel to multiple formats of stimuli (e.g. sight/sound) - LLMs lack the ability to generalise - The brain interprets and understands what it experienced That's just the tip of the iceberg. Don't get me wrong: I use AI, it is by far some of the most impressive tech we have built so far, and it has potential to advance society significantly. But it is definitely, vastly, less intelligent than us.
- sallveburrpi 10mo ago
- manmal 10mo agoI would put Claude into a loop and let it make screenshots itself, diffing them against the original screenshot, until it has found the right arrangement at the planets‘ starting position (pixel perfect match).
- epgui 10mo agoAt that point you may as well just do the work yourself.
- hooo 10mo agoWhy? Just give it access to the playwright mcp server.
- manmal 10mo agoI‘m using this, works really well and doesn’t pollute context as much: https://github.com/steipete/agent-scripts/blob/main/scripts/browser-tools.ts https://github.com/steipete/agent-scripts/blob/main/scripts/...
- manmal 10mo agoWhat I‘m describing is probably a few minutes of exploring and writing a good prompt, vs what, 4h of CSS wrangling?
- epgui 10mo agoI don’t see how this should take more than a few minutes of css work.
- fluidcruft 10mo agoI would try giving it a tool to work with projections and process axis by axis to see if it works better in 1D than 2D. I dunno how clever claude is about signal processing though. There's no noise here so... I mean really it's just template matching without rotation and without noise so... But I doubt claude can do or reason about basic image processing.
- neuroelectron 10mo agoMy web-dev friend saw the original Space Jam site. I asked him what it would cost to build something like that today. He paused and said: We can’t. We don’t know how to do it.
- Aeolun 10mo agoI think claude could have easily used a script to calculate the positions of the planets exactly here, instead of trying to use the frankly horrible image recognition.
- fluidcruft 10mo agoClaude could probably have written a script to do it. I'm hunting assets to confirm. Edit: yup very easy for claude. Most of the wall time was spent installing cv2 in a venv (uv dropped python 3.14 on claude, which seemed to get stuck compiling numpy or something so I interrupted and told claude to just use python 3.13 instead). ME: In this directory there are two images: @p-pressbox.gif and @screenshot.png. @p-pressbox.gif is an image that exists somewhere inside @screenshot.png Write a script that finds the precise location CLAUDE: Looking at the images, I can see that p-pressbox.gif (the spaceship with "PRESS BOX SHUTTLE" text) appears in the upper-left area of screenshot.png. I'll write a Python script using OpenCV to find the precise location. [ some venv stuff/telling claude to use uv and python 3.13 ] CLAUDE: The script found the precise location of p-pressbox.gif within screenshot.png: | Measurement | Value | |---------------------|-----------------| | Top-left corner | (87, 110) | | Bottom-right corner | (218, 166) | | Center | (152, 138) | | Template size | 131 × 56 pixels | | Match confidence | 97.2% | The script is at /tmp/search/find_image.py and uses OpenCV's template matching with normalized cross-correlation. ME> As part of the output create a visualization of the @p-pressbox.gif positioned on top of the original screenshot CLAUDE: Done! The visualization shows a green rectangle highlighting the exact location where p-pressbox.gif was found within the screenshot. The match is at coordinates (87, 110) to (218, 166). I confirmed the result was correct.
- thecr0w 10mo agoOh what the heck. That worked really well for you. Would you be willing to recreate all the html and push it up to github? I'll drop the repo at the top of the blog post. It would be really cool for me to see this completely done and a great way to finish out the blog post. I obviously couldn't do it.
- BiteCode_dev 10mo agoTell claude to put the screenshot as an centered image with the body having the starry background on repeat. Then define the links as boxes over each icons with an old little tech trick called an image map. Common at the time before flash took over.
- wilsmex 10mo agoWell this was interesting. As someone who was actually building similar website in the late 90's I threw this into the Opus 4.5. Note the original author is wrong about the original site however: "The Space Jam website is simple: a single HTML page, absolute positioning for every element, and a tiling starfield GIF background.". This is not true, the site is built using tables, not positioning at all, CSS wasn't a thing back then... Here was its one-shot attempt at building the same type of layout (table based) with a screenshot and assets as input: https://i.imgur.com/fhdOLwP.png https://i.imgur.com/fhdOLwP.png
- manbash 10mo agoAh, those days, where you would slice your designs and export them to tables.
- thecr0w 10mo agoI learned recently that this is still how a lot of email html get generated.
- ricardonunez 10mo agoOh yeah, recently I had to update a newsletter design like that and older versions of outlook still didn’t render properly.
- mananaysiempre 10mo agoApparently Outlook (the actual one, not the recent pretender) still uses some ancient WordHTML version as the renderer, so there isn’t much choice.
- masklinn 10mo agoFun fact: until Office 2007, outlook used IE’s engine for rendering html.
- gregoryl 10mo ago
- manlymuppet 10mo agoCouldn’t you just feed Claude all the raw, inspect element HTML from the website and have it “decrypt” that? The entire website is fairly small so this seems feasible. Usually there’s a big difference between a website’s final code and its source code because of post processing but that seems like a totally solvable Claude problem. Sure LLMs aren’t great with images, but it’s not like the person who originally wrote the Space Jam website was meticulously messing around with positioning from a reference image to create a circular orbit — they just used the tools they had to create an acceptable result. Claude can do the same. Perhaps the best method is to re-create, rather than replicate the design.
- personjerry 10mo agoIf you have the raw HTML why would you need to do this at all?
- manlymuppet 10mo agoI should've been more precise with my words. What I meant is doing inspect element on the Space Jam website, and doing select all + copy.
- futuraperdita 10mo agoI think you're assuming a pattern existed in 1996 that didn't actually exist until the 2010s. In 1996 JavaScript was extremely limited; even server side processing was often limited to CGI scripts. There was nothing like React that was in common use at the time. The Space Jam website was almost certainly not dynamically compiled as HTML - it existed and was served as a static set of files. Even a decade later, React and the frontend-framework sort of thinking wasn't really a big thing. People had started to make lots of things with "DHTML" in the early 2000s where JavaScript was used to make things spicier (pretty animations, some server side loading with AJAX) and still often worked without JS enabled in a pattern called graceful degradation. What you'd get from "View Source", or "Inspect Element", and what was literally saved on disk of spacejam.com, was almost certainly the same content.
- torginus 10mo agoNot sure how good Claude is nowadays, but I remember using Claude 3.5 to do some fiction writing and for a while I thought it was amazing at coming up with plots, setting ideas, writing witty dialogue - then after a short while I noticed it kept recycling the same ideas, phrases etc, quickly becoming derivative, and having 'tells', similar to the group of 3 quirk, with some otherwise decent writing patterns showing up with great frequency. I've heard the same thing about it doing frontends - it produces gorgeous websites but it has similar 'tells', it does CSS and certain features the same way, and if you have a very concrete idea of what you want out of it, you'll end up fighting an uphill battle with it constantly trying to do things its own way. Which is part of the 'LLM illusion' - I guess. To an unskilled individual, or when starting from scratch, it seems great, but the more complex the project gets, the harder it becomes to have it contribute meaningfully, leading to an ever-mounting frustration, and eventually me just giving up and doing it by hand.
- tyre 10mo agoMy boy loves a neon gradient. To be fair, a lot of startup websites look very similar. And the number of Stripe blurples out there was a pre-LLM brand meme.
- Tokkemon 10mo agoWhy do I feel like the old man yelling at clouds that programmers refuse to use their brains anymore?
- mrwaffle 10mo agoIt's funny, the joke that good programmers are lazy, has always held until now.
- subleq 10mo agoWhat if you gave it an image comparison tool that would xor two screenshots to check its work?
- poly2it 10mo agoI've tried doing stuff similar to the author, and it generally does not get better after the first attempt. I even tried supplying Claude with a delta view, ie. the difference in per-pixel output, along with the reference and current result, yet it was impossible for it to understand and remember the actual differences.
- djaowjxj 10mo ago[flagged]
- buchwald 10mo agoClaude is surprisingly bad at visual understanding. I did a similar thing to OP where I wanted Claude to visually iterate on Storybook components. I found outsourcing the visual check to Playwright in vision mode (as opposed to using the default a11y tree) and Codex for understanding worked best. But overall the idea of a visual inspection loop went nowhere. I blogged about it here: https://solbach.xyz/ai-agent-accessibility-browser-use/ https://solbach.xyz/ai-agent-accessibility-browser-use/
- MagMueller 10mo agoInteresting read. Agree that GUI is super hard for agents. Did you see "skills" from browser-use? We directly interact with network requests now.
- system2 10mo agoUse Claude for Python. That's it. Don't push it for the frontend, it won't do well.
- charcircuit 10mo ago>I'd like to preserve this website forever and there's no other way to do it besides getting Claude to recreate it from a screenshot. There are other ways such as downloading an archive and the preserving the file in one or more cloud storages. https://archive.is/download/cXI46.zip https://archive.is/download/cXI46.zip
- a2128 10mo agoThe sentence immediately after that would imply sarcasm > Note: please help, because I'd like to preserve this website forever and there's no other way to do it besides getting Claude to recreate it from a screenshot. Believe me, I'm an engineering manager with a computer science degree. Please please please help (sad emoji)
- mr_windfrog 10mo agoMaybe we could try asking Claude to generate code using <table>, <tr>, <td> for layout instead of relying on div + CSS. Feels like it could simplify things a lot. Would this actually work, or am I missing something?
- thecr0w 10mo agoI think it probably gets you 80% but the last 20% of pixel perfection seems to evade Claude. But I'm pretty new to writing prompts so if you can nail it let me know and I'll link you in the post.
- mxfh 10mo agoEverything feels wrong with that approach too me, starting with calling a perfectly time-appropriate website anachronistic. Anachronistic would be something like creating an apparent flash website for a fictional 90s internet related movie.
- robomc 10mo agoHe's using it correctly, in its secondary sense of "belonging or appropriate to an earlier period, especially so as to seem conspicuously old-fashioned or outdated."
- mxfh 10mo agoStill not quite convinced that the adjective should be applied to the website itself in a quite loose use of the word. Warner Bros anachronistically keeps this website online would be a simple fix; here used to reference and to point out that maintaining an untouched 1996 promotional site at it's original location is not typical for the lifecycle of a website, usually the publisher would rather redirect clicks to some current offer. Othwerwise there is no anachronism here with the website itself, just it's location under the original URL and not in some archive only. The website itself fulfilled its purpose for promoting the movie when it was released and simply continues to exist. You wouldn’t call posters, magazines, or other artifacts from the ’90s anachronistic just for still existing. Being retrievable doesn’t make something outdated by itself. “Anachronistic” would apply only if a new promotional site were created today to look like this—though that would more likely be called “retro.” Or if the movie industry insisted on using CSS-free table layouts for all its promotional websites, similar to other norms or laws that feel anachronistic because they no longer match current needs. Sadly the whole piece reads like it was written 80%+ by an LLM too, seriously why all the emojis? But apparently this is where content is heading in general.
- animanoir 10mo ago[dead]
- jdironman 10mo agoI am going to give this a shot, but using a method I have been using lately with subagents. Basically, what I do is have it create an Architect, Executor, Adjudicator subagents. Architect breaks any ask down into atomic and testable subtasks that take 1-3 minutes 'dev' time. Executor (can spawn more than one) implements them. Then adjudicator reviews that they are to spec / requirements. This all happens in subagent files + a runbook.json in the .claude folder of a project. Its based on a paper* that was featured on here a while back actually [1]. [1] https://arxiv.org/abs/2511.09030 https://arxiv.org/abs/2511.09030
- tyiz 10mo ago[dead]
- yosito 10mo agoThis has been my experience with almost everything I've tried to create with generative AI, from apps and websites, to photos and videos, to text and even simple sentences. At first glance, it looks impressive, but as soon as you look closer, you start to notice that everything is actually just sloppy copy. That being said, sloppy copy can make doing actual work a lot faster if you treat it with the right about of skepticism and hand-holding. It's first attempt at the Space Jam site was close enough that it probably could have been manually fixed by an experienced developer in less time than in takes to write the next prompt.
- jama211 10mo agobut my experience has also been that with every model they require less hand holding and the code is less sloppy. If I’m careful with my prompts, gpt codex 5.1 recently has been making a lot of typescript for me that is basically production ready in a way it couldn’t even 2 months ago
- 1970-01-01 10mo agoThis is a great under the radar test for AI. I would put money on it failing to recreate the majority of 90s movie websites as it wasn't trained on them. The old cowboy webmasters that built and ultimately abandoned them didn't write many books on the topic.
- handedness 10mo agoA site in '96 would have been built largely with tables, not CSS. CSS didn't become a thing until a couple of years later. I know this because I'm still salty about the transition. For all of CSS's advantages, we lost something when we largely moved away from tables.
- chrisco255 10mo agoWe lost something for a time but flex box and CSS grid (which came more recently) are objectively better than tables.
- icommentedtoday 10mo agoHow are they objectively better? They seem way too complex for me
- yesitcan 10mo agoYou can still use tables.
- handedness 10mo agoOf course, as implied by, "we largely moved away from tables."
- ajasmin 10mo agoI'm actually surprised Claude was about to do that much. I hadn't even considered handing it a visual mockup to work from. Event though that workflow is par for the course for any web design team. I would assume there must be at least some prior work into locating individual assets in a larger canvas. It just needs to be integrated into the pipeline.
- vrighter 10mo ago"there is no other way to preserve it" Bullshit. Right click -> view source Or just press ctrl+s and the browser will also gather all the assets into a folder for you. The arrogance of thinking that the only way you know how is the only way.... You literally forgot the save feature all browsers have just because you set out to "solve" this using "ai"
- liampulles 10mo agoIt seems to me that Claude's error here (which is not unique to it) is self-sycophancy. The model is too eager to convince itself it did a good job. I'd be curious to hear from experienced agent users if there is some AGENTS.md stuff to make the LLM more clear speaking? I wonder if that would impact the quality of work.
- aprilfoo 10mo ago> It seems to me that Claude's error here (which is not unique to it) is self-sycophancy. The model is too eager to convince itself it did a good job. It seems this applies to the whole AI industry, not just LLMs.
- phplovesong 10mo agoThis basically boils down to AI being unable to "center a div". I see this very often, AI generated slop is has LOTS of "off by one" kind of bugs.
- voodooEntity 10mo agoTHanks for sharing this. Partly because i forgot about this great website :D also because i would never thought of giving this as an LLM task because its so simple that i prolly just had hacked it down myself :D I recently experimented alot with agentic coding (mostly with gemini+ intellij plugin, copilot intellij plugin and intellij's own junie) and also condsidered to give it a try and feed images to the AI, but than all tasks i tried so far were pure backend-ish so it never came to the point. Im really curious how especially junie will act and i will give it a try with the very same task you gave it. We gonne see how it ends :D
- p0w3n3d 10mo agoLLM stands for large LANGUAGE models, so I guess you could succeed if you had a correct LANGUAGE. Maybe radial coordinates? Or turtle graphics? I myself tried to generate an SVG with twelve radial dots as in a clock in chatgpt, and failed (a year ago). Now I think it would succeed, however still the question is does it succeed because people trained it to do so. Also I have noticed that AI generates things close to what you want, and it sticks really hard to that "close" qualifier, not wanting to cross any borders to get too close, so I'd be happy with the effect you have shown, as it is what AI does
- vghaisas 10mo agoYou might enjoy these AI generated clocks: https://clocks.brianmoore.com/ https://clocks.brianmoore.com/
- ettsvensktlogin 10mo agoThis was very interesting. I've tried to create an "agent" Claude Code based system to generate design from screenshots, using Playwright and other tools to take screenshots for iterative improvements. So far I have failed despite weeks of struggles. Thanks to this post I now have a deeper understanding as to why. Thank you.
- badlogic 10mo agoLoved the fun write up. Now that we know that LLM-based vision is lossy, here's a different challenge: Give the LLM access to the site's DOM and let it recreate the site with modern CSS. LLMs are much better with source code, aka text, right? :)
- stared 10mo agoJust use Playwright Skill (https://github.com/lackeyjb/playwright-skill https://github.com/lackeyjb/playwright-skill). It is a game changer. Otherwise it is Claude the Blind, as OP mentioned.
- pcwelder 10mo agoBut that's cheating because it then has the source code containing the table and its styles. I can confirm that this is what it does. And if you ask it to not use tables, it cleverly uses div with the same layout as the table instead.
- drbacon 10mo agoI think the idea is to let Claude see iterations of the reproduction with playwright, but still only allow access to screenshots of the original.
- jackfranklyn 10mo ago[flagged]
- theahura 10mo agoI was able to get Claude to do this, though it kinda sorta cheated. Blog post describing the output here: https://theahura.substack.com/p/i-successfully-recreated-the-1996 https://theahura.substack.com/p/i-successfully-recreated-the... TLDR: "The plan is designed to ‘autoformalize’ the problem by using Test Driven Development (TDD). TDD is incredibly important for getting good outputs from a coding agent, because it helps solve the context rot problem. Specifically, if you can write a good test when the model is most ‘lucid’, it will have an easier time later on because it is just solving the test instead of ‘building a feature’ or whatever high dimensional ask you originally gave it. From here, Nori chugged away for the better part of half an hour in yolo mode while I went to do other things. And eventually I got a little pop up notification saying that it was done. It had written a playwright test that would open an html file, screenshot it, diff it with the original screenshot, and output the final result... After trying a few ways to get the stars to line up perfectly, it just gave up and copied the screenshot in as the background image, then overlaid the rest of the HTML elements on top. I’m tempted to give this a pass for a few reasons. This obviously covers the original use case that tripped up Jonah. It also is basically exactly what I asked the model to do — that is, give me a pixel perfect representation — so it’s kind of my fault that I was not clearer. I’m not sure the model actually can get to pixel perfect any other way. The screengrab has artifacts. After all, I basically just used the default linux screenshot selection tool to get the original output, without even paying much attention to the width of the image. If you ask the model to loosen the requirements for the exact screengrab, it does the right thing, but the pixel alignment is slightly off. The model included this as index_tiled.html in the repo, and you can see the pixel diff in one of the output images..."
- city17 10mo agoLovable was able to one-shot it (except for the top margin): https://spacejam-pixel-perfect.lovable.app/ https://spacejam-pixel-perfect.lovable.app/ All I did was give Lovable a single prompt: "with pixel perfect accuracy recreate this website: https://www.spacejam.com/1996/ https://www.spacejam.com/1996/" Edit: Commenter below may be right.
- baq 10mo agonew LLM benchmark just dropped. 'draw an svg of a pelican riding a bicycle browsing spacejam 1996 on 640x480 ie6'.
- taf2 10mo agoIn my experience codex has been better at details like this. But who knows working with an llm much like another engineer is all about how you ask and then how you iterate with the llm.
- PaulHoule 10mo ago(1) Multi-modal is where a lot of these things go to die. You will hear people talk about the occasional striking success but so often I show Copilot an easily identifiable flower image and it gets it wrong even though Google Lens will get it right (2) The kind of dialog he's having with Claude is a kind of communication pattern I've found never works with LLMs. Sure there is the kind of conversation that goes Do X ... that's pretty good except for Y Great! but if it is Do X and it comes back with something entirely wrong I'd assume the state of the thing is corrupted and it is never coming back and no matter how you interrogate it, encourage it, advise it, threaten it, whatever, you will go in circles.
- succo 10mo agoWhy not ask Claude to recreate the website by scraping it?
- grouchy 10mo agoHas anyone found techniques to improve Claude's spatial/layout understanding? It seems Nano Banana Pro can understand the layout/spatial well.
- QuadrupleA 10mo agoWasn't it now (end of 2025) that Dario Amodei said Claude (or LLMs in general) would be doing almost all programming work? This article is my typical experience with LLM coding. Endless correction and handholding, and manual cleanup of subtle mistakes. With no long-term learning from them. Kinda makes me livid, the amount of false hype coming out of the mouths of the stewards of these investor-subsidized LLM companies. But they're amazing Google replacements, and learning tools. And once in a blue moon they ace a coding assignment and delight me. Edit: 90% of coding work by June to September 2025: https://www.businessinsider.com/anthropic-ceo-ai-90-percent-code-3-to-6-months-2025-3 https://www.businessinsider.com/anthropic-ceo-ai-90-percent-...
- pwython 10mo agoI mean, Claude got 90% there. The author could contribute 10% of work to fix the alignment and have a finished page.
- QuadrupleA 10mo agoHe assembled all the assets, did a bunch of prompting prep, etc. The alignment was kinda the main job, and he would have had to do a bunch of cleanup after. If this was a freelance job a client was paying for, I'd definitely tell myself to save cost next time by not using AI.
- hodder 10mo agoThis is spot on to my experience vibe coding. You can get pretty good scaffolding but tinkering with details is a nightmare. That is when you need to step in and take over yourself or you will burn all the time saved from the the scaffolding speed up.
- kvirani 10mo agoSibling post here: https://news.ycombinator.com/item?id=46193412 https://news.ycombinator.com/item?id=46193412
- dmitrygr 10mo agoThem: AI will take jobs. The AI: https://chatgpt.com/share/6923df03-7304-8010-bd08-cd335f0ee961 https://chatgpt.com/share/6923df03-7304-8010-bd08-cd335f0ee9...
- jonas21 10mo agoThere was a response to this post on the front page earlier this morning that was able to get Claude to succeed simply by giving it access to Playwright so it could see what it was doing and telling it in the prompt that it needed to be pixel perfect: https://news.ycombinator.com/item?id=46193412 https://news.ycombinator.com/item?id=46193412 As of right now, it seems to have been flagged into oblivion by the anti-AI crowd. I found both posts to be interesting, and it's unfortunate that one of them is missing from the conversation.
- thecr0w 10mo agoyeah that sucks. I also linked it to the top of my post so folks can take a look.
- kaijia 10mo agoI almost did it with the plain claude code on a $20 plan, without any skills, by leveraging my domain expertise with the following prompt: Your goal is to create an HTML5 website that is pixel-accurate as the screenshot @Space-Jam.png . You can use the image files in the `img` folder. To achieve pixel-level reproduction, first write auxiliary programs to measure the pixel locations of the objects on this page. Then use your measurements to create the page. Consider using feature detection/matching with per-object (x, y) offsets and a global scale factor shared by all objects as the free parameters. Consider using RANSAC for robust estimation. After obtaining an initial estimation, crop the image of each object and use local sparse optical flow for refinement. Use JPG format for visual inspection of intermediate results. Your webpage should be able to scale with the window size. Note: the footer text size/locations are off. We can probably fix that by explicitly asking cc to write scripts for text bounding box detection. More details here: https://gist.github.com/jia-kai/802de63816711d67f0a090fa267ac3ae https://gist.github.com/jia-kai/802de63816711d67f0a090fa267a...
- geldedus 10mo agoAI-assisted coding is a learned skill. You'll have to do it right, with the right approach and the right tools.
- mtritter 10mo ago[dead]