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
KI-Bar
KI für Macher:innen. Machbar für dein Business.
KI-Bar ist für Selbstständige und kleine Teams, die nicht noch einen Tool-Kurs suchen, sondern ins Machen kommen wollen: mit KI, Workflows, Automatisierung und besseren Abläufen.
Live, online und vor Ort · direkt an deinen echten Aufgaben
States
Navigation, Overlays und Utilities
Molecules
Echte Startseiten-Komponenten
ServiceCard
Live-Workshop
In 3 Stunden baust du einen ersten KI-Workflow für Content, E-Mails, Angebote oder Recherche.
KI-Sprint
Vier Wochen Umsetzung in kleiner Gruppe. Am Ende steht dein eigenes KI-Arbeitssystem.
1:1 Setup
Wir bauen mit dir Prompts, Vorlagen und Abläufe, die direkt zu deinem Business passen.
FeatureCard
Use Case wählen
Du startest mit einer Aufgabe, die dir wirklich Zeit, Sichtbarkeit oder Sicherheit bringt.
Workflow bauen
Wir gehen an echte Aufgaben: Texte, Ideen, Angebote, Planung, Recherche, Kund:innen-Kommunikation und Sichtbarkeit.
Systematisieren
Aus einzelnen Prompts werden wiederholbare Abläufe, Vorlagen und kleine Routinen.
Sicherer entscheiden
Du lernst, welche Ergebnisse brauchbar sind, wo du prüfen musst und wie du KI verantwortungsvoll nutzt.
Dranbleiben
Mit Workshops, Sprint und 1:1-Setup findest du den Einstieg, der zu deinem Tempo passt.
BenefitItem
KI ohne Technikjargon, aber mit echtem Ergebnis.
Beispiele aus Selbstständigkeit, KMU, Marketing und Kund:innen-Arbeit.
Konkrete Abläufe statt Tool-Listen, die morgen wieder veraltet sind.
DetailCard
1. Verstehen
Wir schauen auf deine Aufgaben, Ziele, Werkzeuge und die Stellen, an denen gerade Zeit verloren geht.
2. Fokus setzen
Wir wählen einen konkreten Use Case: Content, Angebote, Recherche, Planung oder Kund:innen-Kommunikation.
3. Workflow bauen
Aus deinem Use Case wird ein klarer Ablauf mit Prompts, Vorlagen und Prüfpunkten.
4. Anwenden
Du testest den Workflow an echten Aufgaben und schärfst ihn so nach, dass er in deinem Alltag bleibt.
PackageCard
Live-Workshop
79–179 EUR3 Stunden online oder vor Ort. Du baust einen ersten Workflow für Content, Angebote, E-Mails oder Recherche.
KI-Sprint
399–799 EURVier Wochen in kleiner Gruppe. Du entwickelst dein eigenes KI-Arbeitssystem mit Feedback und Struktur.
1:1 Setup
690–1.500 EURPersönliche Begleitung für Prompts, Vorlagen, Tools und Abläufe, die zu deinem Business passen.
Team-Workshop
1.200–4.500 EURHalb- oder Ganztagesformat für kleine Unternehmen, Verbände, Netzwerke und Teams.
JournalGrid
GEO statt nur SEO: Wie du in KI-Antworten sichtbar wirst
Generative Engine Optimization sorgt dafür, dass ChatGPT, Gemini und Perplexity dein Angebot verstehen, einordnen und als Quelle empfehlen können.
SichtbarkeitKI-Agenten sind keine Magie: Was du delegieren kannst und was nicht
Agenten, Browser-Automation und Vibe-Tools wirken schnell beeindruckend. Wertvoll werden sie erst, wenn Aufgabe, Grenze und Freigabe sauber sitzen.
Workflow DesignMCP einfach erklärt: Wenn KI deine Tools wirklich versteht
Das Model Context Protocol verbindet KI mit Dateien, Datenbanken und Tools. Für kleine Teams ist das stark, solange Zugriff und Kontext bewusst gestaltet sind.
Tool StackWarum gute KI-Arbeit nicht bei Prompts endet
Ein guter Prompt spart Minuten. Ein guter Workflow spart Wiederholung, reduziert Fehler und macht Ergebnisse im Team nachvollziehbar.
ArbeitsabläufeStepItem & FAQItem
Use Case wählen
Workflow bauen
Vorlagen sichern
Im Alltag nutzen
Brauche ich Vorkenntnisse?
Nein. KI-Bar ist genau für Einsteiger:innen gemacht, die noch keine KI-Erfahrung haben.
Welche Tools brauche ich?
Nur einen Laptop und Internet. Alles andere zeigen wir dir im Workshop.
Kann ich auch ohne Workshop starten?
Ja, mit unseren Selbstlern-Formaten oder dem 1:1 Setup findest du deinen eigenen Einstieg.
Für wen ist KI-Bar gedacht?
Für Selbstständige, kleine Teams und Menschen, die KI praktisch in ihren Arbeitsalltag bringen wollen. Der Fokus liegt auf zugänglichen Formaten, klarer Sprache und echten Workflows statt Tool-Hype.
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 |
| KI-Bar 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
KI-Bar
KI für Macher:innen. Machbar für dein Business.
KI-Bar ist für Selbstständige und kleine Teams, die nicht noch einen Tool-Kurs suchen, sondern ins Machen kommen wollen: mit KI, Workflows, Automatisierung und besseren Abläufen.
Live, online und vor Ort · direkt an deinen echten Aufgaben

