Generieren einer Seite mit natürlicher Sprache

Verwenden Sie natürliche Sprache, um eine generative Seite zu erstellen, die mithilfe von KI erstellt wurde. Generative Seiten sind eine KI-gesteuerte Erfahrung, die den App-Designprozess in modellgesteuerten Apps vereinfachen, beschleunigen und verbessern soll. Durch die Interaktion mit dem App-Agent erstellen Sie voll funktionsfähige Seiten in Ihren modellgesteuerten Apps, indem Sie in natürlicher Sprache beschreiben, was Sie benötigen, und angeben, auf welche Microsoft Dataverse-Tabellen verwiesen werden sollen. Sie können sogar ein Bild anhängen, das zeigt, wie die Seite aussehen soll.

Nachdem Sie die Seite beschrieben haben, verarbeitet das System Ihre Anforderungen und Spezifikationen und generiert auf intelligente Weise React-Code, der sowohl die Front-End-Benutzererfahrung durch die Auswahl der richtigen Komponenten und die Bestimmung des besten Layouts als auch die entsprechende Geschäftslogik abdeckt. Durch ein interaktives, dialogorientiertes Erlebnis können Sie das Seitendesign in Echtzeit verfeinern und Elemente, Layout und Funktionalität so anpassen, dass sie perfekt zu Ihren Vorstellungen passen.

Voraussetzungen

Die Power Platform Umgebung muss sich in der Region USA befinden. Dieses Feature ist in anderen Regionen noch nicht verfügbar.

Eine generative Seite in modellgesteuerten Apps erstellen

Melden Sie sich bei Power Apps an.
Eine modellgesteuerte App zur Bearbeitung öffnen.
Wählen Sie im App-Designer Seite hinzufügen>Eine Seite beschreiben aus.

Eine ganzseitige generative Seite wird geöffnet.
Geben Sie im Textfeld eine Beschreibung des Seitentyps ein, den Sie erstellen möchten. Die Beschreibung sollte funktionale Anforderungen und optional eventuelle UX-Spezifikationen enthalten. Sie können z. B. eingeben eine Seite erstellen, auf der Kontodatensätze als Kartenkatalog angezeigt werden, in einem modernen Erscheinungsbild. Fügen Sie den Namen, das Entitätsbild oben sowie die Website, die E-Mail-Adresse und die Telefonnummer hinzu. Machen Sie den Katalog scrollbar, indem Sie Daten aus der Tabelle Konto verwenden.
Fügen Sie Tabellen und Bilder nach Bedarf hinzu, indem Sie Daten hinzufügen>Tabelle hinzufügen auswählen. Sie können bis zu sechs Dataverse-Tabellen verknüpfen. Im Screenshot wird die Kontotabelle hinzugefügt.
Laden Sie optional ein oder mehrere Bilder hoch, um die Benutzeroberfläche Ihrer generierten Seite zu leiten, indem Sie das Bild "Daten>anfügen" auswählen. Dabei kann es sich um eine grobe Skizze oder ein Bild mit höherer Auflösung handeln. Das Bild kann die Struktur oder das Layout der gesamten Seite darstellen, die Sie erstellen möchten, oder es kann visuelle Elemente für einen bestimmten Abschnitt oder eine bestimmte Komponente sein, die Sie nachahmen möchten.

Notiz

Wenn die generierte Seite ein bestimmtes Bild anzeigen soll, anstatt das Bild an die Eingabeaufforderung anzufügen, können Sie (1) das Bild in eine Tabelle mit Referenzdaten einschließen und den Agent das Bild von dort abrufen lassen, (2) das Bild öffentlich hosten und dem Agent die URL zuweisen oder (3) das Bild als Webressource hinzufügen und dem Agent die URL für die Webressource zuweisen.
Optional können Sie das Tool "Bilder einschließen " (Vorschau) aktivieren oder deaktivieren, damit der Agent Bilder aus einer kuratierten, sicheren Bibliothek von 25.000 Stockbildern nutzen kann, um Anwendungsfälle wie Standard-/Platzhalterbilder, dekorative Hintergründe, statische Inhaltsblöcke und umfangreichere leere oder Fehlerzustände zu unterstützen.
Wählen Sie optional das KI-Modell aus, das Sie zum Generieren der Seite verwenden möchten.
Wenn Sie mit dem Beschreiben der Seite fertig sind, wählen Sie Seite generieren.

