From 5668bfad3f6eb246c68540709c97ed0269167a51 Mon Sep 17 00:00:00 2001 From: rogalik27 Date: Tue, 23 Jun 2026 10:14:15 +0200 Subject: [PATCH] Phase 1: tier demo landing pages, CRM schema, playbooks - templates/landing: two self-contained demos (Tier A barbershop / Google stack, Tier B physio / self-hosted) + chooser page - sheets/SCHEMA.md: Google Sheets CRM workbook spec - playbooks: per-client setup checklists for both tiers - README + .gitignore - Demos avoid unverifiable claims (no "DSGVO-konform", no "Ende-zu-Ende") Co-Authored-By: Claude Opus 4.8 --- .gitignore | 20 ++ README.md | 68 +++++ playbooks/tier-a-google.md | 31 +++ playbooks/tier-b-selfhosted.md | 33 +++ sheets/SCHEMA.md | 63 +++++ templates/landing/demo-tier-a/index.html | 284 ++++++++++++++++++++ templates/landing/demo-tier-b/index.html | 323 +++++++++++++++++++++++ templates/landing/index.html | 43 +++ 8 files changed, 865 insertions(+) create mode 100644 .gitignore create mode 100644 README.md create mode 100644 playbooks/tier-a-google.md create mode 100644 playbooks/tier-b-selfhosted.md create mode 100644 sheets/SCHEMA.md create mode 100644 templates/landing/demo-tier-a/index.html create mode 100644 templates/landing/demo-tier-b/index.html create mode 100644 templates/landing/index.html diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..98b8302 --- /dev/null +++ b/.gitignore @@ -0,0 +1,20 @@ +# dependencies / build +node_modules/ +dist/ +.astro/ +*.log + +# secrets — never commit credentials +.env +.env.* +*.secret +credentials/ +stacks/**/.env + +# n8n local data +n8n/.n8n/ +n8n/*-credentials.json + +# OS +.DS_Store +Thumbs.db diff --git a/README.md b/README.md new file mode 100644 index 0000000..4522e5d --- /dev/null +++ b/README.md @@ -0,0 +1,68 @@ +# smb-online — "Get Your Small Business Online" + +A productized service that gets local small businesses online: **landing page + online booking + +online reception + small automations**. Built to be **thoroughly tracked and logged** — every +client, lead, booking and invoice lives in a Google Sheets CRM, driven by **n8n** on the homelab. + +> Full plan: `~/.claude/plans/pitch-me-some-ideas-breezy-swing.md` + +## Two delivery tiers + +| | **Tier A — Google stack** | **Tier B — Self-hosted / privacy** | +|---|---|---| +| For | casual businesses, no data-residency concern | privacy-sensitive (health, legal, tax) | +| Site | static page / Google Sites | static page (Astro) on free host | +| Booking | Google Calendar Appointment Schedule | self-hosted Cal.com | +| Lead capture | Google Forms | self-hosted form → n8n | +| Reception | Gmail | self-hosted + AI receptionist | +| Infra cost | ≈ €0 | small (homelab + domain) | + +Both tiers feed the **same Google Sheets CRM** via n8n webhooks. + +## Repository layout + +``` +templates/landing/ Reusable landing-page template + the two tier demos + demo-tier-a/ Tier A demo — "Schnittpunkt" barbershop (Google stack) + demo-tier-b/ Tier B demo — "PhysioVital" physio practice (self-hosted/privacy) +sheets/SCHEMA.md Google Sheets CRM workbook spec (tabs + columns) +n8n/ Exported n8n workflow JSON (lead-intake, booking-sync, renewals, …) +stacks/selfhosted/ docker-compose for Tier-B services (Cal.com, Vaultwarden, lead form) +playbooks/ Per-client setup checklists (tier-a-google.md, tier-b-selfhosted.md) +``` + +## View the demos + +They are self-contained HTML — open directly: + +```bash +xdg-open templates/landing/demo-tier-a/index.html # barbershop / Google stack +xdg-open templates/landing/demo-tier-b/index.html # physio practice / self-hosted +``` + +Or serve both with a chooser page: + +```bash +python3 -m http.server 8080 --directory templates/landing +# → http://localhost:8080/ (links to both demos) +``` + +Forms and booking are **stubbed** until Phase 4 wires them to the n8n webhooks. + +## Phases (status) + +- [x] **Phase 1** — Two demo landing pages (this commit) +- [ ] **Phase 2** — Accounts & setup: fresh Google account → connect Drive MCP → master workbook; + secure n8n; bind Google creds; Vaultwarden; domain +- [ ] **Phase 3** — CRM workbook + n8n lead-intake & renewal workflows + Looker Studio dashboard +- [ ] **Phase 4** — Wire demo forms/booking to n8n webhooks (live end-to-end proof) +- [ ] **Phase 5** — First real client + reception v1 +- [ ] **Phase 6** — AI receptionist (Claude Haiku 4.5) + +## ⚠️ Before going live (legal — not legal advice) + +Operator is in an Ausbildung as Cloud Engineer at NETWAYS. This offering deliberately **stays out +of NETWAYS's lane** (no managed cloud hosting / monitoring / OpenStack/K8s hosting for clients). +Before taking paying clients: (1) check the Ausbildungsvertrag for a `Nebentätigkeit` clause and +get **written employer approval** if required; (2) `Gewerbeanmeldung` + Kleinunternehmerregelung +(§19 UStG) once revenue starts; (3) confirm with the IHK / a Steuerberater if unsure. diff --git a/playbooks/tier-a-google.md b/playbooks/tier-a-google.md new file mode 100644 index 0000000..b6aa277 --- /dev/null +++ b/playbooks/tier-a-google.md @@ -0,0 +1,31 @@ +# Playbook — Tier A (Google stack) + +For casual businesses with no data-residency concern. Infra cost ≈ €0. You charge for setup + +ongoing management. Target build time: ~half a day per client. + +## When to pick Tier A +- Barber, café, salon, food truck, small retail, trades — public-facing, no sensitive data. +- Client wants cheapest option and is fine with Google handling data. + +## Setup checklist +1. **Client Google account** — create a fresh free Google account for the client (or use theirs). +2. **Landing page** — clone `templates/landing/demo-tier-a/`, rebrand (name, colours, copy, + services, hours, photos). Deploy to a free always-on static host (e.g. Cloudflare Pages). +3. **Domain** — connect the client's domain (or a `.de` you register and bill through). +4. **Booking** — set up Google Calendar **Appointment Schedule**; embed the booking link/button + on the page (replace the demo booking card). +5. **Lead capture** — create a Google Form *or* point the page form at the n8n lead webhook + (preferred — so leads land in the CRM, not just Google). +6. **Reception** — Gmail for the business; set a signature + canned replies. +7. **Google Business Profile** — claim/verify so they show up on Maps & Search. +8. **CRM** — add a `Clients` row (tier = A, services, monthly_fee, renewal_date, vault_ref). +9. **Handover** — share logins via Vaultwarden; record only the `vault_ref` in the sheet. + +## What to charge (suggestion) +- One-off setup: €250–600 depending on pages/content. +- Monthly management (updates, hosting oversight, booking support): €20–40. + +## Recurring tasks (automated by n8n where possible) +- Renewal reminder (from `renewal_date`). +- Monthly "anything to update?" nudge. +- Lead notifications to the owner. diff --git a/playbooks/tier-b-selfhosted.md b/playbooks/tier-b-selfhosted.md new file mode 100644 index 0000000..211ebbe --- /dev/null +++ b/playbooks/tier-b-selfhosted.md @@ -0,0 +1,33 @@ +# Playbook — Tier B (self-hosted / privacy) + +For privacy-sensitive businesses (physio, medical, legal, tax, therapy). Data stays on +German-hosted infrastructure. You charge a privacy/hosting premium. Target build time: ~1–2 days. + +## When to pick Tier B +- Handles health, legal or financial personal data → GDPR sensitivity is a selling point. +- Client explicitly wants control over where data lives / no third-party tracking. + +## Setup checklist +1. **Landing page** — clone `templates/landing/demo-tier-b/`, rebrand. Keep the privacy band and + "Daten in Deutschland" badges. Deploy to a free static host or the homelab behind HTTPS. +2. **Domain + TLS** — connect domain; ensure valid certificate (Caddy/Let's Encrypt). +3. **Booking** — deploy **self-hosted Cal.com** (see `stacks/selfhosted/docker-compose.yml`); + create the practice's event types; embed it (replace the demo Cal.com card). +4. **Lead form** — self-hosted form endpoint → n8n webhook → CRM. No third-party form service. +5. **Reception** — business mailbox; (later) the **AI receptionist** widget (Phase 6, Claude + Haiku 4.5) wired to the booking + FAQ. +6. **Credentials** — store all client logins in **Vaultwarden**; sheet holds only `vault_ref`. +7. **CRM** — add a `Clients` row (tier = B, services, monthly_fee, renewal_date, vault_ref). +8. **Backups** — ensure the Tier-B services + CRM are in the daily backup job. + +## Hosting note (NETWAYS boundary) +Keep this as **"I host a small website + booking for you,"** not managed cloud/monitoring. Use +cheap shared/managed infra or the homelab for low-traffic client sites — do not position it as a +managed-cloud/Kubernetes/monitoring service (that is NETWAYS's lane). + +## What to charge (suggestion) +- One-off setup: €600–1,500 (self-hosted booking + privacy setup is worth more). +- Monthly hosting + management: €40–90 (covers infra, updates, backups, support). + +## Recurring tasks +- Renewal reminder, Cal.com/booking sync to CRM, backup verification, security updates. diff --git a/sheets/SCHEMA.md b/sheets/SCHEMA.md new file mode 100644 index 0000000..e83d903 --- /dev/null +++ b/sheets/SCHEMA.md @@ -0,0 +1,63 @@ +# Master CRM — Google Sheets workbook spec + +One Google Sheets workbook = the whole CRM + log. I create/maintain this via the Google Drive MCP +once the fresh project Google account exists (Phase 2). n8n reads/writes it via the Sheets node. + +Workbook name: **`SMB-Online — CRM`**. One tab per concern below. Row 1 = headers (exact column +names matter — n8n maps by header). + +## Tab: `Clients` +The client list/table — the heart of the tracking requirement. + +| Column | Type | Notes | +|---|---|---| +| `client_id` | text | e.g. `C-0001` (stable key) | +| `business_name` | text | | +| `owner_name` | text | | +| `email` | text | | +| `phone` | text | | +| `niche` | text | barber, physio, café, … | +| `tier` | A \| B | delivery tier | +| `status` | enum | `lead` → `onboarding` → `active` → `paused` → `churned` | +| `domain` | text | live site URL | +| `stack_notes` | text | hosting, booking tool, etc. | +| `vault_ref` | text | **pointer** to Vaultwarden item — never a password | +| `services` | text | comma list: site, booking, reception, … | +| `billing_cycle` | enum | monthly / yearly / one-off | +| `monthly_fee_eur` | number | | +| `start_date` | date | | +| `renewal_date` | date | drives the renewal-reminder workflow | +| `created_at` | datetime | | +| `notes` | text | | + +## Tab: `Leads` +Every inbound lead across all client sites (and your own). + +`lead_id` · `received_at` · `client_id` · `source` (which site/form) · `name` · `contact` · +`service_interest` · `message` · `status` (new / contacted / won / lost) · `notified` (bool) + +## Tab: `Bookings` +Every appointment booked across client sites. + +`booking_id` · `created_at` · `client_id` · `customer_name` · `customer_contact` · `service` · +`start_time` · `end_time` · `source` (gcal / calcom) · `status` (confirmed / cancelled / no-show) + +## Tab: `Projects` +Per-client deliverable tracking. + +`project_id` · `client_id` · `deliverable` · `tier` · `checklist` (e.g. `domain✓ page✓ booking☐`) · +`go_live_date` · `status` (todo / in-progress / live) + +## Tab: `Invoices` +`invoice_id` · `client_id` · `issued_date` · `due_date` · `amount_eur` · `period` · +`status` (draft / sent / paid / overdue) · `paid_date` + +## Tab: `Activity Log` +Append-only audit trail — **every automated action writes one row here.** + +`ts` · `workflow` (lead-intake / booking-sync / renewal / onboarding / invoice) · `client_id` · +`action` · `detail` · `result` (ok / error) + +## Dashboard +Not a tab — a **Looker Studio** report wired to this workbook: pipeline by `status`, MRR +(sum of `monthly_fee_eur` where `status=active`), renewals due in next 30 days, recent leads. diff --git a/templates/landing/demo-tier-a/index.html b/templates/landing/demo-tier-a/index.html new file mode 100644 index 0000000..2f083fa --- /dev/null +++ b/templates/landing/demo-tier-a/index.html @@ -0,0 +1,284 @@ + + + + + + Schnittpunkt — Barbershop Nürnberg | Termin online buchen + + + + + + + +
Demo · Tier A (Google-Stack) — Beispielseite für Kund:innen · Formular & Buchung noch nicht aktiv
+ + + +
+ +
+
+ Barbershop · Nürnberg Altstadt +

