Comment by kaijia

I 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/802de63816711d67f0a090fa267a...