Übersicht

Verbinden Sie Ihren KI-Assistenten mit dem Avonni-MCP-Server und installieren Sie die Avonni Skills, um Avonni-Komponenten auf Ihren Experience-Site-Seiten über Eingaben in natürlicher Sprache zu erstellen und zu aktualisieren.

🚧 Frühzugang. Build with AI wird schrittweise eingeführt und mit jedem Release verbessert. Etwas unklar, fehlt etwas oder ist etwas kaputt? Sag es uns: Dein Feedback beeinflusst direkt, was wir als Nächstes verbessern.

Beschreiben Sie in einfachen Worten, was Sie möchten, und Ihr KI-Assistent (Claude, Cursor oder GitHub Copilot) fügt Ihren Experience-Site-Seiten echte, funktionsfähige Avonni-Komponenten hinzu. Zwei Tools machen das möglich:

🧠 Avonni MCP-Server

Ein gehosteter Dokumentationsdienst, der dem Assistenten präzises, stets aktuelles Wissen über alle 44 Experience Cloud Components vermittelt: ihre Eigenschaften, Interaktionen und ihr Styling.

🛠️ Avonni Skills

Schritt-für-Schritt-Workflows, die dem Assistenten beibringen, wie man Avonni-Komponenten zu einer Site-Seite hinzufügt und korrekt konfiguriert.

Kurz gesagt: Skills sagen dem Agenten, was zu tun ist; das MCP sagt ihm, was wahr ist. Das eine ohne das andere liefert schlechtere Ergebnisse. Installieren Sie beide.

Warum Sie beide brauchen

KI-Assistenten werden mit öffentlichen Daten trainiert, daher ist ihr Wissen über Avonni unvollständig und veraltet. Wenn sie auf sich allein gestellt sind, erfinden sie Eigenschaftsnamen, raten bei Interaktionstypen und erzeugen Seiteninhalte, die Experience Builder ablehnt. Das Ergebnis sieht plausibel aus, funktioniert aber nicht.

Die beiden Tools lösen unterschiedliche Hälften des Problems:

	Was es bietet	Was es behebt
Avonni MCP	Wissen. Präzise Komponentendokumentation, Interaktionen und Styling für das Experience Paket sowie die dynamischen, Flow und LWC Pakete.	Keine erfundenen Eigenschaften oder Interaktionsnamen mehr. Der Assistent sucht die echte Konfiguration nach, statt zu raten.
Avonni Skills	Prozess. Workflows zum Erstellen und Aktualisieren jedes Avonni-Artefakttyps sowie avonni-architect, das Anwendungsfälle mit mehreren Artefakten koordiniert.	Der Assistent erzeugt gültige Seiteninhalte und folgt der richtigen Abfolge von Schritten, statt zu improvisieren.

Heute schnell, morgen wartbar

Ein KI-Assistent könnte Ihre Portal-Funktionen auch schnell als benutzerdefinierten Code erstellen. Der Unterschied zeigt sich nach der Demo: benutzerdefinierter Code muss für immer von Ihnen gewartet werden, und auf einer kundenorientierten Website ist dieses Risiko öffentlich. Avonni-Komponenten vermeiden die Falle:

✍️ Konfiguration statt Code	Ein Prompt erzeugt Seiteninhalte: welche Komponenten, welche Daten, welche Interaktionen, mit dem Branding Ihrer Website über Design-Tokens. Kein benutzerdefiniertes JavaScript läuft vor Ihren Kunden.
🛡️ Die Komplexität liegt bei Avonni	Data Table, Kanban, Calendar und der Rest leben im verwalteten Paket: getestet, versioniert und mit jeder Version aktualisiert. Aktualisieren Sie das Paket, und das, was die KI erstellt hat, funktioniert weiter.
🧩 Ihre Site-Builder behalten die Kontrolle	Was die KI erstellt, ist eine normale Experience-Builder-Seite, die dieselben Komponenten verwendet, die Ihr Team bereits manuell konfiguriert. Jeder kann sie öffnen, verstehen und weiterentwickeln.

Was der Assistent erzeugt

Die avonni-experience-components Skill arbeitet an der Inhaltsdatei Ihrer Site-Seite. Er fügt die Avonni-Komponente der Seite hinzu und konfiguriert ihre Daten, Darstellung und Interaktionen. Es wird nichts bereitgestellt: Sie überprüfen die Datei, stellen sie mit Ihrem üblichen Prozess bereit, öffnen dann die Seite im Experience Builder, um das Ergebnis zu prüfen, und veröffentlichen die Site.

Von einer einzelnen Komponente zu einem kompletten Anwendungsfall

Echte Anforderungen enden selten bei einem Artefakt. Der avonni-architect Skill verwandelt ein Geschäftsergebnis in einen Plan und ruft dann die richtigen Skills in Abhängigkeitsreihenfolge auf, sodass jedes Teil korrekt mit den anderen verbunden ist.

Beispiel: "Fügen Sie meiner Support-Portal-Seite eine Case-Liste hinzu und einen Bildschirm-Flow zum Erstellen eines Cases, der von einem Button aus geöffnet wird." Der Architekt erstellt zuerst den Flow und fügt dann die Komponenten zur Seite hinzu, wobei der Button so verdrahtet wird, dass er diesen Flow öffnet.

In diesem Abschnitt