Der Agent beginnt einen mehrstufigen Buildprozess, den Sie in Echtzeit beobachten können:

Streaming der Gedankenprozesse: Der Agent beschreibt zunächst seine Interpretation Ihres Prompts und listet Anforderungen, Annahmen und einen Ausführungsplan auf.
Codegenerierung: Als Nächstes wird der zugrunde liegende Code für Ihre Seite basierend auf dem Plan geschrieben.
Transpilierung: Der generierte Code wird dann transpiliert, um kompatibilitäts- und ordnungsgemäßes Rendering sicherzustellen.
Endgültiges Rendering: Schließlich wird die vollständige Benutzeroberfläche angezeigt.

Wenn die Benutzeroberfläche am Ende dieses Prozesses nicht angezeigt wird, können Sie sie anzeigen, indem Sie die Registerkarte "Vorschau " auswählen.

Eine erstellte Seite Benutzererfahrung

Generierten Code anzeigen, iterieren und veröffentlichen

Nach dem Generieren der Seite stehen Ihnen mehrere Optionen zur Optimierung und Fertigstellung zur Auswahl:

Anzeigen und Bearbeiten des generierten Codes Wählen Sie die Registerkarte "Code " aus, um den vom App-Agent generierten Code anzuzeigen.

Sie können die Ausgabe auf zwei Arten verfeinern:
- Chatten Sie iterativ mit dem App-Agent, um Fehler zu beheben, das Layout anzupassen oder Funktionen hinzuzufügen.
- Bearbeiten Sie den Code manuell, indem Sie auf der Registerkarte "Code" die Option "Bearbeiten " auswählen. Nachdem Sie einige Änderungen vorgenommen haben, können Sie "Speichern" auswählen, um ihre Änderungen als neue Iteration zu übernehmen, oder "Abbrechen ", um Ihre Änderungen zu verwerfen.
Iterationen vergleichen Nachdem Sie zwei oder mehr Iterationen mit dem Agent abgeschlossen haben, können Sie auf der Registerkarte "Code vergleichen " auswählen, um einen Code diff zwischen der aktuellen und vorherigen Iteration anzuzeigen.

Notiz

Diese Funktion ist derzeit nur ab der zweiten Iteration in der aktuellen Sitzung verfügbar.
Anfügen eines Screenshots für Kurzübersicht Wählen Sie in der Chatumgebung "Screenshot anfügen" aus, um einen Screenshot der aktuellen Vorschau mit Ihrer nächsten Interaktion mit dem App-Agent >. Ein Screenshot ist hilfreich, um die visuellen Elemente der Seite anzupassen. Alternativ können Sie andere Bilder anfügen, um die visuellen Elemente der gesamten Seite oder eines bestimmten Seitenabschnitts zu verfeinern.
Überprüfen auf Barrierefreiheitsprobleme (neu) Nach jeder Iteration der Codegenerierung überprüft der Barrierefreiheits-Assistent am unteren Bildschirmrand den generierten Code, der ihn hinsichtlich der Barrierefreiheit bewertet. Sie können eine Statusaktualisierung auf hoher Ebene direkt auf dem Bildschirm anzeigen und die detaillierten Ergebnisse in einem Panel öffnen. Wählen Sie "Auto-Reparatur" aus, um alle Verstöße direkt an den Agenten zu übergeben, damit er versucht, diese automatisch zu beheben.
Speichern und Veröffentlichen Wählen Sie in der Befehlsleiste "Speichern " aus, um zu vermeiden, dass der Fortschritt auf Der Seite verloren geht.
Wenn Sie mit Ihrer Seite zufrieden sind, wählen Sie "Speichern" und "Veröffentlichen " aus, um alle ausstehenden Änderungen für die App zu veröffentlichen, einschließlich aller generativen Seiten.