Nicht mehr nur ausprobieren.
Baue dir ein System, das bleibt.Warum jetzt?
Der Gender AI Gap ist real. Aber er ist nicht fix.
Nur 22% der KI-Fachkräfte, 12% der KI-Forschenden und 18% der Sprecher:innen auf großen Tech-Konferenzen sind Frauen. Gleichzeitig setzen viele Arbeitgeber und Auftraggeber:innen KI-Kenntnisse voraus. Diese Zahlen sind kein Grund, sich ausgeschlossen zu fühlen. Sie sind eine Einladung: Du kannst KI für deine Arbeit nutzbar machen.
KI-Bar ist kein generischer Tool-Kurs. Wir übersetzen KI in deine Aufgaben: Angebote schreiben, Content planen, Kund:innen-Kommunikation verbessern, Recherche strukturieren und wiederkehrende Arbeit vereinfachen.
KI ohne Technikjargon, aber mit echtem Ergebnis.
Beispiele aus Selbstständigkeit, KMU, Marketing und Kund:innen-Arbeit.
Konkrete Abläufe statt Tool-Listen, die morgen wieder veraltet sind.
KI-Bar gibt es, weil KI gerade die Arbeitswelt verändert, aber viele Frauen dabei noch zu selten mitgedacht werden. Die Lücke entsteht nicht, weil Frauen weniger können. Sie entsteht, wenn Zugänge fehlen, Sprache abschreckt und Technikräume nicht für alle offen wirken. Hinter KI-Bar steht [VORNAME]. [HINTERGRUND IN 1 SATZ] Wir glauben: KI darf nicht nur denen gehören, die sowieso schon nah an Technik sind. Du sollst verstehen können, was möglich ist, ohne dich klein zu fühlen oder dich durch Fachsprache kämpfen zu müssen. KI-Bar macht KI greifbar, praktisch und menschlich, damit du sie selbstbewusst für deine Arbeit nutzen kannst.
Dein Angebot
Wie du KI nutzbar machst
Live-Workshop
In 3 Stunden baust du einen ersten KI-Workflow für Content, E-Mails, Angebote oder Recherche.
Workshop anfragenKI-Sprint
Vier Wochen Umsetzung in kleiner Gruppe. Am Ende steht dein eigenes KI-Arbeitssystem.
Sprint vormerken1:1 Setup
Wir bauen mit dir Prompts, Vorlagen und Abläufe, die direkt zu deinem Business passen.
Setup anfragenRessourcen
So wird KI greifbar
Du lernst nicht alles auf einmal. Du startest mit den Aufgaben, die dir heute Zeit, Sichtbarkeit oder Sicherheit bringen.
Use Case wählen
Du startest mit einer Aufgabe, die dir wirklich Zeit, Sichtbarkeit oder Sicherheit bringt.
Workflow bauen
Wir gehen an echte Aufgaben: Texte, Ideen, Angebote, Planung, Recherche, Kund:innen-Kommunikation und Sichtbarkeit.
Systematisieren
Aus einzelnen Prompts werden wiederholbare Abläufe, Vorlagen und kleine Routinen.
Sicherer entscheiden
Du lernst, welche Ergebnisse brauchbar sind, wo du prüfen musst und wie du KI verantwortungsvoll nutzt.
Dranbleiben
Mit Workshops, Sprint und 1:1-Setup findest du den Einstieg, der zu deinem Tempo passt.
Für wen
Das ist für dich, wenn…
KI-Bar ist für dich, wenn du KI nutzen willst, aber keine Lust auf Fachsprache, Tool-Chaos oder Kurse hast, die an deinem Alltag vorbeigehen.
Du willst Zeit sparen
Du willst Angebote, Content, Planung oder Kund:innen-Kommunikation schneller vorbereiten, ohne Qualität zu verlieren.
Du willst mitreden
Du willst verstehen, was KI für dein Unternehmen bedeutet, ohne dich auf Tech-Floskeln verlassen zu müssen.
Du willst Struktur
Du hast ChatGPT oder andere Tools ausprobiert, aber noch keinen Ablauf, der wirklich hängen bleibt.
Du darfst einfach anfangen
Du brauchst kein Vorwissen. KI-Bar holt dich dort ab, wo du stehst.
Ressourcen
Einblicke & Materialien

