NotesMaking Tools

I Tidied the Landing Page Until It Could Have Been Anyone's

The front page I built with AI had everything a site is supposed to have. It was calm, it was clear, and if you covered the logo you could not tell whose it was. What I think caused that, and what I changed when I rebuilt it.

Making Tools Build Note

この記事を日本語で読む

Side-by-side screenshots of the Legacy Tools front page — the desaturated old centred hero on the left, and the rebuilt hero on the right with the headline next to a live input demo

I rebuilt the Legacy Tools front page. Not because I wanted more motion or more decoration, but because I kept looking at the finished version and wondering whether it was actually ours.

The brief was not the problem

What I had asked for was a page that felt calm and trustworthy, that explained the tools clearly, and that did not push. Consistent design across the products. A clear statement that everything runs locally and nothing is sent anywhere.

I still think that brief was right. And the page delivered on it: a hero, product cards, a shared privacy stance, the concept, Notes, News. Everything a site is supposed to have was there.

Cover the logo and it could be anyone

The trouble surfaced slowly, over several passes of looking at it.

Cover the logo and I could not tell whose site it was. Swap the product names and it would work just as well for some other SaaS. The product cards sat in an even grid, all the same weight, so nothing was more important than anything else. Safe. Simple. Runs locally. All true, and all words that appear on a thousand other pages.

The moment any of these tools is actually useful never appeared on screen. Neither did any sign of who was making them, or why. It was tidy, and it left nothing behind.

Being understated was not the issue. I had set out to build a quiet site and had ended up with a site with no visible judgment in it.

The AI met the brief exactly

I built the site with AI, and I do not think the outcome was the AI's fault.

It met the conditions I gave it, cleanly. What went wrong was on the accepting side. I kept approving proposals because they were clear, because they held together, because they were safe, because I had seen that layout many times and it felt reliable. Approve on those grounds enough times and what survives is the general answer — the thing AI is genuinely good at producing.

It is less that the model had no character and more that I never handed over the specific material only I had, and never pushed back hard enough on what came out.

It was written down, but it was not on screen

The tools I build all sit at the same kind of moment.

Just before you paste something into an AI chat. Just before you hit send on an email. Just before you attach a photo or a document. Just before you open a link inside a message. Just before you confirm something late at night, when you are tired.

The point is not to decide on your behalf, and not to block you. It is to make it possible to stop once, right before the decision.

That was written on the old site, in plain sentences. But you had to read it. Looking at the page did not get you there, and reading and seeing turned out to be different things.

Starting from what the visitor does, not what the page says

I did not start the rebuild by making things louder. Adding motion does not restore specificity on its own, and "impressive" is just another generic answer.

What I decided first was what a visitor should experience on the page. The line at the centre of it is: stop once, before you send.

From there I dropped the structure that opens with product names and feature lists, and rebuilt it so it opens with the moments where people actually get stuck.

The main changes:

  • A working detection demo in the hero. You type, it flags what it finds, you confirm, you can mask it — all in the page, without reading anything first. The page states plainly that this is a mock, not the extension itself
  • A tool room you switch between, instead of six cards side by side. It reads as one family of tools rather than a catalogue
  • Action, Decision and Data flow listed for every tool, in the same shape, so you can compare what each one does, who makes the call, and where the data goes
  • Instead of writing "this is safe", the page tells you to keep the Network tab of your developer tools open while you use it and see that nothing is recorded — plus a link to the transparency page

I did add scroll-driven reveals and transitions. They are not there as decoration. They exist to show that there is an order to input and confirmation, that the tools are distinct, and where to look next. A still image struggles to convey a moment of use.

What stayed

Rebuilding did not mean discarding what was there before.

The concept of tools meant to be handed down. Never making the final call for you. Never sending your text or files anywhere. Never holding your data. Writing up the decisions and the failures in Notes.

I did not remove the old thinking. I moved it out of the prose and into something you can check on screen.

What I got wrong

Not "I let AI build a website". That is not the lesson I take from this.

I never gave it enough of the material only I had. I did not question proposals because they arrived neatly finished. I read familiarity as reassurance. I tried to carry the thinking behind the products in sentences alone. I showed what the tools do without ever showing the moment you would reach for one.

Not using AI is not the fix. I will keep using it for implementation, comparison, structuring, prototypes. But what to show, what to cut, and where to refuse the general answer — those had to come from me.

What I rebuilt was not only the look of the front page. Tidy and ours are not the same thing, and in my case I had confused the two.

That is as far as I can go for now. I have not measured whether any of this worked. I will leave it a while and look again.

Tags: website・AI・design

← All notes