Sauberer Schnitt.
Echtes Handwerk.

+

Klassische Herrenschnitte, Bartpflege und die heiße Rasur — von Profis, die ihr Handwerk lieben. Buch deinen Termin in 30 Sekunden.

+ +
+ 4,9 · 320+ Bewertungen + ✂ Seit 2014 + 📍 Königstraße 1, Nürnberg +
+
+
+ + +
+
+
+ Leistungen +

Was wir am besten können

+

Faire Preise, keine Überraschungen. Jeder Termin inklusive Beratung und einem Getränk aufs Haus.

+
+
+
✂️

Herrenschnitt

Waschen, Schnitt, Styling — individuell auf deinen Typ abgestimmt.

ab 29 €
+
🧔

Bartpflege

Konturieren, trimmen und pflegen für den perfekten Bart.

ab 19 €
+
🪒

Heiße Rasur

Klassische Nassrasur mit heißen Tüchern. Pure Entspannung.

ab 25 €
+
👦

Kids Cut

Entspannter Schnitt für die Kleinen — bis 12 Jahre.

ab 17 €
+
+
+
+ + +
+
+
+ Termin buchen +

Wähl deinen Slot.
Den Rest machen wir.

+
    +
  • Sofortige Bestätigung per E-Mail
  • +
  • Automatische Erinnerung am Vortag
  • +
  • Kostenlos umbuchen bis 24 Std. vorher
  • +
