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

1. Melden Sie sich bei Power Apps an.

2. Eine modellgesteuerte App zur Bearbeitung öffnen.

3. Wählen Sie im App-Designer Seite hinzufügen>Eine Seite beschreiben aus.

   Eine ganzseitige generative Seite wird geöffnet.

4. 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.

5. 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.

6. Laden Sie optional ein Bild hoch, um die Benutzeroberfläche Ihrer generierten Seite zu steuern, indem Sie Daten hinzufügen>Bild anhängen auswählen. Dabei kann es sich um eine grobe Skizze oder ein Bild mit höherer Auflösung handeln.

7. Wählen Sie optional das KI-Modell aus, das Sie zum Generieren der Seite verwenden möchten.

8. 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 seiner 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.

Generierten Code anzeigen, iterieren und veröffentlichen

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

1. 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.

2. 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.

3. Anfügen eines Screenshots für Kurzübersicht Klicken Sie in der Chatumgebung auf "Screenshot anfügen", um einen Screenshot der aktuellen Vorschau mit Ihrer nächsten Interaktion mit dem App-Agent >. Dies ist hilfreich, um die visuellen Elemente der Seite anzupassen.

4. 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.

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:

1. Fügen Sie die App mit Ihren generativen Seiten 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.
2. 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.

Nach dem Export können Sie die App und generative Seiten in eine andere Umgebung importieren. Wenn sie im Designer in der Zielumgebung geöffnet wird, stehen nur die erste Eingabeaufforderung und der veröffentlichte Code zur Verfügung. 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). Sie können Vorgänge (CRUD) mit diesen Tabellen erstellen, lesen, aktualisieren und löschen. 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 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.

Ähnliche Artikel

• Häufig gestellte Fragen zu generativen Seiten in modellgesteuerten Apps
• Rechtliche Bestimmungen