Design System
Component Parity Styleguide
Diese Referenz rendert die echten Produktionskomponenten der Startseite. Keine Lookalikes, keine generischen Platzhalter: alle Sections nutzen dieselben Component-Dateien, Klassen, Tokens und Daten wie die Live-Startseite.
Foundations
Tokens, Raster und Breakpoints
Mobile, Tablet und Desktop folgen den echten `.section` Breakpoints.
`--radius`, `--radius-sm`, `--radius-xs` steuern Cards, Buttons und Inputs.
Cards, HeroMedia und Formulare verwenden die zentralen Shadow-Tokens.
Service-, Pricing- und Ressourcen-Grids übernehmen die Startseiten-Breakpoints.
Atoms
Typografie, Buttons, Inputs und Icons
KogNaut
KI nutzen, ohne dein Denken abzugeben.
KogNaut hilft Webdesignerinnen, Kreativen und kleinen Digitaldienstleistern, KI bewusst in Angebot, Content, Website-Audits und Kundenprozesse einzubauen — ohne Stimme, Urteilskraft und Grenzen abzugeben.
Für bewusste KI-Nutzung, die dein Angebot stärkt statt nur mehr Output zu erzeugen.
States
Navigation, Overlays und Utilities
Molecules
Echte Startseiten-Komponenten
ServiceCard
KI Business Audit
Ein nüchterner Blick auf dein Angebot, deine Website, deine Content-Arbeit und deine Kundenprozesse. Danach weißt du, wo KI sinnvoll hilft, wo Tool-Chaos entsteht und welche 30-Tage-Roadmap sich lohnt.
AI Website Content Sprint
Wir übersetzen Positionierung, Angebot, FAQ, SEO/GEO-Fragen und Tonalität in einen prüfbaren KI-Workflow für bessere Website- und Content-Arbeit.
Offer & Process Upgrade
Aus einzelnen KI-Versuchen wird ein klarer Ablauf für Briefing, Angebot, Scope, Feedback, Übergabe und Nachbetreuung — dokumentiert und wiederholbar.
AI Delivery System
Wir bauen dein KI-Arbeitssystem mit Workflows, Vorlagen, Prüfpunkten, Playbook und Exit-Strategie gegen Tool-Abhängigkeit.
FeatureCard
Klären
Welche Aufgabe soll KI wirklich verbessern — und welche Qualität muss erhalten bleiben?
Bauen
Aus einem Use Case wird ein konkreter Workflow mit passenden Prompts und klarer Rollenverteilung.
Prüfen
Quellen, Logik, Tonalität und Qualität werden abgesichert, bevor Ergebnisse weiterverwendet werden.
Erhalten
Wichtige Fähigkeiten bleiben beim Menschen: Urteil, Kontext, Stil und Entscheidungshoheit.
Entkoppeln
Der Prozess funktioniert nicht nur mit einem einzigen Tool. Alternativen und Fallbacks sind Teil des Systems.
BenefitItem
Scheinproduktivität: Du erzeugst mehr Output, aber nicht automatisch bessere Angebote oder bessere Kundenarbeit.
Tool-Abhängigkeit: Wenn ein Tool teurer, schlechter oder geschlossen wird, darf dein Prozess nicht wegbrechen.
Qualitätsverlust: Ohne Prüfpunkte übernehmen sich Fehler, Halbwissen und generische Sprache.
Denk-Outsourcing: Wenn KI jede Vorarbeit übernimmt, trainierst du deine eigene Urteilskraft weniger.
DetailCard
Early-Adopter-Vorteile mitnehmen
Nutze KI dort, wo sie echten Mehrwert bringt — bevor schlechte Gewohnheiten und Tool-Chaos zum Standard werden.
Qualität absichern
Menschliche Prüfpunkte verhindern, dass falsche Quellen, generische Sprache oder schwache Argumente einfach durchrutschen.
Unabhängig bleiben
Workflows, Fallbacks und Tool-Alternativen sorgen dafür, dass dein Prozess nicht an einer Plattform hängt.
Playbook statt Bauchgefühl
Am Ende stehen dokumentierte Abläufe, Prompts, Regeln und Checks, die wiederholbar genutzt werden können.
PackageCard
Bester Einstieg
KI Business Audit
90 MinutenKlarheit über KI-Hebel in Angebot, Website, Content, SEO/GEO und Kundenprozess. Ergebnis: priorisierte 30-Tage-Roadmap.
Option
AI Website Content Sprint
3 StundenEin prüfbarer Workflow für Website-Texte, FAQ, Angebotsseiten, GEO-Fragen und Tonalität.
Option
Offer & Process Upgrade
1–2 TageKI-gestützte Struktur für Briefing, Angebot, Scope, Feedback, Übergabe und Nachbetreuung.
Option
AI Delivery System
4 WochenWorkflows, Vorlagen, Prüfpunkte und ein KogNaut Playbook für ein belastbares KI-Arbeitssystem.
JournalGrid
GEO ohne Blindflug: Wie KI-Antworten dein Angebot wirklich verstehen
KI-Sichtbarkeit funktioniert nicht über Keyword-Hektik, sondern über klare Antworten, belastbare Quellen und Inhalte, die ein System prüfen kann.
KI-SucheKI-Agenten brauchen Grenzen: Was du delegieren kannst und was nicht
Agenten werden erst nützlich, wenn Aufgabe, Datenzugriff, Freigabe und menschliche Entscheidung sauber getrennt sind.
Kontrolle
MCP verstehen: Mehr Kontext für KI, ohne alles freizugeben
Das Model Context Protocol kann KI mit Tools und Daten verbinden. Entscheidend ist nicht der Anschluss, sondern die Grenze.
Tool-Unabhängigkeit
Warum gute KI-Arbeit nicht bei Prompts endet
Prompts helfen beim Start. Wirklich belastbar wird KI-Arbeit erst mit klaren Workflows, Prüfpunkten und Fallbacks.
WorkflowsStepItem & FAQItem
Use Case klären
Workflow bauen
Prüfpunkte definieren
Skill-Erhalt sichern
Tool-Lock-in vermeiden
Ist KogNaut ein KI-Workshop?
Nicht nur. Workshops sind ein Teil davon. Eigentlich geht es um ein KI-Business-System: sinnvolle Workflows, klare Prüfpunkte, bessere Angebote und weniger Tool-Abhängigkeit.
Ist KogNaut nur für Webdesignerinnen?
Nein. Webdesignerinnen und Digitaldienstleister sind der erste Fokus, weil dort die KI-Hebel besonders konkret sind: Website-Texte, SEO/GEO, Briefing, Angebote, Audits und Kundenprozesse.
Brauche ich Vorkenntnisse?
Nein. Ein konkreter Arbeitskontext reicht. Wir arbeiten nicht an Spielzeug-Beispielen, sondern an echten Aufgaben.
Geht es nur um ChatGPT?
Nein. ChatGPT kann Teil davon sein, aber KogNaut ist nicht an ein einzelnes Tool gebunden. Der Prozess ist wichtiger als das Tool.
Ist das anti-KI?
Nein. Im Gegenteil. KogNaut hilft dir, KI besser zu nutzen — aber bewusst, prüfbar und souverän.
Was bedeutet KlarLoop?
KlarLoop ist die Methode hinter KogNaut. Sie sorgt dafür, dass KI-Workflows nicht blind automatisiert werden, sondern mit menschlichen Prüfpunkten, Skill-Erhalt und Tool-Unabhängigkeit funktionieren.
Parity
Startseite ↔ Styleguide
| Startseitenbereich | Komponentenname | Variante | Props/Data | Status |
|---|---|---|---|---|
| Header / Navigation | Navigation | Desktop + Mobile | site.navigation, site.hero.navCta | identisch |
| Hero Section | Hero + HeroMedia | 3 Slides + 01/03 Progress | site.hero, site.hero.slides | identisch |
| KogNaut Prinzip | OutcomeStrip | Band | site.outcomeStrip | identisch |
| Einführung | PraxisProfileSection | Profil + Nutzenliste | site.intro, site.insight, site.benefits | identisch |
| Leistungen | ServicesSection / ServiceCard | 2er Editorial Image Grid | site.services + media assets | identisch |
| Blog | ResourcesPreviewSection / JournalGrid | Home 2x2 · Index 1/2/3 | resourceArticles | identisch |
| Ressourcen & Ablauf | FocusSection / FeatureCard + StepItem | Label Cards + Startprozess | site.builderFeatures.items, site.process | identisch |
| Einblicke | ImageShowcaseSection / Gallery | Bildboxen | site.media.gallery | identisch |
| Angebote | PracticeDetailsSection + PackagesSection + FAQSection | Details, Pakete, FAQ | site.details, site.pricing, site.faq | identisch |
| CTA Band | CTASection | Secondary CTA | site.cta | identisch |
| FAQ | FAQSection / FAQItem | Static list | site.faq | identisch |
| Kontakt | Contact / ContactInfo + Form | Info + Form | site.contact | identisch |
| Footer | Footer | Legal + Noindex | site.project, site.contact, site.legal | identisch |
Sections
Startseiten-Architektur als echte Komponenten
KogNaut
KI nutzen, ohne dein Denken abzugeben.
KogNaut hilft Webdesignerinnen, Kreativen und kleinen Digitaldienstleistern, KI bewusst in Angebot, Content, Website-Audits und Kundenprozesse einzubauen — ohne Stimme, Urteilskraft und Grenzen abzugeben.
Für bewusste KI-Nutzung, die dein Angebot stärkt statt nur mehr Output zu erzeugen.
01KlarheitBewusste KI-Nutzung ohne Blindflug
KogNaut Prinzip
Nicht mehr Tools.
Mehr Klarheit.Problem
KI spart Zeit. Bis sie deine Handschrift verwässert.
Viele Webdesignerinnen und Digitaldienstleister starten mit KI, weil Texte, Recherche, Ideen und Angebote schneller werden. Am Anfang funktioniert das oft erstaunlich gut. Aber genau dort beginnt das Risiko: Wenn Ergebnisse nur noch übernommen werden, werden Positionierung, Tonalität, Qualität und Kundenprozess schnell beliebig.
Mehr KI ist nicht automatisch mehr Power. Bewusstere KI schon.
KogNaut setzt nicht bei Tool-Hype an, sondern bei kognitiver Souveränität: Was darf KI in Briefing, Website-Texten, SEO/GEO, Angeboten und Kundenkommunikation übernehmen? Wo brauchst du Quellen, Checks und klare Grenzen? Das Ziel ist kein Autopilot. Das Ziel ist ein System, das dich schneller macht, ohne deine Expertise zu verwässern.
Scheinproduktivität: Du erzeugst mehr Output, aber nicht automatisch bessere Angebote oder bessere Kundenarbeit.
Tool-Abhängigkeit: Wenn ein Tool teurer, schlechter oder geschlossen wird, darf dein Prozess nicht wegbrechen.
Qualitätsverlust: Ohne Prüfpunkte übernehmen sich Fehler, Halbwissen und generische Sprache.
Denk-Outsourcing: Wenn KI jede Vorarbeit übernimmt, trainierst du deine eigene Urteilskraft weniger.
Damit KI dich schneller macht, aber nicht abhängig.
Angebote
KI-Angebote für Webdesignerinnen & Digitaldienstleister
KI Business Audit
Ein nüchterner Blick auf dein Angebot, deine Website, deine Content-Arbeit und deine Kundenprozesse. Danach weißt du, wo KI sinnvoll hilft, wo Tool-Chaos entsteht und welche 30-Tage-Roadmap sich lohnt.
Audit startenAI Website Content Sprint
Wir übersetzen Positionierung, Angebot, FAQ, SEO/GEO-Fragen und Tonalität in einen prüfbaren KI-Workflow für bessere Website- und Content-Arbeit.
Sprint anfragenOffer & Process Upgrade
Aus einzelnen KI-Versuchen wird ein klarer Ablauf für Briefing, Angebot, Scope, Feedback, Übergabe und Nachbetreuung — dokumentiert und wiederholbar.
Upgrade planenAI Delivery System
Wir bauen dein KI-Arbeitssystem mit Workflows, Vorlagen, Prüfpunkten, Playbook und Exit-Strategie gegen Tool-Abhängigkeit.
System aufbauenKlarLoop Methode
Ein einfacher Ablauf für nachhaltige KI-Adoption.
KlarLoop ist kein Prompt-System und kein Tool-Kurs. Es ist ein Arbeitsprinzip für bewusste KI: KI unterstützt, aber der Mensch bleibt im Loop.
Klären
Welche Aufgabe soll KI wirklich verbessern — und welche Qualität muss erhalten bleiben?
Bauen
Aus einem Use Case wird ein konkreter Workflow mit passenden Prompts und klarer Rollenverteilung.
Prüfen
Quellen, Logik, Tonalität und Qualität werden abgesichert, bevor Ergebnisse weiterverwendet werden.
Erhalten
Wichtige Fähigkeiten bleiben beim Menschen: Urteil, Kontext, Stil und Entscheidungshoheit.
Entkoppeln
Der Prozess funktioniert nicht nur mit einem einzigen Tool. Alternativen und Fallbacks sind Teil des Systems.
Für wen
Für Menschen, die KI nutzen wollen — aber nicht blind.
KogNaut ist für Webdesignerinnen, Kreative, kleine Digitaldienstleister und kleine Teams, die KI produktiv nutzen wollen, ohne eigene Qualität, Tonalität und Urteilskraft zu verlieren.
Aus KI wird ein Angebotssystem
Nutze KI für Website-Texte, Briefings, Relaunch-Fragen, Audits und Kundenkommunikation, ohne beliebig zu werden.
Stimme behalten
Baue KI-Workflows, die Ideen, Struktur und Varianten liefern, ohne Tonalität und Markenlogik zu verwässern.
GEO und Prozesse verbinden
Verbinde Keyword-, Content- und Website-Wissen mit KI-Antwortfähigkeit, Prüfpunkten und wiederholbaren Abläufen.
Gemeinsame Regeln
Schaffe Guardrails, damit KI nicht zur unsichtbaren Schatten-Infrastruktur wird.
Warum jetzt
Jetzt ist der richtige Moment — aber nicht für blinden Hype.
KI-Tools sind billig, schnell und überall verfügbar. Genau deshalb lohnt es sich, sie früh in Angebot, Content und Kundenprozesse einzubauen. Aber wer jetzt alles ungeprüft auslagert, baut Abhängigkeiten auf: von Tools, Preisen, Plattformen und Ergebnissen, die überzeugend klingen, aber nicht automatisch richtig sind.
Early-Adopter-Vorteile mitnehmen
Nutze KI dort, wo sie echten Mehrwert bringt — bevor schlechte Gewohnheiten und Tool-Chaos zum Standard werden.
Qualität absichern
Menschliche Prüfpunkte verhindern, dass falsche Quellen, generische Sprache oder schwache Argumente einfach durchrutschen.
Unabhängig bleiben
Workflows, Fallbacks und Tool-Alternativen sorgen dafür, dass dein Prozess nicht an einer Plattform hängt.
Playbook statt Bauchgefühl
Am Ende stehen dokumentierte Abläufe, Prompts, Regeln und Checks, die wiederholbar genutzt werden können.
Formate
Der passende Einstieg für dein KI-Business-System
Bester Einstieg
KI Business Audit
90 MinutenKlarheit über KI-Hebel in Angebot, Website, Content, SEO/GEO und Kundenprozess. Ergebnis: priorisierte 30-Tage-Roadmap.
Option
AI Website Content Sprint
3 StundenEin prüfbarer Workflow für Website-Texte, FAQ, Angebotsseiten, GEO-Fragen und Tonalität.
Option
Offer & Process Upgrade
1–2 TageKI-gestützte Struktur für Briefing, Angebot, Scope, Feedback, Übergabe und Nachbetreuung.
Option
AI Delivery System
4 WochenWorkflows, Vorlagen, Prüfpunkte und ein KogNaut Playbook für ein belastbares KI-Arbeitssystem.
FAQ
Fragen? Antworten.
Ist KogNaut ein KI-Workshop?
Nicht nur. Workshops sind ein Teil davon. Eigentlich geht es um ein KI-Business-System: sinnvolle Workflows, klare Prüfpunkte, bessere Angebote und weniger Tool-Abhängigkeit.
Ist KogNaut nur für Webdesignerinnen?
Nein. Webdesignerinnen und Digitaldienstleister sind der erste Fokus, weil dort die KI-Hebel besonders konkret sind: Website-Texte, SEO/GEO, Briefing, Angebote, Audits und Kundenprozesse.
Brauche ich Vorkenntnisse?
Nein. Ein konkreter Arbeitskontext reicht. Wir arbeiten nicht an Spielzeug-Beispielen, sondern an echten Aufgaben.
Geht es nur um ChatGPT?
Nein. ChatGPT kann Teil davon sein, aber KogNaut ist nicht an ein einzelnes Tool gebunden. Der Prozess ist wichtiger als das Tool.
Ist das anti-KI?
Nein. Im Gegenteil. KogNaut hilft dir, KI besser zu nutzen — aber bewusst, prüfbar und souverän.
Was bedeutet KlarLoop?
KlarLoop ist die Methode hinter KogNaut. Sie sorgt dafür, dass KI-Workflows nicht blind automatisiert werden, sondern mit menschlichen Prüfpunkten, Skill-Erhalt und Tool-Unabhängigkeit funktionieren.
Kontakt
Starte mit einem KogNaut Check
Sag kurz, welches Angebot, welche Website- oder Kundenprozess-Aufgabe du mit KI verbessern willst.