Workshop
In kleinen Gruppen baust du KI-Workflows für dein konkretes Business - kein Theorie-Marathon.
Warum KI-Bar?
Wie läuft es ab?
Zuerst verstehen wir deine Aufgaben und Alltagssituation. Danach entsteht Schritt für Schritt ein Ablauf, den du wirklich im Alltag nutzt.
1. Verstehen
Wir schauen auf deine Aufgaben, Ziele, Werkzeuge und die Stellen, an denen gerade Zeit verloren geht.
2. Fokus setzen
Wir wählen einen konkreten Use Case: Content, Angebote, Recherche, Planung oder Kund:innen-Kommunikation.
3. Workflow bauen
Aus deinem Use Case wird ein klarer Ablauf mit Prompts, Vorlagen und Prüfpunkten.
4. Anwenden
Du testest den Workflow an echten Aufgaben und schärfst ihn so nach, dass er in deinem Alltag bleibt.
Formate
Wähle deinen Einstieg
Live-Workshop
79–179 EUR3 Stunden online oder vor Ort. Du baust einen ersten Workflow für Content, Angebote, E-Mails oder Recherche.
KI-Sprint
399–799 EURVier Wochen in kleiner Gruppe. Du entwickelst dein eigenes KI-Arbeitssystem mit Feedback und Struktur.
1:1 Setup
690–1.500 EURPersönliche Begleitung für Prompts, Vorlagen, Tools und Abläufe, die zu deinem Business passen.
Team-Workshop
1.200–4.500 EURHalb- oder Ganztagesformat für kleine Unternehmen, Verbände, Netzwerke und Teams.
FAQ
Fragen? Antworten.
Brauche ich Vorkenntnisse?
Nein. KI-Bar ist genau für Einsteiger:innen gemacht, die noch keine KI-Erfahrung haben.
Welche Tools brauche ich?
Nur einen Laptop und Internet. Alles andere zeigen wir dir im Workshop.
Kann ich auch ohne Workshop starten?
Ja, mit unseren Selbstlern-Formaten oder dem 1:1 Setup findest du deinen eigenen Einstieg.
Für wen ist KI-Bar gedacht?
Für Selbstständige, kleine Teams und Menschen, die KI praktisch in ihren Arbeitsalltag bringen wollen. Der Fokus liegt auf zugänglichen Formaten, klarer Sprache und echten Workflows statt Tool-Hype.
Kontakt
Dein nächster KI-Schritt
Sag kurz, wo du stehst. Wir melden uns mit dem passenden Einstieg: Live-Workshop, KI-Sprint, 1:1-Setup oder Team-Format.





