01Goal and market
Think first, then build.
What should the site achieve, and for whom? If the goal is given, it sharpens it. If not, it looks for an opportunity in real search data: what are many people searching for that nobody answers well yet? Its formula: proven search demand × weak competition × something that can be built.
- It pulls search volumes and results from DataForSEO.
- It spots weak search results: forums at the top, outdated pages, articles where people want a tool.
- Can an AI answer cover the question completely? Then it makes it interactive or drops the idea.
02Promise and structure
One sentence that clicks at once.
It sums up the core in a single sentence and tests it: does someone grasp at a glance what this is and why it matters? Then it picks the type of site (a tool, a marketing site, a content site or a directory), the pages and the path to the action that counts.
- For a tool: value within ten seconds, no account needed.
- One clear main action per section.
03Style frame
The design is fixed before the first line of code.
Typography, a colour ladder, a fixed spacing scale, corners, shadows and motion curves become tokens: fixed building blocks that everything else comes from. And it chooses one signature moment. Restraint is the premium signal: one moment that sticks, not twenty effects.
- One or two typefaces, with a deliberate scale.
- Colour in ten to twelve steps, spacing on a 4-pixel grid.
- Every effect serves understanding, orientation or brand feel. Never just because it can.
04Stack
The right tools for this one project.
A content or marketing site is usually built static, for example with Astro and Tailwind: the fastest and the easiest to find. A tool or app gets Next or Vite with React. A simple one-pager stays plain static HTML.
- Static where it can be, on the server where it must be.
- The core content is always real HTML on the page, so search engines and AI crawlers can read it.
05Build
Fully finished, and findable from the first line.
Real copy, never lorem ipsum. Every page and every state: hover, focus, loading, empty, error and a proper 404. It makes its own images and video with the creative tools, inside the style frame. SEO is not an afterthought: titles, descriptions, schema.org, a sitemap, internal links and a share image per page are there from the start.
- Self-hosted typefaces with a proper licence.
- Reduced motion for anyone who asks for it on their device, always built in.
06Test
It looks with its own eyes.
It never trusts its code blindly. It runs the site, takes screenshots on desktop, tablet and phone, at different scroll positions and states, actually looks at them and fixes what it sees. Then come the automated checks and a strict final checklist. At least two rounds of looking and improving.
- No console errors, no dead links.
- Accessibility with axe, speed with Lighthouse.
- Three browser engines, including Safari's.
- An honest self-score: below 8 out of 10, it is not finished.
07Deliver and go live
A working site, not a mockup.
It delivers the complete project folder, with start.bat and start.sh to run the site on your own computer, a README and a DEVELOPMENT.md with the architecture, decisions, known limitations and next steps. So any developer or agent can carry on. Going online happens through Zaela: first a preview, then an Owner or Admin approves the release.
- If it came up with the idea itself, you also get the search data behind the opportunity.
- It also says honestly where the weakest spot is.