+ + Verfügbare Zeiten ansehen → +
+
+
Google Kalender · Terminplan — Heute, 23. Juni
+
+
09:00
+
10:30
+
11:15
+
13:00
+
14:30
+
15:45
+
16:30
+
17:15
+
18:00
+
+

Demo-Vorschau. In der Live-Version wird hier der echte Google-Kalender-Terminplan eingebettet.

+
+
+
+ + +
+
+
+ Über uns +

Drei Stühle, ein Anspruch: gute Arbeit.

+

Seit 2014 schneiden wir in der Nürnberger Altstadt. Kein Schnickschnack, keine Wartezeiten dank Online-Termin — einfach ein Ort, an dem du dich auf einen sauberen Schnitt verlassen kannst. Komm vorbei, bleib auf einen Kaffee.

+
+
+ Öffnungszeiten + + + + +
Montag – Freitag09:00 – 19:00
Samstag09:00 – 16:00
Sonntaggeschlossen
+

📍 Königstraße 1, 90402 Nürnberg

+
+
+
+ + +
+
+
+ Kontakt +

Frage stellen oder Rückruf anfordern

+

Schreib uns kurz — wir melden uns am selben Tag.

+
+ +
+
+
+
+ +
+
+ +
✓ Danke! Demo-Formular — in der Live-Version landet deine Anfrage automatisch im CRM.
+

