feat: rebuild mintel.me as a single-page freelance site

The site now presents one freelance developer on one page: hero, introduction,
four typical cases (developer for a product, make an app reliable, automate a
process, a website) with what you get, how it runs and what it costs, a
process automation section, technology and project fit, how I work, two live
references, questions and contact.

- Hero and closing headline are drawn from running binary digits.
- Each case explains its four steps with an animated drawing; the automation
  section shows example workflows with work travelling between systems; a
  pipeline run shows what a test catches before a release.
- Contact is one email address, kept in parts and assembled in the browser so
  it never appears in the page source (src/domain/email.ts, spec first).
- Imprint and privacy pages added.
- The old site (blog, case studies, contact form, fixed-price pages, video
  rendering and related scripts) is removed. Its URLs redirect to the homepage.
- The deploy smoke test checks the legal pages and the redirects instead of
  the removed case study.
- Dev scripts use docker compose v2.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
2026-10-03 22:33:06 +02:00
co-authored by Claude Opus 5.5
parent 4eb663f42a
commit fa40fefe2f
781 changed files with 4925 additions and 55137 deletions
+33 -27
View File
@@ -5,13 +5,18 @@ books a 20-minute intro call within 2 minutes. Low sales overhead, more bookable
## 1. Positioning
**The senior engineer who makes AI-built software dependable.**
**The senior developer who builds web apps and websites that keep working.**
"Senior engineer for teams that build fast with AI and don't want chaos. Strong in design and frontend, provably clean in architecture and tests. Remote, booked in weekly capacity blocks."
"Senior developer for web apps, interfaces and websites. You talk to me directly, you see progress every week, and what I build holds up when it grows."
- Headline candidate: "AI makes code cheap. I make it correct."
- Do not say: "everything", "fullstack for anyone", "vibe coding". Web3 is one specialty, not the identity.
- Language: English primary (international and Web3 clients), German route `/de` for DACH.
### Copy rules for everything a client can read (owner decision)
- **Never mention AI as my own tool.** How I work is none of the client's business: no "AI-built", "AI-accelerated", "AI-code rescue", no FAQ about AI tools. The one exception is the automation service, where AI steps are part of what the client gets (sorting, summarising, reading documents).
- **Modest and factual.** No promises I have not made (response times, weekly updates, start dates, search ranking). Only state what the owner confirmed. No superlatives.
- **No internal method vocabulary** on client-facing pages: no specs, TDD, mutation testing, coverage, pull requests. Translate into what the client gets: changes do not break things, a written update every week, predictable cost. Technical detail belongs on `/process` and `/notes`, for engineers.
- Do not say: "everything", "fullstack for anyone", "vibe coding". No location or tax talk; say "remote, available during European business hours".
- Pick the visitor up: introduce me first, then let them choose their need (developer for a product, make an app reliable, just a website), then explain for that need what they get, how it runs, what it costs.
- Language: English primary, German route `/de` for DACH.
### Audiences (priority order)
@@ -35,40 +40,41 @@ Site treatment:
- A downloadable sample delivery report.
- Evidence uses measured numbers only. Never claim: "100% coverage" (flash-loans measures 87.5%), "property-tested" (none found), or mutation scores that have not been run in full.
## 3. Site structure (4 items)
## 3. Site structure (owner decision: one page)
`Notes · Process · About · Book`
Everything is on the homepage. The header has the logo and one button ("Get in touch") that jumps to the contact section. Contact is the address hello@mintel.me: the owner rejected a calendar integration as unnecessary. No `/about`, `/process`, `/notes` or `/book`.
1. **/** Hero (headline, availability line, CTA) -> proof strip (key numbers, live references) -> How I ship -> offers and blocks -> stack -> CTA.
2. **/notes** Evergreen engineering write-ups, no client projects, no strategy IP. Candidates: the gate pipeline (spec, mutation, coverage ratchet), functional core and imperative shell (from the liquidation system), concept-to-code mapping (from the trading engine). Each with a diagram.
3. **/process** How I ship and the sample report.
4. **/about** Short story: 15 years in web (apprenticeship 2011), senior roles, frontend team lead at an agency, remote since 2021, own product business. 3-4 employer names at most, full CV as PDF. Be honest about the path: Vue/JS roots, today TypeScript, Rust, Solidity.
5. **/book** Cal.com embed, 20-minute intro call, email plus project description required.
1. **Hero:** headline "WEB APPS / & WEBSITES." (says what I do; "Ship fast. Break nothing." was rejected as unclear), availability, one button.
2. **Hello:** portrait fading out of a dark surface with the introduction set over it, then the career line.
3. **Services, four typical cases:** developer for a product, make an app reliable, automate a process, just a website. Each case explains what you get, how it runs (four steps with an animated drawing each), what it costs.
4. **Technology:** which projects I am right for (good fit / also possible / not my field), what I work with, and an illustrated explanation of why I test my work (no code).
5. **Working with me:** one contact (diagram) and four plain principles.
6. **My work:** live previews of klz-cables.com and e-tib.com (both cleared by the owner).
7. **Questions**, then the closing call to action.
References: one line on the homepage with live links (klz-cables.com, e-tib.com), no case-study pages. Naming both clients is cleared by the owner.
Remove: `/websites` page, the fixed-price configurator, RevenueLossCalculator, SMB-focused copy. Keep `/blog` out of the nav.
The old site (`/blog`, `/case-studies`, `/contact`, `/websites`, `/technologies`, `/tags`) is deleted, together with its content, tooling and the code only it used. Its URLs redirect to `/`. Legal pages: `/imprint` and `/privacy` (owner details taken from the old terms document; the privacy text is a draft from what the code actually processes and has not been checked by a lawyer).
## 4. Design
- Dark, technical, one accent color (green), mono for technical elements, Inter for body.
- Keep the binary/blueprint idea from the current site as a very quiet background (reuse `BinaryStream`, `AbstractCircuit`).
- The delivery report block as a terminal-style card in the first screen is the centerpiece.
- Availability line fed by one constant (next free block, hours per week). Reuse `Availability.tsx`.
- Mockup of the hero was shown in chat; text/numbers in it are placeholders.
- Light, the original look of the site: white, oversized type, binary texture, one accent (the yellow marker).
- The hero headline is built from running binary digits ("SHIP FAST. / BREAK NOTHING."). The owner approved it: do not change the hero design.
- One left axis for logo, navigation and content. No sidebars. Few sections, each with one job.
- Availability line fed by one constant, shown in the hero, the sticky booking bar and the closing section.
## 5. Offers and pricing
### Capacity blocks (main offer)
### Pricing per case (owner decision: hour packages like 15 vs 20 h are meaningless to buyers)
| Block | Per week | Per month | Rate |
| :-------- | :------- | :-------- | :----------------------------- |
| Focus | 15 h | 60 h | 100 EUR/h -> 6,000 EUR |
| Half-time | 20 h | 80 h | 100 EUR/h -> 8,000 EUR |
| Full-time | 35-40 h | 140-160 h | 100 EUR/h -> 14,000-16,000 EUR |
| Case | Model | Shown on the site |
| :---------------------- | :----------------------------------- | :---------------------------------------------------------------------------------------------- |
| Developer for a product | By effort, on agreed days per week | 100 EUR/hour, 800 EUR/day, net; two weeks notice to month end |
| Make an app reliable | Fixed week | 3,500 EUR for 35 hours (derived from the rate, not yet confirmed) |
| Automate a process | Estimate, then a budget | 100 EUR/hour; no price before the process has been seen |
| Website | Estimate, then a budget (contingent) | from 3,800 EUR; extras at 100 EUR/hour; monthly fee for hosting agreed up front (no amount yet) |
Rate: 100 EUR/h, decided. DACH freelancer average is about 103 EUR/h (freelancermap Freelancer-Kompass 2026), senior developers list 85-120 EUR/h. Raise it for new clients once blocks are booked out for 4+ weeks. Show monthly block prices on the site, not the hourly rate. 2-week notice, simple SOW, transparent time tracking.
The hourly rate is public now. Rate: 100 EUR/h. DACH freelancer average is about 103 EUR/h (freelancermap Freelancer-Kompass 2026).
### Entry offer: AI-code rescue (1 week, 35 h)
### Entry offer: make an app reliable (1 week, 35 h; internal name "rescue")
Audit of an AI-built codebase, test foundation, mutation baseline, prioritized report. Easy to buy, converts into a block.