What Building a Landing Page Through Many Iterations Teaches You

Every AI landing page looks the same

Purple gradient. Floating product screenshot. "Powered by AI" in bold. Three feature cards. A CTA button.

The problem isn't the individual elements — it's that they've been copied so many times they've stopped meaning anything. A visitor processes the whole page in about four seconds and files it under "another AI startup."

When I started working on the Scam AI landing page, the bar was simple: don't look like every other AI company. An AI security company that detects deepfakes, scam calls, and fraud should feel like it has teeth. Not a generic SaaS aesthetic.

I didn't expect how many iterations it would take to get there.

The early versions

The first version was functional and forgettable. Standard Next.js layout, hero section with a tagline, three feature cards. Shipped quickly to have something live.

From the beginning this was a collaborative project — multiple complete rebuilds, the kind of "tear it all down and start over" cycles that only make sense in retrospect. My teammate Dennis drove the final version, bringing the visual identity and execution that made it actually land. I was more involved in the earlier iterations: the architecture, the design decisions, figuring out what each version was trying to fix and why the last one hadn't worked.

Understanding the real design problem

Early on I realized the core challenge: Scam AI serves completely different audiences. Enterprises buying API access. Individuals worried about scam calls. Researchers interested in the underlying detection models.

A single hero can't speak to all three. You have to pick who you're talking to first and trust that everyone else can find their section. I didn't commit to that choice early enough, and the page oscillated longer than it should have.

The Bento phase

One redesign cycle brought in a Bento grid — the card-based layout Apple popularized. Dense, modular, visually interesting.

It worked for a while. The grid communicated "we do a lot of things" efficiently. But with 8 product verticals — deepfakes, voice clones, scam text, AI-generated images, KYC verification — it started to feel like a menu rather than a pitch.

Good landing pages answer one question before the visitor asks it: why should I care? A menu answers a different question: what do you sell? Those are not the same.

Leading with the problem

The clearest version of the page came from committing to a problem-first narrative.

Instead of opening with the product, open with what happens when the product doesn't exist: a grandmother wires money to a voice clone of her grandson. A hiring manager interviews a deepfake candidate. A financial firm processes synthetic identity documents at scale.

These don't require the visitor to already understand what "AI-generated media detection" means. They set up the product as the answer to something real, not another capability to evaluate.

The hero became: show the threat, then show the shield.

The newsletter CMS

One detour I didn't expect: building a full newsletter system into the landing site. Scam AI publishes content about fraud trends and detection research, and it needed to live somewhere branded rather than just in an email client.

I built an admin CMS with an editor, slug-based URLs, article thumbnails, and RSS feeds from external news sources. The public reading experience was designed to feel like a proper publication, not a blog afterthought.

It was a different kind of problem than the landing page. The landing page is about impression. The newsletter is about retention. Different layouts, different typographic decisions, different definition of "good." Building both back-to-back made the contrast obvious.

The hero video problem

For a while, the hero featured an auto-playing dashboard demo video — starting at 4 seconds into the clip to skip the boring loading screen, looping from there.

In theory: show the product in action. In practice: the video competed with the headline for attention, loaded slower on mobile, and often just didn't play at all. The hero's message had become contingent on a video working correctly.

Removed it. A strong headline and a well-chosen static visual outperform a generic product demo video almost every time. The video felt impressive in development and forgettable in production.

What I'd do differently

Commit to one audience earlier. Every time I tried to speak to enterprises and individuals simultaneously, I diluted the message for both. Pick the primary user; design for them.

Treat the headline as the hardest design problem. I spent more time on nav animations and color tokens than on the actual words in the hero. That's backwards. The headline is the only element every visitor definitely reads. Everything else is optional.

Don't treat copy like code. Design systems track every component change. Marketing copy changes happen in-place, untracked, undocumented. Midway through I couldn't remember why certain phrasings existed or what they'd replaced. If I were doing this again I'd keep a simple log of what each hero variant said and why it changed.


The landing page is live at scam.ai. The source is on GitHub — the commit history is more honest about the full iteration story than this post is.