It took me a long time to vibe code a landing page for Familiar

Code was never the bottleneck.

Quick life update: Maxim and I and our loved ones are out of harm’s way and in transit. Samuel, our mac mini running OpenClaw, however, is still in Maxim’s Tel Aviv apartment and blissfully unaware. We think.

Quick Familiar update: You all blew our expectations away. We’ve run 52 onboarding conversations and made a bunch of improvements thanks to all of you. We weren’t able to schedule with everybody who wanted to, and our bottleneck was creating enough time to balance learning with acting on those learnings.

If you reached out and we haven’t connected yet, we saved every message and you’ll be the first people we schedule with. For now, go ahead and download it so it’s building up context. When we do meet, we can dig into some really interesting use cases together.

Our first goal was making single-player mode really great, and we’re now researching multiplayer mode (i.e. what happens when a critical mass of people in your organization install Familiar and compound each other’s use of AI). If you lead a team and that feels exciting, we’d love to hear why - just hit reply.

---

It took me a long time to vibe code a landing page for Familiar

We intentionally didn’t build a landing page for Familiar when we launched it three weeks ago. We wanted everyone who signed up to schedule 10 minutes with us for onboarding so we could learn as much as possible. After 52 conversations, it was time to make it easier for people to just download and install it.

Maxim is the actual talent, so I took the task of making a landing page.

I wanted to share this project specifically because it’s not technically complicated. It’s a static landing page. I chose the least sexy, most trivial-sounding thing to show you how much work and research and customer knowledge still went into getting something I’m proud of. And how much I still had to partner with AI to avoid slop.

I’m worried there’s a weird incentive in our industry right now to show how quick things were and how easy things were for you, as a mark of being AI-forward. We say things like “just vibe code it” like that’s some kind of answer. So I wanted to share my experience, theater-free.

I did this in two phases: getting the content right, and vibe-designing-coding the actual page. Spoiler: The hardest part was going to be figuring out what should actually be on the page. The second hardest thing would be designing something that looks great.

If you’re feeling impatient and want to see the result: https://www.looksfamiliar.org/

Phase 1: using Cursor to figure out the content

There was no need for AI to slop-generate this content. We had a ton of raw customer insights to work with and thus a chance to be really thoughtful. In this case, “fast” or “efficient” was not the goal, until I nailed “effective.” And that bottleneck isn’t coding, it’s how fast we could learn from our users.

I started by creating an empty markdown file in my project as a spec for the landing page, and filled it out with my initial thoughts.

Turning user conversations into a super-precise FAQ

A lot of the same questions would come up often, and the landing page was the right place to address a lot of them. We had the luxury of being really precise about this because we knew exactly how many people asked which question.

Here’s the prompt I gave Cursor:

We've done a lot of onboarding conversations with our first few dozen
users and I'd like to really get a sense for what are the common
questions that people asked and that we had to answer. Let's be really
comprehensive and create a superset here. Come up with a ranked list
of the main ones that come up all the way down to the less common
ones, and really capture them all inside of the section on line 9.

I used plan mode so it would ask me questions before diving in, to align before it runs off. (Plan mode is the same as just telling it to ask you questions and then save a plan somewhere, but it’s a nice UI affordance).

I’m using Claude Opus 4.6, and I noticed it’s spawning subagents (Cursor’s faster, cheaper Composer model) to do the actual research. Opus acts like an executive - it doesn’t use a ton of context itself. Most of the context gets consumed by these subagent threads, and only the bottom line comes back to the main thread.

I love that you can click into each subagent and see the prompt that Opus wrote, what the subagent thought, and what came back. This way, the agent can cover a massive amount of ground with very few tokens.

Adding the answers

Once I had the ranked list of questions, I asked it to add the answers. Again it used subagents, and I liked watching how it divided the work. It wasn’t splitting by question - it was splitting by person. One subagent handled one group of transcripts, another handled a different group. Same questions, different sources.

Now I had a juicy spec with use cases, FAQs, and real answers from real conversations.

Getting a second opinion

I wanted AI’s opinion on the structure before filling in the details

Please take a look at [the spec] and given all the conversations in
[the transcripts folder], what would make this a really effective
landing page for our target audience? What's missing? I would love
your help as a partner on this.

Even though the task was pretty well defined, it went wide. It read our original blog post. It read the current placeholder draft on looksfamiliar.org. I didn’t ask it to do any of that. I guess you’d call that “high agency” (I’m relieved to have a word for this other than “agentic”).

Its feedback was really, really, really good. Like better than most marketing people I’ve worked with.

I implemented AI’s feedback semi-manually - I wanted to be really familiar with everything it was telling me and apply my own judgment on what belongs where. Funny how the bottleneck is me catching up and staying in context.

Filling out the landing page content, section by section

So at this point I had a doc with a bunch of new sections. I asked AI to help fill each one with the best material we’ve gathered so far: transcripts, blog post, whatever was relevant.

I could see I was on a path to lots of slop, so I stopped it and added the following to my chat:

Let's do this one thing at a time. Each section and your feedback.
Let's go one piece of feedback at a time. Find the section I created
for it. Ask me anything, one question at a time.

“One question at a time” pulls stuff out of me that I wouldn’t have articulated upfront, and it gives me chances to apply my taste along the way.

Whittling down to a lightweight landing page spec