Mit dem Absenden stimmst du der Verarbeitung deiner Angaben zur Kontaktaufnahme zu.

+
+
+
+
+ +
+
+
+
SCHNITTPUNKT
+

Königstraße 1 · 90402 Nürnberg

+
+
+

Öffnungszeiten

+

Mo–Fr 09–19 · Sa 09–16

+
+
+

Kontakt

+

0911 000000 · hallo@schnittpunkt-nbg.de

+
+
+
© 2026 Schnittpunkt Barbershop · Demo-Seite · Impressum · Datenschutz
+
+ + diff --git a/templates/landing/demo-tier-b/index.html b/templates/landing/demo-tier-b/index.html new file mode 100644 index 0000000..3ab6275 --- /dev/null +++ b/templates/landing/demo-tier-b/index.html @@ -0,0 +1,323 @@ + + + + + + PhysioVital — Praxis für Physiotherapie | Termin online buchen + + + + + + + +
Demo · Tier B (Self-Hosted / Datenschutz) — Beispielseite · Buchung, Formular & KI-Assistent noch nicht aktiv
+ + + +
+ +
+
+
+ Praxis für Physiotherapie · Erlangen +

Beweglich bleiben.
Schmerzfrei leben.

+

Physiotherapie, Manuelle Therapie und Krankengymnastik — individuell, evidenzbasiert und mit Zeit für Sie. Termine online, ganz ohne Wartezeit am Telefon.