Wichtig

Während der Agent versucht, vollständigen, produktionsfähigen Code zu generieren, einschließlich Überlegungen zu Barrierefreiheit und bewährten Methoden für Barrierefreiheit und Sicherheit, sind Sie letztendlich für die Überprüfung des Codes verantwortlich. Stellen Sie sicher, dass der generierte Code die Standards und Complianceanforderungen Ihrer Organisation erfüllt.

Hinzufügen von generativen Seiten zu Lösungen

Generative Seiten sind lösungsfähig und können einer Lösung (über eine App) hinzugefügt werden, um das Wechseln zwischen Umgebungen zu erleichtern. Gehen Sie wie folgt vor, um einer Lösung eine generative Seite hinzuzufügen:

Wichtig

Wenn Ihre generative Seite während der Vorschauphase erstellt wurde, müssen Sie die generative Seite im Modell-App-Designer laden, um eine einmalige Migration zum neuen lösungsfähigen Datenmodell zu initiieren. Wenn die Seite im Designer geladen wird, wird die Statusmeldung "Aktualisieren der Seite" angezeigt. Schließen Sie das Fenster erst, wenn die Migration abgeschlossen ist.

Fügen Sie die App, die Ihre generativen Seiten enthält, zu einer Lösung hinzu.
- Wählen Sie in Power Apps im linken Navigationsbereich "Lösungen " aus, und öffnen Sie die gewünschte Lösung.
- Wählen Sie Vorh. hinzufügen > App > Modellgesteuerte App.
- Wählen Sie die App aus, die die generativen Seiten enthält.
Lösung exportieren (als verwaltet oder unverwaltet)
- Stellen Sie sicher, dass die App-Sitemap in der Lösung enthalten ist. Andernfalls sollte sie bei Abhängigkeitsprüfungen angefordert werden.
- Generative Seiten (dargestellt als UX Agent Project-Zeilen ) werden auch basierend auf ihrer Abhängigkeit von der Sitemap angefordert.

Notiz

Überprüfen Sie diese Elemente, wenn während abhängigkeitsprüfungen keine generativen Seiten angefordert werden:

Während der Vorschau erstellte Seiten werden nur angezeigt, wenn sie migriert wurden. Laden Sie sie im Designer, um die Migration auszulösen.
Wenn die Sitemap in der Lösung enthalten ist und Ihre generativen Seiten migriert wurden, versuchen Sie, eine geringfügige Änderung an der Sitemap vorzunehmen, z. B. neu anzuordnen oder eine Seite umzubenennen, die App erneut zu veröffentlichen und dann den Export erneut zu versuchen.

Nach dem Export können Sie die App und generative Seiten in eine andere Umgebung importieren. Beim Öffnen im Designer in der Zielumgebung sind nur die erste Eingabeaufforderung und der veröffentlichte Code verfügbar. Die vollständige Agent-Unterhaltung wird nicht mit der Seite übertragen.

Einschränkungen

Dies sind die aktuellen Größenbeschränkungen von generativen Seiten:

Ihre Seite kann nur Dataverse-Tabellen verbinden (bis zu 6 für eine einzelne Seite). Es können keine anderen Datenquellen verwendet werden.
Ihre Eingabeaufforderung kann maximal 50.000 Zeichen enthalten.
Es werden nur US-englische Inhalte unterstützt.
Kollaboration wird nicht unterstützt. Stellen Sie sicher, dass jeweils nur ein Ersteller an einer generativen Seite arbeitet, um unbeabsichtigte Konflikte zu vermeiden.
Nur diese Datentypen werden unterstützt:
- Auswahl
- Währung
- Customer
- Datum und Uhrzeit
- Nur Datum
- Dezimalzahl
- Gleitkommazahl
- Image
- Suche
- Mehrzeiliger Text
- Status
- Statusgrund
- Text
- Ganze Zahl
- Ja/Nein
- Eindeutiger Bezeichner