The result was a super set of things that could go on the landing page in a rough structure. I wanted to really curate and whittle this down to something very focused and purposeful that I could give to AI to implement. It would have only what I wanted to appear on the page, and no fluff.

Phase 2: vibe designing and coding the page

My biggest fear was it making something that was slightly off, and then being stuck in vibe-coding mud for days.

To avoid this, I chose a design system (any design system) that helps keep things maintainable and coded quickly. I decided on shadcn which is a basic frontend foundation for lots of great UI libraries (that I can then mix and match).

I decided to switch to Claude Code for this part. Here’s the prompt:

I want you to take the lightweight website spec for the landing page
and turn it into a landing page that's a sibling to the current
marketing website directory, so we can see them side by side. Make it
a static site I can deploy on Vercel, just like the other one.

Treat the markdown file with all the content as an open-ended spec.
Stay very true to that content, but I want you to decide which UI
components and blocks to render them with.

Use ShadCN with ShadCN Marketing blocks.

Stylistically, start inspired by Mobbin - their typography and their
vibe. Beyond that, use the /frontend-design.

Let's go section by section. Tell me what you think, give me a link
to preview what you want to use for each section, render it, show it
to me, and then I'll give you feedback. Then we'll go to the next
section and build the landing page together that way.

I'm looking to you to lead me and bring your creativity here. But
also be a consultant and ask me the important questions you need to
make these decisions. Ask me one question at a time, at any point.

Claude Code’s frontend design skill

Huge credit to Eric Xiao for sanity checking my process, and pointing me to use the /frontend-design skill. Last November, Anthropic published a great design skill. It’s not long, you can read the entire skill’s text here.

This together with a design system makes things that look way better. This is Claude Code using the frontend skill and existing components together. (Btw, this skill can be used in Cursor just as well - it’s just a text file with instructions).

Beyond that, making something great is very much the timeless design process. Together with Aman Khan, Eric covers this in depth on this process and designing with AI in their workshop, Claude Code for PMs, which has a cohort starting in 11 days.

Iterating on the design, section by section

It built the hero section and asked what I thought. I didn’t like the typography - Claude Code picks that same font a lot. Maxim was sitting next to me and agreed it was weird. So I told it what I wanted instead.

This continued section by section. It mostly knocked them out of the park, with only minor babysitting. The tweaks and time invest were mostly for capturing my taste preferences, not “you made an obvious mistake I have to fix.”

Closing feedback loops

One thing that made this work well: Claude Code (in the Claude desktop app) as well as Cursor both take screenshots of what it built and look at them. The agents can close their own feedback loop.

This is one of the most powerful things that’s happened with coding agents. When an agent can close a feedback loop, whether that’s unit tests, API endpoints, logs, or looking at its own screenshots, it becomes much more autonomous.

If you remember the early days of vibe coding, every error you had to copy-paste in. You had to tell it what it did wrong. You had to close the loop for it. Now it closes many of those loops itself.

Learning along the way

There were little bits of cool functionality I couldn’t wrap my head around. So I’d just ask: “by the way, how’d you do that?” Any question that came to mind. I turned those moments into learning opportunities and had it teach me.

I guess that’s another instance where the bottleneck is me keeping up with AI.

Deploying

Let's deploy this to Vercel. It should also appear on looksfamiliar.org.

To make this work, you can either install the Vercel MCP or CLI. They’re both the same idea: an interface for an agent to directly control Vercel and take care of deployments instead of you having to click around on their website.

That was hard work. The best kind.

This is a static landing page. One page. No backend. No database. And it still took me real focus across multiple sessions.

I think as an industry we’ve temporarily regressed. We’ve replaced outcomes with outputs and inputs. We’re valuing how quickly something took over what goal it had and whether it achieved that goal.

This shit is hard, and there are a lot of people with incentives to show you that it’s easy and magical. When you see those demos, it’s worth asking:

• How high are the stakes?

• Are those real things?

• Are they showing the full picture?

• Have those outputs achieved outcomes?

Landing pages are deceptively hard, even with AI

They take customer intuition, customer context, customer conversations, knowledge of storytelling, and knowing what your customers’ objections are.

The effort that went into this landing page started long before the process I wrote about here. It’s all the effort that came before it: we had a prototype (my previous blog post and all your sharp comments) and a validation process (dozens of one-on-one onboarding conversations that we transcribed).

AI is amazing, and I couldn’t completely delegate this

It still required a lot of brain energy and thoughtfulness and attention and focus and blocking off my calendar and getting into flow. I can’t just tell it “go do it” like a VP of marketing who has all the context. But it definitely let me do what I feel is a really good job in a really short amount of time.

Vibe coding a landing page with AI did not feel like a magic genie. I’d describe it best as a pair programmer partner. Like pairing, I came out of this mentally exhausted in the best way possible.

For most strategic tasks, AI remains in the “amazing pairing partner” category. It’s exciting to watch it move into the “teammate I can delegate with my eyes closed.”

Every time I let AI run loose, I got slop. Every time I kept it tight - one section, one question, react, adjust - the output was good.

I’m ridiculously appreciative even for that. The outcome is way better, it still took way less time than ever before. Check out the result: https://www.looksfamiliar.org/

If you got this far and have feedback on what sucks/needs to be clearer/confused you - hit reply. It goes to my personal gmail.