+ +
+ 🔒 Daten in Deutschland gehostet + Alle Kassen & privat + ⭐ 4,9 / 5 +
+
+ +
+
+ + +
+
+
+ Leistungen +

Therapie, die zu Ihnen passt

+

Von der akuten Verletzung bis zur langfristigen Prävention — wir begleiten Sie auf dem ganzen Weg.

+
+
+
🖐️

Manuelle Therapie

Gezielte Mobilisation von Gelenken und Muskulatur bei Bewegungseinschränkungen.

+
🏃

Krankengymnastik

Aktive Übungstherapie zur Wiederherstellung von Kraft, Stabilität und Beweglichkeit.

+
💆

Massage & Lymphdrainage

Lösen von Verspannungen und Förderung des Lymphabflusses nach OPs oder Verletzungen.

+
🧘

Prävention

Rückenschule und Trainingsberatung, damit Beschwerden gar nicht erst entstehen.

+
+
+
+ + +
+
+
🛡️
+
+ Datenschutz by Design +

Ihre Gesundheitsdaten bleiben in Deutschland.

+

Buchungen, Kontaktanfragen und Patientendaten laufen über unsere eigene, in Deutschland gehostete Infrastruktur — keine Weitergabe an Werbenetzwerke, kein Tracking durch Dritte. Verschlüsselt übertragen, vom ersten Klick an.

+
+ 🇩🇪 Hosting in Deutschland + 🔐 Verschlüsselte Übertragung (TLS) + 🍪 Keine Cookies von Dritten + 🚫 Kein Drittanbieter-Tracking +
+
+
+
+ + +
+
+
+ Termin buchen +

In drei Klicks zum Termin.

+

Wählen Sie Behandlung, Tag und Uhrzeit — Sie erhalten sofort eine verschlüsselte Bestätigung. Erinnerung folgt automatisch, Umbuchung jederzeit möglich.

+

Self-hosted Buchung — läuft in der Live-Version über Ihre eigene Cal.com-Instanz auf der Praxis-Infrastruktur.

+
+ +
+
+
PV
Physiotherapie · 30 Min
PhysioVital Erlangen
+ 🔒 self-hosted +
+
+
+
MoDiMiDoFrSaSo
+
+ 21222324252627 +
+
+
+
08:30
+
11:00
+
15:30
+
16:15
+
+
+
Zeitzone: Europa/Berlin · Demo-Vorschau
+
+
+
+ + +
+
+
+ Kontakt +

Rezept einreichen oder Frage stellen

+

Schreiben Sie uns — wir melden uns zeitnah und vertraulich zurück.

+
+ +
+
+
+
+ +
+
+ + +
✓ Danke! Demo-Formular — in der Live-Version landet Ihre Anfrage verschlüsselt im Praxis-CRM.
+
+
+
+
+ +
+
+
+
PhysioVital
+

Hauptstraße 12 · 91054 Erlangen

+
+

Sprechzeiten

Mo–Fr 08–19 Uhr

+

Kontakt

09131 000000 · praxis@physiovital-er.de

+
+
© 2026 PhysioVital · Demo-Seite · 🇩🇪 Daten in Deutschland · Impressum · Datenschutz
+
+ + + +
+
Online-RezeptionMeist sofort eine Antwort
+
+
Hallo! 👋 Ich bin die digitale Rezeption von PhysioVital. Wie kann ich helfen?
+
Habt ihr diese Woche noch einen Termin frei?
+
Ja — am Mittwoch um 11:00 oder 15:30. Soll ich einen davon für Sie vormerken?
+
+
+
Demo — in der Live-Version KI-gestützt (Claude)
+
+ + diff --git a/templates/landing/index.html b/templates/landing/index.html new file mode 100644 index 0000000..4a77ee1 --- /dev/null +++ b/templates/landing/index.html @@ -0,0 +1,43 @@ + + + + + + smb-online — Demo-Auswahl + + + + + +