Häufig gestellte Fragen

Kann ich mit dem Entwerfen meiner App im Plan-Designer beginnen und dann generative Seiten verwenden?

Ja, während es derzeit keine direkte Integration zwischen Plänen und generativen Seiten gibt, können Sie Pläne verwenden, um Ihre Tabellen und Apps zu definieren, und dann zum modellgesteuerten App-Designer wechseln, um alle gewünschten generativen Seiten zu erstellen.

Fallen zusätzliche Gebühren oder Guthaben an, die für die Nutzung generativer Seiten erforderlich sind?

Nein, die Entwicklungsumgebung für generative Seiten (und Pläne) erfordert keine zusätzliche KI- oder Nachrichtenguthaben.

Welche Art von Bildern eignet sich am besten für die Steuerung der Benutzeroberflächengenerierung?

Es hängt von Ihrem Ziel ab. Wenn Sie genau wissen, wie die letzte Seite aussehen soll, klare und detaillierte Skizzen oder Drahtmodelle (ob handgezeichnet oder digital) am effektivsten sind. Wenn Sie nur ein allgemeines Konzept haben und möchten, dass der Agent die Details ausfüllt, können schnelle Whiteboardskizzen oder sogar Napkinzeichnungen gut funktionieren.

Kann ich generative Seiten mit Canvas-Apps oder anderen App-Typen verwenden?

Nein, generative Seiten werden derzeit nur in modellgesteuerten Apps unterstützt.

Gibt es eine Möglichkeit, eine generative Seite umgebungsübergreifend wiederzuverwenden oder zu klonen?

Ja, generative Seiten sind lösungsbewusste Elemente, die umgebungsübergreifend verschoben werden können. Nur die letzte veröffentlichte Version des Codes und die erste Eingabeaufforderung werden mit der Lösung beibehalten; Der vollständige Überarbeitungsverlauf verbleibt in der ursprünglichen Umgebung.

Kann ich den generierten Code manuell bearbeiten?

Ja. Sie können den generierten Code manuell bearbeiten, indem Sie auf der Registerkarte "Code" die Option "Bearbeiten" auswählen. Ihre Änderungen werden als neue Iteration gespeichert. Wählen Sie "Abbrechen " aus, um Ihre Bearbeitungen abzubrechen, wenn Sie diese nicht beibehalten möchten.

Wird der von generativen Seiten generierte Code garantiert produktionsbereit und den Standards meiner Organisation entsprechen?

Nein. Während der Agent versucht, qualitativ hochwertigen, produktionsfähigen Code mit bewährten Methoden für Barrierefreiheit und Sicherheit zu erstellen, liegt es in Ihrer Verantwortung, die Ausgabe zu überprüfen. Überprüfen Sie immer den generierten Code, um sicherzustellen, dass er den Standards, Richtlinien und Complianceanforderungen Ihrer Organisation entspricht.

Wie gebe ich Feedback zu dieser Funktion?

Die beste Möglichkeit, Feedback zu generativen Seiten zu geben, besteht darin, die Daumen-hoch/runter-Schaltflächen in der Chat-Umgebung zu verwenden, die nach jeder Iteration verfügbar sind. Es wird außerdem dringend empfohlen, bei Teilen relevanter Inhaltsbeispiele und zusätzlicher Protokolldateien die Option Ja auszuwählen, damit wir alle Probleme, die mit der Funktion aufgetreten sind, debuggen oder versuchen können, sie neu zu erstellen.

Was ist, wenn ich in meiner Umgebung keine generativen Seiten aktiviert sehe?

Vergewissern Sie sich, dass sich Ihre Umgebung in der US-Region befindet.

Feedback

War diese Seite hilfreich?

Last updated on 2026-01-08