Rooftop Studio

Rooftop is a fake newsletter platform. I started with one AI-generated image and took it to a working site. Landing page, testimonials, pricing, all of it built around that one picture.

Generated the skyline in Magnific. Flat horizon, water towers, a few lit windows. The empty sky left room for the headline.

The Magnific image, and the finished hero

Designed the page in Pencil. Took the colours from the image, in a light and a dark version. Big grotesk for the headlines, monospace for the small print.

Designing in Pencil

Built it with Claude Code. The hero animates in on load, and the page goes from day to night as you scroll. Same picture doing both.

Building it in Claude Code

The site is live. Drag the slider to resize it, and scroll inside it. It's the real thing in a frame, not a screenshot, so the layout breaks where it actually breaks.

The live site, resizable

Open the live site ↗

The writers and the numbers are fake. The design is real. All of it came from that first image.